免费工具 meta 标签生成器 · head 代码一次写对
网页 <head> 里的几行 meta 标签，决定了搜索结果里显示什么标题和描述、这个页面能不能被收录、分享到微信或飞书时长什么样。填几个字段就能得到转义正确、顺序合理的完整代码；canonical 写成相对路径、上线后忘了删 noindex 这类「看不出来但很伤流量」的问题，检查清单会直接指出来。
- 按 Google 规范校验
- 可复制可下载
- 本地生成
生成 head 代码
示例是一个商品分类页，有简体、繁体和英文三个版本。改任何一项，代码和检查清单都会实时更新。
搜索结果的标题和浏览器标签页上的文字。
一两句话的概括，搜索引擎可能拿它当摘要。
这个页面的规范网址（正本），写完整地址。不需要可以留空。
选填。Google 不用它排名，百度也没有说明它有排名作用，不写也没关系。
允许搜索结果显示多大的图片预览。
摘要最多多少个字符。0 = 不显示摘要，-1 = 不限制，留空 = 不设置。
视频预览最多几秒。0 = 只显示静态图，-1 = 不限制。
部分手机浏览器的地址栏颜色，如 #1f6f5c。
语言代码 + 网址，如 zh-CN https://example.com/zh-cn/，要包含本页自己。完整校验用 hreflang 标签生成器。
完整网址，建议 1200 × 630 像素。
选填，如 @yourbrand，没有海外账号就留空。
标题字符数
35
标题宽度（px）
559
按 20 px Arial 算；Google 桌面约显示 600。
描述字符数
62
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>手工陶瓷马克杯 - 景德镇工作室直发，满 199 元包邮 | 示例陶艺</title>
<meta name="description" content="景德镇工作室手工拉坯、上釉的陶瓷马克杯，容量 350 ml，可进洗碗机，十二种釉色可选。满 199 元包邮，七天无理由退换。">
<link rel="canonical" href="https://www.example.com/zh-cn/mugs/">
<meta name="robots" content="index, follow, max-image-preview:large">
<meta name="theme-color" content="#1f6f5c">
<link rel="alternate" hreflang="zh-CN" href="https://www.example.com/zh-cn/mugs/">
<link rel="alternate" hreflang="zh-TW" href="https://www.example.com/zh-tw/mugs/">
<link rel="alternate" hreflang="en" href="https://www.example.com/en/mugs/">
<link rel="alternate" hreflang="x-default" href="https://www.example.com/en/mugs/">
<!-- Open Graph -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://www.example.com/zh-cn/mugs/">
<meta property="og:title" content="手工陶瓷马克杯 - 景德镇工作室直发，满 199 元包邮 | 示例陶艺">
<meta property="og:description" content="景德镇工作室手工拉坯、上釉的陶瓷马克杯，容量 350 ml，可进洗碗机，十二种釉色可选。满 199 元包邮，七天无理由退换。">
<meta property="og:image" content="https://www.example.com/img/mugs-1200x630.jpg">
<meta property="og:site_name" content="示例陶艺">
<!-- X (Twitter) -->
<meta name="twitter:card" content="summary_large_image">粘贴到 <head> 里，charset 那一行放最前面。
检查清单
- 通过标题 35 个字符，约 559 px 宽，在 Google 桌面约 600 px 的范围内。
- 通过描述 62 个字符，约 777 px 宽，长度合适。
- 通过hreflang：3 个语言版本，代码都有效。这几行要原样放到这几个页面上。
- 通过没有发现冲突。
分享这组输入：数值写在链接的 # 后面，不会发到服务器。
https://tapcub.com/zh/tools/meta-tag-generator
版本 v1.0更新于 更新记录
生成的每一组标签管什么
这些标签分四组：前两组给搜索引擎看，后两组给浏览器和分享卡片用。
标题和描述
<title> 是搜索结果标题的主要来源，也是浏览器标签页上的文字；description 可能被用作摘要。上面的计数器显示字符数和宽度，被截断之前就能看出来。
canonical 和 robots
canonical 告诉搜索引擎：同一内容出现在多个网址时，哪个是正本。robots 决定能不能收录、跟不跟踪链接、摘要和图片预览能显示多少。这两类写错了，后果最实在。
浏览器标签
charset 和 viewport 保证页面显示正常；theme-color 给部分手机浏览器的地址栏上色。它们不影响排名，但缺了 viewport，页面在手机上几乎没法用。
分享和多语言
OG 标签和 X 卡片决定链接分享出去长什么样（钉钉、飞书会读；微信普通分享要靠 JS-SDK）；hreflang 告诉搜索引擎哪个语言版本给哪些用户看。两者各有专门的工具可以深入检查。
标签顺序对搜索引擎影响不大，只有一个例外：charset 声明要放在 head 最前面，浏览器才能用正确的编码读后面的内容。
三步
只填需要的就行，空着的字段不会生成标签。
-
1
写标题和描述
看计数器：百度标题建议 60 字节（约 30 个汉字）以内，Google 桌面约 600 px。canonical 填本页自己的干净网址。
-
2
选 robots 指令
大多数页面保持 index, follow 就够了。感谢页、站内搜索结果页、删不掉的重复页用 noindex；想在 Google 探索里显示大图，加 max-image-preview:large。
-
3
复制或下载
粘贴到
<head>里，或填进建站系统 / 框架的 head 设置（WordPress 主题、Next.js metadata 等）。然后处理清单里标红、标橙的项。
Google 支持的 robots meta 指令
出自 Google 的 robots meta 标签规范。多个指令用逗号写在一个标签里，不区分大小写；PDF 等非网页文件可以用 X-Robots-Tag 响应头发送（Nginx 里用 add_header）。百度没有公开完整的指令列表，max-snippet 这类扩展指令别指望百度识别。
- 指令冲突时以更严格的为准：nosnippet 压过 max-snippet:50
name="robots"对所有爬虫生效；name="googlebot"、name="baiduspider"只对单个爬虫- 只有 robots.txt 没屏蔽的页面，robots 指令才会被读到
| 指令 | 作用 | 说明 |
|---|---|---|
noindex | 不出现在搜索结果里 | 下次抓取后生效 |
nofollow | 不跟踪页面上的链接 | 对页面上所有链接生效 |
none | 等于 noindex, nofollow | |
nosnippet | 不显示文字摘要和视频预览 | 静态缩略图仍可能显示 |
max-snippet:[n] | 摘要最多 n 个字符 | 0 = 不显示，-1 = 不限 |
max-image-preview:[尺寸] | none、standard 或 large | 探索（Discover）大图需要 large |
max-video-preview:[n] | 视频预览最多 n 秒 | 0 = 静态图，-1 = 不限 |
noimageindex | 不收录本页图片 | |
notranslate | 结果里不提供翻译 | |
unavailable_after:[日期] | 指定日期后不再显示 | ISO 8601、RFC 822 或 RFC 850 |
noarchive | Google 已忽略 | Bing 仍读取 |
示例代码逐行说明
生成器给示例商品分类页生成的每一行，以及为什么这样写。
| 标签 | 取值 | 为什么 |
|---|---|---|
<title> | 35 个字符，59 字节，559 px | 在百度 60 字节、Google 约 600 px 以内；品牌放在最后 |
description | 62 个字符，777 px | 包邮和退换信息放在后半句，被截断也不丢主题 |
canonical | /zh-cn/mugs/ 的完整网址 | 带筛选、排序参数的分类页都指向这里 |
robots | index, follow, max-image-preview:large | 允许收录，允许显示大图预览 |
hreflang | zh-CN、zh-TW、en、x-default | 列出了自己（zh-CN）；其他语言的用户默认去英文页 |
og:*、twitter:card | 分享图、站点名、大图卡片 | 钉钉、飞书读 og 标签；没有海外账号就不写 twitter:site |
示例避开了两个常见坑：canonical 指向本页而不是首页；zh-CN 页面把自己也写进了 hreflang 列表。
适得其反的 head 标签
这些错误比「少写一个标签」伤害更大：浏览器里看着一切正常，几周后才在流量上体现出来。
测试环境的 noindex 带上了线
用测试站的模板直接上线，全站都还带着 noindex。上线后逐个模板检查 robots 那一行。
canonical 全部指向首页
模板里写死了指向首页的 canonical，等于告诉搜索引擎每个页面都是首页的副本。一般每页的 canonical 应该是它自己。
屏蔽和 noindex 一起用
robots.txt 里 Disallow 了，又在页面上写 noindex：爬虫抓不到页面，就看不到 noindex，网址反而可能一直留在索引里。
插件和主题重复输出
主题和 SEO 插件各输出一份 description 或 canonical，两个值互相打架。查看网页源代码，只留一份。
确认该被找到的页面被找到了
新的 head 标签上线后，要看效果：搜索流量是不是落到了你想要的页面，哪些爬虫来抓了。
meta 标签有什么作用？
meta 标签写在网页 <head> 里，访客看不到，给浏览器、搜索引擎和分享平台读。常用的有：description（搜索结果摘要）、robots（能不能收录）、viewport（手机显示）、charset（编码）、og:*（分享卡片）。严格说 <title> 和 canonical 不是 meta 标签，但通常一起写。
哪些 meta 标签对 SEO 有用？
真正有用的不多：<title>、description（影响摘要和点击，不直接影响排名）、需要限制时的 robots、以及 canonical。viewport 关系到手机体验；OG 和 hreflang 关系到分享和多语言站。
keywords 标签还要写吗？
Google 在 2009 年就说过不用 keywords 标签排名。百度目前没有说明它有排名作用，写了也不会加分，还会暴露你想排的词。站内搜索等系统要用时再写，别堆砌。
noindex 和 robots.txt 有什么区别？
robots.txt 管「能不能抓」，noindex 管「抓到后能不能出现在结果里」。想让页面从搜索结果里消失，要允许抓取再写 noindex；被 robots.txt 屏蔽的页面，仍可能凭外部链接被收录。
canonical 应该指向页面自己吗？
一般是。同一个页面能通过带参数、排序、末尾斜杠不同的网址访问时，指向自己的 canonical 是很清楚的信号。只有当前页面确实是别处内容的副本时，才指向别的网址。
百度认 robots meta 标签吗？
百度没有像 Google 那样公开完整的 robots meta 规则列表。noindex、nofollow 可以照写，max-snippet、max-image-preview 这类扩展指令不要指望百度识别；想要单独对百度生效，可以写 name="baiduspider"。效果以百度站长平台的收录数据为准。
国内常见的 renderer、applicable-device 要不要加？
renderer=webkit 让 360、QQ 等双核浏览器默认用极速内核；applicable-device 是百度移动适配里标注页面适合电脑还是手机的标签。它们对 Google 没有作用，生成器不自动加，需要时手动补一行。
我填的内容会上传吗？
不会。代码在你的浏览器里生成。复制分享链接时，内容写在网址 # 号后面，浏览器不会把这一段发给服务器。