开放图谱标签会影响SEO吗？

并非直接相关——像谷歌这样的搜索引擎不会使用OG标签来进行排名。但它们会影响社交平台和即时通讯应用中的点击率，从而带来间接表明相关性的流量。可以将它们视为共享链接的转化优化手段。

平台多久重新抓取开放图形标签？

这取决于具体情况。Facebook 的缓存时间最长可达30天，LinkedIn 的缓存时间可能长达一周或更久。Slack 每当在频道中发布链接时都会重新获取，因此内容通常是最新的。在更新标签后，请始终使用平台的调试工具强制重新抓取。

我可以为推特使用不同于其他平台的图片吗？

是的。为 Facebook、LinkedIn、Discord 和 Slack 设置 og:image，为 Twitter/X 设置单独的 twitter:image。它们可以指向不同的文件——如果希望 Twitter 使用方形裁剪，而其他平台使用 1200×63及宽屏，则非常有用。

如果我完全不添加OG标签会怎样？

该平台会抓取您的页面并进行猜测。它可能会从您的标签中提取页面标题，获取页面中的第一段文字作为描述，并随机选择页面上的一个图片——通常是一个标志、广告单元或图标。最终结果通常都是错误的，且很少能被点击。

单页应用（SPAs）中开放图标签是否有效？

只有在服务器渲染的HTML中存在OG标签时才有效。平台在抓取数据时不会执行JavaScript——它们会读取原始的HTML响应。如果您的单页应用（SPA）仅在客户端渲染内容，那么这些内容中的OG标签将无法被识别。请使用服务器端渲染（SSR）或静态生成，以确保标签存在于初始的HTML内容中。

不喜欢广告？去无广告今天 

开放图形标签 — 停止你的链接在 Slack 上看起来糟糕

Q: 如果我完全不添加OG标签会怎样？

该平台会抓取您的页面并进行猜测。它可能会从您的 标签中提取页面标题，获取页面中的第一段文字作为描述，并随机选择页面上的一个图片——通常是一个标志、广告单元或图标。最终结果通常都是错误的，且很少能被点击。

发布日期 2026年5月23日

开放图谱标签控制在Slack、LinkedIn、Twitter和Discord中分享链接时显示的图片、标题和描述。了解6个关键标签，如何正确设置og:image的尺寸，以及如何测试您的预览是否正常工作。

广告移除？

您将一个URL粘贴到Slack中。原本应该出现一个包含大图片、标题和两行摘要的丰富预览，但您只看到一个纯链接，或者看到页面中间随机的一句话。您的团队成员仍然点击了它，但他们根本不知道即将看到的内容是什么。

开放图形标签解决了这个问题。它们是页面中的一小段代码 <meta> that tell Slack, LinkedIn, Twitter, Discord, and every other platform exactly what to show when someone shares your URL. Leave them out and the platform guesses — badly. <head> 什么是开放图形标签？

开放图形（OG）是Facebook在2010年推出的一种协议，旨在让网页在平台分享时能够控制其显示方式。其核心理念很简单：在HTML中添加结构化元数据，这样平台就能正确获取标题、描述和图片，而不是盲目猜测。

它效果非常好，因此各大平台都采用了这一协议。如今，Slack、LinkedIn、Twitter/X、iMessage、WhatsApp和Telegram在生成链接预览时都会读取OG标签。Facebook也仍然在使用这些标签。 <head> 6个必备的开放图形标签

这些六个标签应出现在您希望分享的每一页上。如果缺少任何一个，平台将自行填充空白内容——通常填充得并不准确。

og:title

——预览中显示的标题。保持在70个字符以内。不要简单复制您的

<meta property="og:title" content="Your Page Title Here" />
<meta property="og:description" content="One or two sentences that explain what this page is about." />
<meta property="og:image" content="https://yoursite.com/images/og-image.jpg" />
<meta property="og:url" content="https://yoursite.com/your-page/" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="Your Site Name" />

tag — OG标题可以更简洁有力，因为不需要包含网站名称。 og:description <title> ——标题下方的两行摘要。150到200个字符是最佳范围。让它对读者有用，而不是模糊不清。
og:image ——预览卡片中显示的图片。这个标签决定了链接外观的好坏。下文会介绍尺寸要求。
og:url ——该页面的规范URL。始终使用完整的URL，包括
。这可以防止相同内容从不同URL链接时出现重复预览。 og:type https://——大多数页面使用
。博客文章使用 ，并搭配 website og:site_name article ——您的品牌名称。一些平台会将它与标题分开显示，因此请保持简洁。 article:published_time 且 article:author.
Twitter/X卡片标签 Twitter有自己的系统，称为Twitter卡片。好消息是：如果缺少Twitter卡片标签，它会回退到开放图形标签。坏消息是：这种回退并不完美，且Twitter不会显示大尺寸图片卡片，除非您明确启用。

