html5语义化是让dom结构树真正“长出意义”：main必须唯一且直接位于body下，article为独立子树根节点，section需配标题才成有效分支，标题层级须严格递进，非法嵌套会破坏结构可信度。
HTML5 语义化不是给标签换名字，而是让结构树真正“长出意义”。结构树（DOM树）的每一层节点，只有配上准确的语义标签和合规的嵌套关系，才能被搜索引擎、屏幕阅读器和开发者共同识别为可信的内容骨架。
语义标签即结构树的节点类型声明
浏览器解析 HTML 时，首先构建 DOM 树；而语义标签直接定义了该节点在逻辑上的角色：
-
<main></main>是全树唯一的“主干节点”，不可嵌套在<article></article>或<aside></aside>内——否则结构树会误判内容主次 -
<article></article>是可独立存在的“子树根节点”，自带隐含大纲层级，RSS 抓取、打印、分享均以它为单位 -
<section></section>是主题性“分支节点”，必须配<h2></h2>或更高级别标题才形成有效子章节，否则只是普通分组 -
<nav></nav>、<aside></aside>、<footer></footer>属于“功能型节点”，不参与内容大纲排序，但影响辅助技术导航流
标题层级是结构树的骨架锚点
没有 heading 的语义标签，就像没挂编号的楼层——结构存在，但无法定位。标题不是装饰，而是 DOM 树中划分区块边界的显式标记：
- 每个
<article></article>或<section></section>应以<h2></h2>起始（<main></main>内首个标题通常为<h1></h1>） - 标题必须严格递进：
<h2></h2>→<h3></h3>→<h4></h4>，跳级会导致结构树断裂，SEO 和读屏器均无法还原逻辑 - 连续副标题应包裹在
<header></header>内，避免被解析为多个并列章节 - 禁止用
<div> + CSS 模拟标题，机器只认真实 <code><h1>–<h6></h6> </h1>非法嵌套会直接污染结构树完整性
某些标签组合在语法上合法，但在语义层面破坏结构树的可信度，导致大纲错乱或内容被降权：
-
<p></p>只能包含文本级内容，内部不能嵌<header></header>、<section></section>或<nav></nav> -
<main></main>不得出现在<header></header>、<footer></footer>、<aside></aside>内部 -
<article></article>嵌套<article></article>合理（如文章+评论），但<section> > <section> > <article></article></section></section>易造成层级模糊 -
<figure></figure>必须直包媒体元素（<img>、<video></video>等）与<figcaption></figcaption>，中间加<div> 会切断语义链 <h3>结构树质量可验证：三步自查法</h3> <p>写完页面后，用以下方式快速判断结构树是否健康：</p> <ul> <li>打开浏览器开发者工具，查看 Elements 面板中的 DOM 结构，确认 <code><main></main>唯一且包裹核心内容 - 使用 Chrome 的 Lighthouse 或 axe 浏览器插件运行无障碍审计，检查“标题缺失”“
<main></main>重复”等结构类报错 - 粘贴 HTML 到 W3C Markup Validator，重点看“Element X is not allowed as child of element Y”类错误
-
