header 标签在 article 内必须作为首个直接子元素，仅承载标题与元信息（如时间、作者），不可嵌套于 div 等非节元素中，且应使用 h2 起始的语义化标题层级。
header 标签在 article 内部用作文章标题头部，核心是提供语义清晰、结构合规的元信息容器——它不是装饰层，而是告诉浏览器和辅助技术“这部分内容定义了这篇文章自身的起始信息”。
必须作为 article 的第一个直接子元素
header 要真正归属于 article，就必须紧贴 <article> 开始标签之后，且中间不能插入任何非节元素（比如 <div>、<span>）。否则它的语义作用域会被上移或丢失。
- ✅ 正确：
<article><header><h2>标题</h2><time>2026-06-20</time></header><p>正文开始…</p></article></li> <li>❌ 错误：<code><article><div><header>…</header></div><p>正文…</p></article>
→ header 实际归属 div，而非 article
内容应聚焦标题与元信息，不放正文或交互控件
article 内部的 header 是“引导性容器”，只承载该文章自身的标识性内容。正文段落、图片、按钮、相关推荐等都属于主体或附属内容，必须放在 header 外部。
- 推荐包含：主标题（
<h2>或<h3>）、副标题/导语（<p class="subtitle">）、作者（<p>作者：李四</p>）、发布时间（<time datetime="...">） - 避免放入：正文第一段、封面图、点赞按钮、分享组件、分类标签栏（若含链接或复杂结构）
- 纯元信息也可独立使用：
<header><p>作者：王五</p><time>2026-06-18</time></header>合法且语义明确，不要求必须有 heading 元素
标题层级需配合整页大纲，避免 h1 滥用
article 是独立语义节，但它嵌套在页面中。为保持全局文档大纲清晰，article 内的标题应降级使用，通常从 <h2> 开始，而不是每个 article 都塞一个 <h1>。
- 页面级
<h1>应保留在 body 或全局 header 中（如站点名） - 并列的多个 article，内部统一用
<h2>，既表明同级关系，又符合大纲逻辑 - 不要在 header 内写多个同级标题（如两个
<h2>），也不要用<hgroup>（已废弃）
与页面级 header 互不干扰，可共存且语义分明
一个页面可以同时存在全局 header（用于网站导航）和多个 article 内部的 header（用于各篇文章自身信息），它们作用域不同，读屏器会分别识别为“banner”和“article header”，不会混淆。
- 全局 header 通常位于
<body>下，含 logo、主导航 - article 内部 header 属于该 article 的上下文，读屏时会播报“article header”后接内容
- 两者结构上完全独立，样式可分别控制，无需担心嵌套冲突
