符合当前SEO实践的index.html核心是三件事：精准唯一的<title>（50–60字符，中文≤30字，关键词前置）、定制化的<meta name="description">（120–155字符，自然语句开头嵌主词，禁用全角标点）、必须存在的绝对URL格式<link rel="canonical">（如https://example.com/），其他如keywords标签已失效。
直接说结论：一个符合当前 SEO 实践的 index.html，核心不在于堆砌标签，而在于三件事：精准唯一的 <title>、每页定制的 <meta name="description">、以及必须存在的 <link rel="canonical">。其他如 keywords 标签已基本失效，加了也没用。
为什么 <title> 必须控制在 50–60 字符内
Google 搜索结果中只显示前约 60 个字符（含空格），超出部分会被截断为“…”。用户看不到完整信息，点击意愿直接下降。
- 中文页面建议 ≤30 字（一个汉字≈2 字符），例如：
<title>前端开发工具与实战指南 | CodeCraft</title> - 关键词必须前置——
<title>HTML meta 标签优化指南 | CodeCraft</title>比<title>CodeCraft | HTML meta 标签优化指南</title>更有效 - CMS 或静态站点生成器中，避免硬编码，改用动态变量：
<title>{{ page.title }} | {{ site.name }}</title> - 首页不要写“首页”或“Welcome”，它毫无搜索意义；要体现你到底提供什么价值
<meta name="description"> 不参与排名，但决定用户点不点你
Google 明确表示该标签不影响排序，但它大概率会直接作为搜索结果摘要展示。写得模糊、复制正文、超长或带特殊符号，都会降低点击率。
- 长度严格控制在 120–155 字符（含空格），可用在线工具实时计数
- 开头嵌入主关键词，用自然语句表达本页解决什么问题，例如：
<meta name="description" content="详解 HTML <link rel="canonical"> 标签的作用、设置方法及常见误用场景，附 Nginx 和 Next.js 配置示例。"> - 禁止使用全角标点、emoji、»、• 等符号——部分爬虫解析失败，可能丢弃整段描述
- 不要写“欢迎访问…”“专业提供…”这类无效话术；也不要用引号包裹整段内容
<link rel="canonical"> 是防止首页被降权的关键防线
HTTP/HTTPS、www/non-www、URL 参数（如 /index.html?ref=seo）都可能导致同一页面多个 URL 被收录。搜索引擎会认为这是重复内容，分散权重，甚至把非规范页当主页面索引。
立即学习“前端免费学习笔记（深入）”；
- 首页的 canonical 必须指向自身绝对 URL：
<link rel="canonical" href="https://example.com/">（注意结尾无index.html） - href 值必须是**绝对 URL**；写成
/或index.html可能被错误解析为相对路径 - 服务端渲染（如 Next.js）或 PHP 模板中，不能写死；需根据当前请求动态输出正确协议+域名+路径
- 如果用了 CDN 或反向代理，确保 canonical 输出不受缓存影响——曾有案例因 CDN 缓存了旧 canonical 导致首页长期不被收录
最容易被忽略的是 canonical 的动态性和绝对性：它不是“加了就行”，而是必须和实际可访问的规范 URL 完全一致。哪怕多一个斜杠、少一个 https，都可能让搜索引擎彻底放弃你精心写的 title 和 description。
