页面改版时常见两种问题：为了字号把所有大字都设成H1，或因为担心SEO只允许全站一个H1，连组件标题都不敢用语义标签。
标题标签应反映内容组织。视觉大小由CSS控制，SEO不需要用标题堆砌关键词。
01 H1表达页面主要主题
文章页通常是文章标题，服务页是服务主题，产品页是产品名称。页面应能在只看H1时知道核心内容。
一个清楚主H1最容易维护。复杂HTML标准允许不同结构，但企业站不必为理论增加混乱。
02 H2与H3表示章节从属
H2划分主要章节，H3属于某个H2下的子主题。不要仅因为想让字变小就从H2跳到H5。
若某段只是视觉标签或卡片名称，不一定都要成为页面大纲中的标题。
标题结构常见问题
| 问题 | 为什么不好 | 改法 |
|---|---|---|
| 多个H1堆关键词 | 主题不清、组件复用混乱 | 保留主要H1，其他用合适层级 |
| 用div做所有标题 | 语义和辅助导航缺失 | 使用真实Heading标签 |
| 按字号选择H标签 | 层级跳跃 | 语义与CSS分离 |
| 隐藏关键词标题 | 误导用户与搜索引擎 | 标题与可见内容一致 |
| 每张卡片都用H2 | 大纲过碎 | 按页面结构决定H3或普通文本 |
| 标题只有“更多/介绍” | 无法预测内容 | 使用具体描述性标题 |
03 视觉设计与语义分开
H1可以视觉较小，H2也可以在某场景很醒目。使用设计系统控制样式，不要为了视觉改变文档大纲。
响应式变化字号时，标签层级不应随设备改变。
04 标题要帮助扫描，不要塞同义词
自然描述章节问题，例如“企业官网设计费用由什么决定”，比“官网设计费用价格报价多少钱”更有用。
正文、表格和FAQ会覆盖相关词，不必让每个标题重复主关键词。
05 组件化网站要注意模板语义
页首、卡片、FAQ和页脚组件可能在不同页面复用。组件不应硬编码H1，标题层级由页面上下文控制。
查看最终渲染HTML，而不只看设计工具和组件代码。
06 用辅助技术和抓取工具检查
浏览标题列表、键盘和读屏导航，确认没有空标题、重复无意义标题和跳级。
SEO工具的“多个H1”提示需要结合真实内容判断，不应机械修复。
常见问题
一个页面只能有一个H1吗？
实践中使用一个明确主H1最简单清楚；不要为关键词堆多个H1。
Logo需要用H1吗？
通常不需要。首页Logo是品牌链接，页面H1应表达主要主题。
H2可以比H1视觉更大吗？
可以，语义与视觉由不同机制控制，但整体层级仍应让用户理解。
跳过H2直接用H3会影响SEO吗？
主要问题是结构和可访问性不清，应按从属关系使用。
按钮文字可以用Heading吗？
一般不需要。Heading用于章节标题，按钮本身有交互语义。
链接复制成功