在您的开放图形标签旁边添加这些标签：

关键标签是

。将其设置为

<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Your Page Title Here" />
<meta name="twitter:description" content="One or two sentences about this page." />
<meta name="twitter:image" content="https://yoursite.com/images/og-image.jpg" />

，您将获得大尺寸卡片。将其设置为 twitter:card，您将获得小尺寸缩略图。如果没有这个标签，Twitter将默认使用 summary_large_image ，您精心设计的开放图形图片将消失。 summary og:image — 负责核心工作的标签 summary 如果有一个标签必须正确设置，那就是

。即使预览为空，用户仍可能点击。而如果预览中的图片模糊、拉伸或缺失，用户几乎不会点击。

推荐尺寸 og:image1200 × 630 像素

——在Facebook、LinkedIn、Twitter和Slack中通用的标准尺寸

最小尺寸：600 × 315 像素 ——如果尺寸太小，部分平台将完全跳过图片显示
文件大小：小于8MB ——Facebook和大多数平台会拒绝较大的文件
格式：JPG或PNG ——照片使用JPG，带有文字的图形使用PNG
避免关键内容靠近边缘 不同平台对开放图形图片的裁剪方式不同。Slack显示的是宽卡片，LinkedIn在某些场景下会裁剪为正方形，移动应用则各有各的做法。请确保您的logo、文字和焦点内容位于图像中心安全区域——大致为图像内圈的80%区域，以避免重要内容被裁剪掉。

如何为您的网站添加开放图形标签

纯HTML网站

将标签插入HTML中的

标签内，位于关闭

标签之前： <head> 如果您使用WordPress，无需修改代码。Yoast SEO、Rank Math或All in One SEO等插件会自动处理开放图形标签。安装后，请在文章或页面编辑器中查找“社交”部分，您可以为每项内容独立设置自定义的OG标题、描述和图片，而无需与SEO标题和元描述混淆。 </head> Next.js和React应用

<head>
  <!-- your existing tags -->
  <meta property="og:title" content="Page Title" />
  <meta property="og:description" content="Page description." />
  <meta property="og:image" content="https://yoursite.com/og.jpg" />
  <meta property="og:url" content="https://yoursite.com/page/" />
  <meta property="og:type" content="website" />
  <meta property="og:site_name" content="Site Name" />
  <meta name="twitter:card" content="summary_large_image" />
</head>

WordPress

在Next.js App Router中，使用内置的

export在您的

中配置 metadata 如何测试您的开放图形标签 page.tsx:

export const metadata = {
  openGraph: {
    title: 'Page Title',
    description: 'Page description.',
    images: ['https://yoursite.com/og.jpg'],
    url: 'https://yoursite.com/page/',
    type: 'website',
    siteName: 'Site Name',
  },
  twitter: {
    card: 'summary_large_image',
    title: 'Page Title',
    description: 'Page description.',
    images: ['https://yoursite.com/og.jpg'],
  },
};

不要假设您的标签正在生效——平台会强烈缓存预览，旧版本可能已经存在数天。使用以下工具检查并强制刷新：

Facebook分享调试器

——显示Facebook实际读取的内容，并允许您清除缓存并重新抓取 LinkedIn帖子检查器
——LinkedIn缓存非常严格，因此这是唯一可靠的方式强制刷新 Twitter卡片验证器
——预览您的卡片在Twitter/X上的显示效果 ——无需登录任何平台，直接在浏览器中检查任意URL的开放图形标签
Open Graph 检查器 在IO Tools中使用非常方便——粘贴任意URL即可一次性查看所有开放图形和Twitter卡片标签，无需在不同平台调试器之间切换。

这 Open Graph 检查器如果需要从零开始生成干净且格式正确的开放图形标签，可以使用

输出您需要的精确代码。 HTML Meta标签生成器 5个常见的开放图形错误

使用相对图像URL

必须是绝对URL（ — og:image ）。相对路径如https://yoursite.com/image.jpg会静默失败，图片将无法加载。 /images/og.jpg 整个网站使用一个开放图形图片
——主页的通用图片可以满足基本需求，但博客文章、产品页面和落地页各自都应拥有专属图片。一个通用的网站级图片会削弱预览的上下文感，使其难以吸引点击。忘记添加
——如果没有它，Twitter会默认使用小缩略图，即使您拥有完美的1200×630开放图形图片。请务必显式添加。 twitter:card 发布更改但未刷新缓存
——平台会强烈缓存开放图形数据。更新标签后，请使用平台的调试工具强制重新抓取，否则旧预览可能持续显示数天。 撰写一个看起来像标题的og:description
——请使用描述字段补充标题中未包含的信息：读者将学到什么、内容面向谁、解决了什么问题。 开放图形标签——让您的Slack链接不再丑陋 2