标题层级需严格遵循h1–h6语义嵌套：一页面仅一个h1作唯一主题锚点，置于<main>内起始处；h2–h6须逐级递进，不可跳级或倒置；配合<section><article>明确归属；用开发者工具或axe等验证结构。
靠标题标签本身不等于理清层次，关键在于用 h1–h6 的语义关系 搭建内容骨架，让机器和人都能一眼看懂“哪是主干、哪是分支、哪是细节”。
一个页面只设一个 h1，且它得是真正核心
这个 h1 不是装饰，而是整页唯一主题锚点。它应出现在 <main> 内部，靠近内容起始处，比如文章标题、产品主名称或服务总览名称。常见错误包括：CMS 模板全局塞一个 h1（如“欢迎光临”），正文又加一个；轮播图、卡片标题也硬套 h1；用 CSS 隐藏了某个 h1 但标签仍在——这些都会让结构失效。
h2 到 h6 必须逐级嵌套，不能跳也不能倒
层级不是字号开关，而是父子逻辑链：
- h2 是 h1 的直接子主题，比如“安装步骤”“常见问题”“技术原理”
- h3 是 h2 下的细分项，如在“安装步骤”下写“下载安装包”“运行安装向导”“完成配置”
-
h4 及以下极少需要，真要用，优先考虑是否该用
<dl>或带语义的 class 替代，而非强行塞进标题流
从 h1 直接跳到 h4，屏幕阅读器会“掉层”，SEO 工具可能抓取空结构，摘要也容易错乱。
立即学习“前端免费学习笔记（深入）”；
用 <section> 和 <article> 锚定标题归属
光排 h2、h3 标签不够，必须靠语义容器明确归属：
- 每个 <section> 建议以对应层级标题开头（通常是 h2 或 h3）
- <article> 内允许有自己的 h1，这是语义隔离，不影响外层文档大纲
- 两个相邻 h2 若被不同
包裹，就是平行章节；若第二个 h2 在第一个 内，则自动视为子层级
空的 别等上线才发现问题，现在就能检查： 标题层级错乱本身不报错、不阻断渲染，但可访问性测试必失败，SEO 权重会被稀释，内容摘要也会生成错乱——问题藏得深，修复却很简单。 没区别，纯属冗余。
动手验证比凭感觉更可靠
axe http://localhost:3000 --rule=heading-order，它会直接标出所有断裂点
