Meta 标签生成器

真正重要的那几个

老教程里列出的绝大多数 meta 标签早已被忽略。仍然影响用户所见的只有几个：

• <title> —— 页面上最重要的单个元素。它是搜索结果里可点击的标题，也是浏览器标签页的文字。
• <meta name="description"> —— 不是排名因素，但通常会成为标题下方的摘要，因此直接影响点击率。
• <link rel="canonical"> —— 当同一内容可以通过多个地址访问时，告诉搜索引擎哪个 URL 才是权威版本。
• Open Graph 与 Twitter 卡片属性 —— 决定页面被分享到社交平台和聊天工具时的预览卡片样式。

明显缺席的是 <meta name="keywords">。在经历多年滥用之后，Google 于 2009 年确认不再将其用于排名。这里保留它，仅仅是因为少数内部搜索系统还会读取。

长度限制看的是像素，不是字符

搜索引擎按固定像素宽度截断标题和描述，所以由窄字符组成的标题能容纳更多文字，而全大写的标题容纳得更少。字符数只是实用的近似值：标题约 60 字符、描述约 160 字符，多数情况下能落在桌面端的显示范围内。移动端结果还要更窄。

超出限制并不是错误。描述只是一段摘要而非契约，当页面中另一段文字更贴合查询时，搜索引擎照样会自行改写。把重要的词放在前面，这样即使被截断，意思也能保住。

Open Graph，以及为什么 Twitter 标签通常可省

Open Graph 起源于 Facebook，如今已成为事实标准，LinkedIn、Slack、Discord、WhatsApp、iMessage 等绝大多数平台都读它。四个属性承担了几乎全部工作：og:title、og:description、og:url 和 og:image。

当自有标签缺失时，Twitter 的解析器会回退到 Open Graph，因此只有当你希望在这个平台上呈现不同的标题、描述或图片时，才需要完整的 twitter:* 属性。真正值得显式设置的是 twitter:card，它决定采用大图布局还是紧凑缩略图布局。

把预览图做对

这是大多数实现翻车的地方。必须使用绝对 URL —— 相对路径在所有爬虫里都会失效。尺寸建议 1200 × 630 像素，即 1.91:1 比例，正好填满大卡片而不被裁切。文件控制在 1 MB 以内，用 JPEG 或 PNG，并确保该 URL 无需登录、无需 Cookie、也不经过重定向链就能公开访问。图上的文字要大，因为卡片经常以远小于原始尺寸的比例展示。

缓存，以及你的修改为什么没生效

各大平台都会激进地缓存预览，往往长达数天。更新标签之后，旧卡片会一直显示，直到缓存过期或你通过平台自带的调试工具强制刷新。Facebook、LinkedIn、Twitter 都提供这类工具。如果刷新后预览仍然不对，检查爬虫能否真正访问到页面：登录墙、robots.txt 拦截、地域限制都会导致空白卡片。