SEO Meta 标签：标题、描述与 Open Graph 完整指南
Meta 标签是你的网站在搜索结果和社交媒体上留下的第一印象。它们告诉搜索引擎你的页面内容是什么，并控制你的内容在网络上分享时的展示方式。尽管 Meta 标签很简单，但它们仍然是你能够控制的最有影响力的 SEO 元素之一。本指南涵盖了每一个重要的 Meta 标签，并为每个标签提供了实用的优化策略。
Title 标签：最重要的 Meta 元素
Title 标签是最重要的页面内 SEO 元素。它显示为搜索结果中可点击的标题、浏览器中的标签页标题，以及默认的书签名称。一个优化良好的 title 标签可以显著提高你的点击率和搜索排名。
Title 标签的最佳实践
- 长度：将标题保持在 50-60 个字符之间。Google 会在大约 600 像素后截断标题，根据字母宽度通常意味着 55-60 个字符。
- 主要关键词前置：将最重要的关键词放在标题开头。搜索引擎对较早出现的词赋予更高权重。
- 品牌名称：在末尾包含品牌名称，用竖线或破折号分隔。例如："如何压缩网页图片 | ToolHub"。
- 每页唯一：每个页面都应有准确描述其特定内容的唯一标题。重复的标题会混淆搜索引擎并稀释相关性信号。
- 避免关键词堆砌：不要在标题中塞入同一关键词的多个变体。在包含目标关键词的同时，为人类自然地书写。
Meta Description：你的搜索结果广告文案
Meta description 是页面内容的简要摘要，显示在搜索结果的标题下方。虽然 Google 已声明 meta description 不是直接的排名因素，但它们显著影响点击率，从而间接影响排名。
撰写有效的 Meta Description
- 长度：目标为 150-160 个字符。Google 在桌面端大约 920 像素、移动端 680 像素后截断描述。
- 包含目标关键词：Google 会在描述中加粗匹配的搜索词，使你的结果更加醒目。
- 添加行动号召：如 "了解如何"、"发现" 或 "开始使用" 等短语鼓励用户点击。
- 匹配搜索意图：你的描述应与用户寻找的内容一致。信息型查询需要与交易型查询不同的描述。
- 避免重复：每个页面需要唯一的描述。Google 可能忽略通用或重复的描述，转而从页面内容自行生成摘要。
Open Graph 标签：控制社交媒体预览
Open Graph（OG）标签由 Facebook 创建，现在被 LinkedIn、Discord、Slack 和大多数社交平台用来确定你的内容在分享时的展示方式。没有 OG 标签，平台会猜测使用哪个标题、描述和图片，往往会出错。
基本的 Open Graph 标签
| 标签 | 用途 | 示例 |
|---|---|---|
| og:title | 内容标题 | 如何压缩网页图片 |
| og:description | 内容描述 | 了解如何压缩图片... |
| og:image | 预览图片 URL | https://example.com/image.jpg |
| og:url | 页面的规范 URL | https://example.com/page |
| og:type | 内容类型 | article、website、product |
| og:site_name | 网站名称 | ToolHub |
OG 图片最佳实践
- 使用至少 1200 x 630 像素的图片，以在所有平台上获得最佳显示效果
- 将重要内容居中放置，因为不同平台的图片裁剪方式不同
- 使用 1.91:1 的宽高比，确保在 Facebook、LinkedIn 和 Twitter 上一致显示
- 文件大小保持在 5MB 以下，确保预览快速加载
- 在图片中包含品牌标志和页面标题，以获得最大识别度
Twitter Card 标签
Twitter 除了 Open Graph 外还使用自己的 Card 标签。虽然 Twitter 在缺少 Card 标签时会回退使用 OG 标签，但明确定义两者可确保在所有平台上显示一致。
- twitter:card：卡片类型。使用 "summary" 显示小图片或 "summary_large_image" 显示特色图片。
- twitter:title：内容标题（最多 70 个字符）。
- twitter:description：内容描述（最多 200 个字符）。
- twitter:image：要显示的图片 URL。
其他重要的 Meta 标签
Canonical 标签
Canonical 标签（link rel="canonical"）告诉搜索引擎当多个 URL 提供相同内容时，哪个 URL 版本是首选的。这可以防止重复内容问题并整合链接权重。始终在 canonical 标签中使用绝对 URL。
Robots Meta 标签
Robots meta 标签控制搜索引擎如何抓取和索引你的页面。常见指令包括 "index, follow"（默认行为）、"noindex, follow"（不索引但跟踪链接）和 "noindex, nofollow"（完全排除）。对薄弱页面、感谢页面和你不想出现在搜索结果中的内容使用 noindex。
Viewport Meta 标签
Viewport 标签对移动端响应式设计至关重要。在每个页面上使用 meta name="viewport" content="width=device-width, initial-scale=1.0"。没有它，移动浏览器会以桌面宽度渲染页面并缩小，导致文字过小和可用性差。
字符编码和语言
始终使用 meta charset="UTF-8" 声明字符编码，并在 html 元素上使用 lang 属性声明页面语言。这些声明帮助浏览器正确渲染文本，帮助搜索引擎理解你内容的语言。
应避免使用的 Meta 标签
一些 Meta 标签已经过时或无效，不应再使用：
- meta keywords：Google 自 2009 年起不再使用此标签作为排名因素。它浪费带宽，还可能向竞争对手暴露你的关键词策略。
- meta revisit-after：搜索引擎根据自身算法确定抓取频率，而非此标签。
- meta author：这没有 SEO 价值。请使用结构化数据来提供作者信息。
验证你的 Meta 标签
实现 Meta 标签后，使用以下工具进行验证：
- Facebook Sharing Debugger：验证 Open Graph 标签并显示内容在 Facebook 上分享时的外观。
- Twitter Card Validator：预览内容在 Twitter 卡片中的展示效果。
- Google Rich Results Test：检查结构化数据并预览页面在搜索结果中可能的展示方式。
- Meta Tags Generator：使用我们的 Meta 标签生成器创建格式正确的标签并预览其展示效果。
使用我们的免费工具为你的网站生成格式完美的 Meta 标签。
试试 Meta 标签生成器常见问题
meta keywords 对 SEO 还重要吗？
不，包括 Google 和 Bing 在内的主要搜索引擎已确认它们不使用 meta keywords 标签作为排名因素。Google 在 2009 年就停止使用它了。请将精力集中在 title 标签、meta description 和结构化数据上。
meta title 应该多长？
Meta title 应在 50-60 个字符之间，以避免在 Google 搜索结果中被截断。Google 大约显示 600 像素宽度的标题文本，根据字母宽度通常可容纳约 55-60 个字符。
如果不添加 Open Graph 标签会怎样？
没有 Open Graph 标签，社交媒体平台会自动从你的页面中选择标题、描述和图片，这可能不是最优的。你可能会遇到预览损坏、图片错误或描述截断的问题。Open Graph 标签让你完全控制内容分享时的展示方式。
Google 还使用 meta description 作为排名因素吗？
Google 不使用 meta description 作为直接的排名信号。然而，精心编写的 meta description 可以显著提高搜索结果的点击率，这间接地传递相关性信号，并可能随时间推移对排名产生积极影响。
每个页面都应该有唯一的 meta description 吗？
是的，每个页面都应该有唯一且准确描述其内容的 meta description。跨页面的重复或通用 meta description 可能导致 Google 忽略它们并自行生成摘要，这些摘要对用户的吸引力可能较低。