Meta 标签生成
表单填标题描述与分享图，生成 SEO/OG/Twitter 三段 meta 块。
第 1 行 第 1 列：【哪里错了】第 1 行第 1 列：标题和描述都为空 【为什么】Meta 标签至少需要页面标题或描述之一，全空时 OG 分享卡片没有内容可展示。 【怎么改】先填页面标题（建议 20–30 字）与描述（建议 70–160 字）。
原因：Meta 标签至少需要页面标题或描述之一，全空时 OG 分享卡片没有内容可展示。
建议：先填页面标题（建议 20–30 字）与描述（建议 70–160 字）。
使用说明
这个工具解决什么问题
写一个落地页要查 Open Graph 文档、再查 Twitter Card 文档、还要记着 canonical 与 viewport——字段多、格式细、漏一个分享卡片就变形。这个工具把常用 meta 收进一张表单:填一次标题、描述与分享图,即时输出按「基础 SEO / Open Graph / Twitter Card」注释分组的完整 meta 块,直接复制粘贴。
核心能力
同源复用:og:title/og:description/og:image 与 twitter: 系列自动取用你填的页面标题/描述/分享图,微信与 X 分享卡片内容一致,不会出现两处文案漂移。
可裁剪:工具条上四个开关——charset/viewport、canonical、Open Graph、Twitter Card——不需要哪段就关掉,输出只剩你要的。
XML 转义:标题或描述里带引号、尖括号、& 时自动转义成合法属性值,贴进 HTML 不会把标签打碎。
使用建议
标题控制在 20–30 字、描述 70–160 字,这是搜索结果与分享卡片都不截断的舒适区。og:type 文章页选 article、站点首页选 website;twitter:card 一般用大图卡,正文卡片场景才用 summary。生成后可以用本站「HTML 工具」整体格式化检查一遍。
常见问题
生成的标签贴到哪里?
全部贴进页面 <head> 里(生成块不含 <title> 元素本身,记得单独写)。静态站直接改 HTML,Next.js 等框架按各自 metadata API 拆开填即可——字段一一对应。
Open Graph 和 Twitter Card 为什么要两套?
微信/微博/QQ/Facebook 读 Open Graph(og 系前缀),X(Twitter)读 twitter 系前缀。两套标签共用同一份标题/描述/分享图,所以各平台展示的内容一致,不需要分开维护两份文案。
og:image 建议多大?
1200×630 是最稳的分享图尺寸(本站「SVG 占位图」工具可以直接生成这个尺寸的底图)。image 缺省时多数平台会退化成无图链接,转化差很多,建议务必填。