article 标签仅用于可独立存在、转发和索引的内容，需满足“单飞三问”（作者、时间、事件），必须含语义化标题与元信息（time、address），嵌套需子内容同样可独立，不可替代 section 或 div 的结构作用。
article 标签不是“包内容的盒子”，而是给内容发一张“独立身份证”——它只该用在能脱离页面、单独被理解、转发、索引的内容上。
判断标准：内容能否“单飞”
把那段 HTML 剪出来，粘到空白文件里打开。用户是否还能立刻回答三个问题：
- 这是谁写的？
- 什么时候发的？
- 讲了什么事？
✅ 能答出 → 适合用 article
❌ 答不出 → 该用 section 或 div
必须含标题和元信息
没标题的 article 是语义残缺：读屏软件可能跳过整块，Lighthouse 报 warning，SEO 也可能降权。
- 标题必须存在，且描述本块内容本身（如
如何排查 fetch 超时问题
），不能是父页主题 - 单篇主内容可用 h1；首页列表页中每篇用 h2 更合理
- 时间必须用 ，datetime 属性不可省
- 作者信息优先用 ，而非普通段落或 div 拼接
嵌套要满足“子可独立”
嵌套 article 合法，但不等于合理。关键看子内容是否也满足“单飞三问”。
- ✅ 合理：博客正文（外层 article）→ 每条评论（含昵称、时间、
- ✅ 合理：主报道中完整引用一篇已发布的专家评论，含原题、作者、时间、链接
- ❌ 错误：把长文硬拆成“背景”“方法”“结论”三个 article —— 这该用 section
- ❌ 错误：三层及以上嵌套（article → article → article）→ 内容粒度失控，需重构
别和 section/div 混用
三者本质不同：
- article = 独立实体（可 RSS 抓取、可分享、可被搜索引擎当独立页面索引）
- section = 主题分区（如“安装步骤”“API 列表”，合起来才完整）
- div = 无语义容器（仅用于样式或脚本绑定，不传递结构含义）
导航栏、页脚、侧边栏广告位、栏目标题等，都不该套 article —— 它们属于页面结构，不是独立内容单元。
