该用 当内容能独立存在（如rss订阅、社交转发），否则用 ； 需含标题、作者、时间等元信息， 必须有 – 标题且不可无意义嵌套。
什么时候该用 <article></article> 而不是 <section></section>
核心判断看内容能否“独立存在”：<article></article> 必须能单独被 RSS 订阅、被社交平台转发、或脱离当前页面仍语义完整；<section></section> 是同一主题下的逻辑分块，不能脱离上下文独立成立。
常见误用现象：把整篇博客正文包在 <section></section> 里——它该是 <article></article>；把 FAQ 列表整个塞进 <article></article>——它没独立作者、发布时间、可分发性，该用 <section></section>。
-
<article></article>内部通常包含<header></header>（含<h1></h1>或<h2></h2>）、作者信息、发布日期、<footer></footer>（如版权、标签） -
<section></section>可以嵌套在<article></article>内（比如「代码实现」「调试技巧」两节），但反过来不行 - 一个页面可以有多个
<article></article>（如新闻列表页），但每个<article></article>应有唯一标识（如id或itemprop="mainEntity"）
<section></section> 必须配 <h2></h2>–<h6></h6> 否则无效
W3C 明确要求：<section></section> 没标题 = 语义断裂。爬虫会直接忽略其结构作用，相当于白写。
错误示例：<section><p>这是功能说明</p></section> —— 没标题，搜索引擎不认为这是个“区块”，只当普通段落处理。
- 标题必须是
<h2></h2>–<h6></h6>，不能用<div class="title"> 或 <code><p></p>模拟 - 层级要连贯：父级用
<h2></h2>，子<section></section>就该用<h3></h3>；跳到<h5></h5>会让爬虫困惑归属关系 - 允许占位标题：内容暂无文字标题时，补上简明
<h3>技术细节</h3>比留空强 - 纯布局/样式容器一律用
<div>，哪怕加了背景色、边距、flex 布局 <li> <code><section></section>只用于有明确主题 + 标题的内容块，如「用户评价」「参数对比」「常见问题」 - 检查 DOM：删掉
<section></section>标签后，里面内容是否还能自然嵌入上下文？能，大概率不该用 - 不要把不同主题的内容硬塞进同一个
<article></article>（如把「产品介绍」和「客户案例」拼在一起） - 多个
<article></article>并列时（如首页文章流），确保每篇都有独立<h1></h1>或<h2></h2>，避免标题重复 -
<section></section>内部若含独立可分发内容（如某条评论），应改用<article></article>，哪怕只是嵌套一层
嵌套深度超过 3 层会触发 Google “结构噪声”惩罚
实测数据显示：连续嵌套 <section><section><section></section></section></section> 时，关键词密度识别准确率下降约 22%。Google 的解析器会把它当成“结构干扰项”，降低该区块权重。
典型陷阱：用 <section></section> 包导航栏 → 再包搜索框 → 再包筛选条件，三层纯样式容器全打上 <section></section> —— 这不是语义分块，是滥用。
<article></article> 和 <section></section> 混用时的 SEO 权重分配
Google 会基于语义标签推断内容主次：<article></article> 内容默认获得更高主题权重；<section></section> 内容被视为辅助解释，权重向下收敛。
例如一篇教程页：<article></article> 包裹全文（含标题、作者、正文），内部用 <section></section> 分「环境配置」「代码示例」「报错排查」——搜索引擎会把整篇当一个实体索引，各 <section></section> 的关键词自动绑定到主主题下。
