<title>标签必须写在<head>内，否则浏览器不解析为标题；一个页面只能有一个<title>，多写则仅首个多生效；动态改标题须用document.title赋值。
title 标签必须写在 里，否则浏览器不认
HTML 解析器只在
区域内提取<title> 作为页面标题；写在 里，不是“可能不生效”，而是根本不会被当作标题处理。部分浏览器（如 Chrome）会尝试自动修复、把 <title> 移进 ，但这个行为不可靠——旧版 Safari、WebView、爬虫、无障碍工具一律忽略或静默丢弃。
常见错误包括：
-
<title>首页</title>直接放在 开头，标签页显示“无标题”或文件名 - 服务端模板（如 EJS、Django、Jinja）中 被拆成多个片段，
<title>被插到 渲染逻辑里 - HTML 文件漏写
<head>，直接从<body>开始，<title>被跳过或破坏整个 结构
一个页面只能有一个 <title>，多写也没用
HTML 规范强制要求 <title> 是
典型误用场景：
- 构建工具（如 Webpack + HtmlWebpackPlugin）自动生成
<title>，但你又在模板里手写一个，结果后者被忽略 - SPA 中用 JS 动态插入
<title>到 ，DOM 看似存在，但 history.state、SEO、书签仍读不到 - 多语言站点用条件渲染生成多个
<title>，实际只生效第一个
动态改标题必须用 document.title，别碰 DOM
运行时修改标题，唯一可靠方式是赋值 document.title。不要用 document.querySelector('title').textContent = '新标题'，也不要用 innerHTML 或 appendChild 重写整个标签——这些操作无法触发浏览器对标题的重新提取，历史记录、分享卡片、标签页刷新都可能滞后或失效。
注意点：
-
document.title是可读写属性，直接赋字符串即可：document.title = '用户中心 | MyApp' - 特殊字符（如
&、、<code>>）无需手动转义，document.title内部自动处理 - 但服务端渲染或静态 HTML 中的原始
<title>仍需转义，否则可能破坏 HTML 解析（例如<title>A & B</title>应写成<title>A & B</title>）
SEO 和体验细节：长度、唯一性、语义
搜索引擎和浏览器标签页宽度有限，太长的标题会被截断，含歧义或堆砌关键词反而降低点击率。
实操建议：
- 控制在 50–60 个字符内（中文约 17–20 字），优先把核心词放前面
- 每页
<title>必须唯一，避免所有页面都写“首页”或“我的网站” - 避免纯符号或无意义分隔符，如
|、-、•连续出现超过两次 - 中文站点尤其注意 UTF-8 声明必须在
<title>之前，否则可能出现乱码（<meta charset="UTF-8">要紧挨<head>开始）
最易被忽略的一点：很多团队花精力优化 <meta name="description">，却让 <title> 由构建工具默认填充为 “Webpack App”，连基本页面标识都没有——这比没写还糟，因为它是用户第一眼看到的入口标识。
