开放图检查器
立即查看 Open Graph 标签、社交媒体预览和 Twitter 卡片
当有人在 Facebook、LinkedIn、WhatsApp、Discord、Slack、Telegram 或其他许多平台上分享您的网站时,系统会自动生成预览卡。此预览通常包含标题、描述、图片和网址。预览的质量直接影响人们是否会点击您的链接。
这些预览由Open Graph (OG) 标签控制,OG 标签是一种元数据标准,旨在为社交平台提供一致且丰富的预览效果。如果您的 Open Graph 标签缺失或配置错误,您分享的链接可能会显示错误的标题、没有图片、信息过时或预览效果不佳。Open Graph 协议定义了一组放置在 HTML<head>代码中的元数据标签,用于控制网页在分享时的呈现方式。
Small Web Tools上的Open Graph 检测工具可以帮助网站所有者、博主、营销人员、开发人员和 SEO 专业人员即时验证其 Open Graph 元数据。它可以分析您的网页,提取重要的 OG 标签,识别缺失的字段,并帮助确保您的内容在社交媒体平台上正确显示。
本指南全面解释了您需要了解的有关 Open Graph 标签的一切信息,包括它们的工作原理、重要性、如何使用 Open Graph 检查器、SEO 最佳实践以及需要避免的常见错误。
什么是 Open Graph 标签?
<head>Open Graph 标签是放置在网页 <head> 部分内的 HTML 元标签。
它们会告诉社交媒体平台网页在分享时应该如何显示。
Open Graph 标签定义了页面信息,而不是让平台猜测你的页面信息:
- 标题
- 描述
- 特色图片
- URL
- 内容类型
- 语言
- 网站名称
这样可以确保在支持的平台上预览效果一致。
什么是开放图形协议?
开放图谱协议 (OGP)是一种开放的元数据标准,最初由 Facebook 推出,它使网页能够成为社交图谱中的富对象。此后,许多社交网络和即时通讯应用都采用了该协议来生成丰富的链接预览。
什么是 Open Graph 检测器?
Open Graph Checker是一款在线工具,用于扫描网页并验证其 Open Graph 元数据。
该工具提取重要的 OG 标签并检查它们是否配置正确。
典型检查项目包括:
- og:title
- og:描述
- og:image
- og:url
- og:type
- og:site_name
- Twitter 卡片标签
- 社交预览兼容性
许多 Open Graph 检测工具还可以模拟您的页面在主流社交平台上分享时的显示效果。
为什么 Open Graph 标签很重要
虽然 Open Graph 标签不是 Google 排名的直接因素,但它们可以显著改善内容在社交网络和即时通讯应用上分享时的呈现方式,通常可以提高互动率和点击率。
福利包括:
- 更好的社交媒体预览
- 更高的点击率(CTR)
- 提升品牌知名度
- 链接外观一致
- 社交参与度提高
- 更好的用户体验
- 更专业的内容呈现方式
- 对共享内容拥有更大的控制权
Open Graph Checker 的功能
Small Web Tools Open Graph Checker 包含多个强大的功能。
1. 即时 OG 标签分析
几秒钟内即可分析任何网页。
2. 检测缺失的 Open Graph 标签
该工具可以识别可能影响社交预览的缺失元数据。
3. 显示 Open Graph 信息
分析的常见标签包括:
- og:title
- og:描述
- og:image
- og:url
- og:type
- og:site_name
- og:locale
4. 检查社交预览数据
核实社交平台在生成链接预览时可能使用的信息。
5. Twitter 卡片验证
许多网站还包含 Twitter 卡片元数据,可以自定义 X(以前称为 Twitter)上的预览。
6. 用户友好界面
简单地:
- 输入网址
- 点击“检查”
- 审查结果
7. 快速且免费
无需注册或安装软件。
如何使用 Open Graph Checker
该工具使用起来非常简单。
步骤 1
步骤 2
请输入完整的网页网址。
例子:
https://example.com
步骤 3
点击“检查”按钮。
第四步
请稍等片刻,网页正在分析中。
第五步
检查检测到的 Open Graph 标签,并找出任何缺失或不正确的元数据。
必要的 Open Graph 标签
og:title
定义页面共享时显示的标题。
例子:
<meta property="og:title" content="Free Open Graph Checker">
最佳实践:
- 字数控制在50-60个字符之间。
- 要写得引人入胜、描述生动。
- 自然地融入主要关键词。
og:描述
提供页面内容的简短摘要。
例子:
<meta property="og:description" content="Check your Open Graph tags instantly for better social sharing.">
建议长度:
- 110–160 个字符
- 清晰且引人入胜
- 鼓励用户点击
og:image
指定社交分享中显示的预览图像。
例子:
<meta property="og:image" content="https://example.com/image.jpg">
图片规范建议:
- 1200 × 630 像素
- 高质量
- 与页面相关
- 公开访问
许多平台建议使用 1.91:1 的宽高比以获得最佳显示效果。
og:url
定义与共享内容关联的规范 URL。
例子:
<meta property="og:url" content="https://example.com/page">
og:type
指示内容类型。
常见价值观包括:
- 网站
- 文章
- 产品
- 视频
- 轮廓
- 书
例子:
<meta property="og:type" content="website">
og:site_name
显示网站或品牌名称。
例子:
<meta property="og:site_name" content="Small Web Tools">
og:locale
定义页面语言和区域格式。
例子:
<meta property="og:locale" content="en_US">
Twitter 卡片标签
Twitter (X) 支持其自己的元数据,称为Twitter Cards。
常用标签包括:
- 推特:卡片
- 推特:标题
- 推特:描述
- 推特:图片
添加这些标签可以更好地控制链接在 X 上的显示方式,尽管许多平台也可以回退到 Open Graph 元数据。
使用 Open Graph Checker 的好处
定期检测对您有好处:
- 验证社交元数据
- 改进社交媒体预览
- 检测缺失图像
- 查找错误的网址
- 提升品牌形象
- 提高点击率
- 减少共享错误
- 提升用户信任度
Open Graph 标签的 SEO 最佳实践
请遵循以下建议:
- 在每个重要页面上添加 Open Graph 标签。
- 使用独特的标题和描述。
- 请提供高质量的预览图片。
- 请使用绝对图片URL。
- 保持 OG 数据与页面内容一致。
- 同时添加 Twitter Card 标签和 Open Graph 标签。
- 页面内容更改时,更新 Open Graph 元数据。
- 发布后测试页面。
常见的 Open Graph 错误
避免这些常见问题。
缺少 og:image
如果没有图片,许多平台会显示纯文本预览或选择一张不合适的图片。
通用标题
使用描述性的、页面特定的标题,而不是重复首页标题。
重复描述
每个重要页面都应该有独特的描述。
图片链接失效
确保图片 URL 可公开访问并返回有效响应。
低分辨率图像
图片过小或模糊会降低分享链接的视觉吸引力。
相对图像路径
对于 Open Graph 图片,请始终使用绝对 URL。
缺少推特卡片
虽然 Open Graph 可以在许多平台上运行,但添加 Twitter Card 标签可以提高与 X 的兼容性。
哪些人应该使用 Open Graph Checker?
此工具非常适合用于:
- 网站所有者
- 博客作者
- SEO专业人士
- 内容创作者
- 电子商务企业
- 数字营销人员
- 网站开发人员
- 营销机构
- 社交媒体经理
何时应该检查 Open Graph 标签?
检查您的元数据:
- 发布网页之前
- 在分享到社交媒体之前
- 网站重新设计之后
- 在SEO审核期间
- 迁移之后
- 更新特色图片后
- 营销活动之前
- 排查链接预览错误问题
定期进行 Open Graph 审计的优势
定期审计很有帮助:
- 保持品牌一致性
- 提升参与度
- 增加社交流量
- 检测缺失的元数据
- 提升用户信任度
- 减少共享问题
- 提升整体内容质量
常见问题解答 (FAQ)
什么是 Open Graph 检测器?
Open Graph 检查器会扫描网页并显示其 Open Graph 元数据,帮助您验证网页在社交媒体上分享时可能呈现的效果。
Open Graph 标签对 SEO 重要吗?
它们不是谷歌排名的直接因素,但它们可以提高社交分享率、用户参与度和点击率,使其成为完整数字营销策略的重要组成部分。
哪些平台使用 Open Graph 标签?
许多平台都使用 Open Graph 元数据,包括 Facebook、LinkedIn、WhatsApp、Slack、Discord、Telegram 等。X(Twitter)也支持专用的 Twitter Card 标签。
推荐的图片尺寸是多少?
为了在各大平台上获得一致的预览效果,建议使用1200 × 630 像素、宽高比为1.91:1 的图像。
我可以在所有页面上使用同一幅 Open Graph 图片吗?
可以这样做,但通常来说,与每个页面相匹配的独特图片能够创建更具吸引力和相关性的预览。
我应该多久测试一次我的 Open Graph 标签?
每当您发布新内容、重新设计页面、更改特色图片或发现社交平台上的预览不正确时,请检查它们。
结论
Open Graph 标签对于在当今的社交媒体和即时通讯平台上创建美观、信息丰富且一致的链接预览至关重要。正确配置的元数据有助于提高点击率、强化品牌形象并改善整体分享体验。
Small Web Tools 的 Open Graph 检测器可以轻松分析 Open Graph 元数据,识别缺失的标签,验证预览信息,并确保您的网页已准备好共享。通过定期测试并更新您的 Open Graph 标签,您可以最大限度地发挥每个共享链接的影响力,同时为您的受众提供专业且引人入胜的体验。