Open Graph Meta 标签生成器 — 免费工具
填写标题、描述、网址和图片，即可得到可直接粘贴到页面 <head> 中的 Open Graph、Twitter 卡片和标准 meta 标签。所有取值都会转义，空字段直接省略，过长的标题和描述会在平台截断之前提示你。
功能
- 一组字段同时生成 Open Graph、Twitter 卡片、<title> 和 meta description
- 每个取值都做 HTML 转义，带引号、& 或尖括号的标题依然能生成合法标签
- 实时字数统计：标题超过 60 字符、描述超过 200 字符即提示——与我们的链接预览检查工具阈值一致
- 空字段整条省略，而不是输出空的 content 属性——空 content 会被爬虫当成有意为之
- 完全在浏览器中运行：无需注册，不上传任何内容，也不会抓取任何页面
常见问题
这些标签放在哪里？
放在页面的 <head> 元素内、</head> 之前。顺序对爬虫没有影响，但把 Open Graph 部分放在一起更好维护。如果站点使用 CMS 或框架，请找它的 head 或 SEO 设置，而不是手改模板：很多系统已经输出了其中一部分，一个页面出现两个 og:title 比只有一个更糟。
粘贴之后为什么还显示旧预览？
因为平台在第一次看到链接时就缓存了卡片，有时会缓存好几天。解决办法是让它重新读取页面：Facebook Sharing Debugger、LinkedIn Post Inspector 和 X Card Validator 都可以按需重新抓取。在那之前，新标签已经在你的页面上，只是平台上看不到。
Open Graph 和 Twitter 标签都要吗？
严格来说不必：缺少 twitter: 标签时 X 会回退到 Open Graph，多数读取方也一样。真正值得单独写的是 twitter:card，它决定 X 显示大图还是小方形缩略图。本工具两套都输出，这样就不必依赖你看不见的回退行为。
图片应该用多大？
1200 × 630 像素最稳妥，也就是 Facebook、LinkedIn 和 X 的 summary_large_image 都期待的 1.91:1 比例。请用绝对的 https 网址提供——相对路径对爬虫无法解析——文件保持在 5 MB 左右以内，并让文字远离边缘，因为各平台的裁切略有差异。
标题里的引号和特殊字符会怎样？
会自动为你转义。& 、尖括号和双引号在进入属性之前会转成实体，所以像 Ben & Jerry’s "best" flavour 这样的标题也能生成合法标签，而不是破损的标记。这不只是整洁问题：content 中未转义的引号会提前结束属性，后面的内容全都会被当作标记解析。
