🔎 Meta标签预览器

输入标题、描述和网址，实时预览在 5 大平台的展示效果。一键生成完整的 OG / Twitter Card Meta 标签 HTML 代码，直接复制到你的网页 <head> 中。适合 SEO 优化师、内容运营、前端开发者使用。所有操作在浏览器本地完成，无需注册。

预设示例： AI工具箱 SaaS 产品技术博客电商产品在线课程

页面标题（Title / OG Title） Google 显示约 50-60 字符，百度显示约 30-35 个中文字 | 0

页面描述（Description / OG Description） Google 显示约 150-160 字符，百度约 75-80 个中文字 | 0

页面网址（URL / Canonical）

网站名称（OG Site Name）

OG 图片 URL（可选）

Twitter 账号（可选，不含 @）

🔍 Google 搜索结果预览

💡 SEO 提示：标题控制在 50-60 字符以内可完整显示；描述控制在 150-160 字符以内不会被截断；URL 使用简短有意义的结构。Google 实际显示长度取决于像素宽度（约 600px 标题），中文每个字占更多像素。

🔵 百度搜索结果预览

💡 SEO 提示：百度标题显示约 30-35 个中文字，描述约 75-80 个中文字。百度更看重页面正文内容匹配而非 Meta Description，但 Meta 信息仍是重要参考。建议在标题中前置核心关键词。

💬 微信分享卡片预览

🖼️

💡 微信提示：微信使用 OG 标签渲染分享卡片。标题建议 20-30 字，描述 30-50 字。图片建议 300×300 以上，1:1 正方比例。微信会缓存分享卡片，修改后需用「微信公众平台→调试工具」刷新。

🐦 Twitter/X 卡片预览

🖼️

💡 Twitter 提示：需设置 twitter:card = "summary_large_image" 才会显示大图卡片。图片建议 1200×628 (1.91:1)，最小 300×157。标题 70 字符以内，描述 200 字符以内。

📘 Facebook 分享预览

🖼️

💡 Facebook 提示：使用 OG 标签（og:title / og:description / og:image）。图片建议 1200×630，最小 600×315。修改后需用 Facebook Sharing Debugger 清除缓存。