<title>必须每页唯一、关键词前置、50–60字符；<meta name="description">需手写、120–155字符、首句嵌主词；<link rel="canonical">须用绝对URL动态生成，三者任一出错均易致降权或索引异常。
<title> 必须每页唯一、关键词前置、50–60 字符；<meta name="description"> 要手写、120–155 字符、自然语句开头嵌主词；<link rel="canonical"> 必须用绝对 URL 动态生成——这三件事做错任意一个，页面就大概率被降权或不被准确索引。
如何设置不被截断也不堆砌的 <title>
Google 搜索结果里标题超过 60 字符会被截断成“…”；放次要词在前，核心词靠后，用户根本看不到重点。CMS 模板里写死 <title>首页</title> 是最常见错误。
-
<title>内容严格控制在 50–60 字符（含空格），可用浏览器开发者工具的 Elements 面板实时测长 - 核心关键词必须前置，比如商品页写
<title>无线蓝牙耳机|主动降噪|XX品牌旗舰款</title>，而非<title>XX品牌官方旗舰店|无线蓝牙耳机</title> - 服务端渲染（如 Next.js）中，务必从数据上下文注入，例如
<title>{{ post.title }} | {{ site.name }}</title>，禁止硬编码 - 避免使用「关于我们」「联系我们」这类无信息量词；首页可写
<title>前端开发实战指南 | CodeCraft</title>
为什么 <meta name="description"> 不能自动生成
这个标签不参与排名计算，但 Google 经常直接把它当搜索结果摘要。留空、复制正文前两句、堆关键词、超长或带特殊符号，都会导致摘要显示异常，点击率暴跌。
- 每页单独手写，长度 120–155 字符（含空格），可用在线字符计数器验证
- 第一句话必须嵌入主关键词，例如：
<meta name="description" content="详解 HTML <link rel="canonical"> 标签的作用、设置方法及 Nginx/Next.js 配置示例。"> - 禁用引号（“”）、破折号（—）、项目符号（•）、箭头（»）等非 ASCII 符号，部分爬虫解析失败
- 别写「欢迎访问」「专业提供」「一站式服务」这类无效话术；聚焦“本页解决什么问题”
什么时候必须加 <link rel="canonical">，怎么加才对
URL 参数不同（/article?id=123 vs /article/123）、HTTP/HTTPS 混用、www 与非 www 共存，都会让搜索引擎当成多个页面，权重被稀释甚至主页面被降权。
立即学习“前端免费学习笔记（深入）”；
- 所有可能产生重复内容的页面都必须加，包括分页、筛选页、UTM 参数页
-
href值必须是**绝对 URL**：完整协议 + 域名 + 路径，例如<link rel="canonical" href="https://example.com/html-seo-guide"> - 相对路径（如
/html-seo-guide）或协议相对路径（如//example.com/html-seo-guide）会导致解析错误，指向当前页 - SSR/SSG 场景下，canonical 必须随页面动态输出；Next.js 用户注意
getStaticProps或generateMetadata中传入真实路径
真正容易被忽略的是：<main> 标签没包裹主体内容、<img> 的 alt 留空或写“图片”、<h1> 缺失或出现多次——这些不是“加分项”，而是爬虫判断“这页有没有正经内容”的基本依据。结构一乱，再准的 <title> 也白搭。
