main是爬虫提取网页核心内容的唯一入口，缺失或错误会导致内容降权；Google移动优先索引直接定位首个合法main抓取，若为空、嵌套、重复则触发Lighthouse错误并打折权重。
main 是爬虫提取网页核心内容的唯一入口，没它，Googlebot 会从页脚备案号里猜主题。
为什么 main 缺失或错误会导致内容被降权
Google 移动优先索引（2023 年起 100% 启用）不解析整个 body，而是直接定位第一个合法 <main></main> 开始抓取文本、链接和标题层级。没这个标签，或它为空、嵌套在 <footer></footer> 里、重复出现，都会触发 Lighthouse 的 “Multiple main landmark” 或 “Document does not have a main landmark” 错误，整块内容权重打折。
常见错误现象：
-
<main></main>里塞了登录弹窗、广告位、客服电话 —— 爬虫判定为“元信息污染”，主内容可信度下降 - SPA 页面只留
<div id="root"></div>，服务端未输出非空<main></main>内容 —— 等同于告诉爬虫“这里没主内容” - 首页卡片流布局中，给每个卡片都套一个
<main></main>—— 违反“全页唯一”原则，被忽略
article 和 section 在内容建模中的实际分工
article 是可独立分发、复用、被 RSS 抓取的内容单元；section 只是页面内逻辑子模块，依赖上下文存在。两者都需标题锚点，但语义权重不同。
立即学习“前端免费学习笔记（深入）”；
使用场景差异：
- 博客列表页：每条新闻应包裹独立
<article></article>，而非整个列表套一个<section></section>—— 否则爬虫误判为“一篇长文”，而非“10 篇独立报道” - 商品详情页：整体用
<main></main>包裹，其中“参数规格”“用户评价”“FAQ”等模块用<section></section>划分，每个<section></section>必须以<h2></h2>起始 -
<article></article>内部可再嵌套<section></section>，但反过来不行：<section></section>里不能包<article></article>，除非是评论区这类天然独立的内容片段
figure+figcaption 不只是图片说明，是结构化图文单元
单独给 <img alt="网页核心内容提取离不开HTML语义化标签" > 加 alt 属性只能让爬虫知道“这张图讲什么”；加上 <figure></figure> 和 <figcaption></figcaption>，等于声明：“这段图文组合构成一个独立可索引的内容单元”，搜索引擎会把 <figcaption></figcaption> 文本、alt 值、周围段落联合建模。
实操要点：
-
<figcaption></figcaption>必须是<figure></figure>的**直接子元素**，且只能有一个 - 避免写成
<figure><img><p>这是说明</p></figure>——<p>不是语义合法子元素，Lighthouse 会报错 - 图文单元若含时间信息（如新闻配图），应在
<figcaption></figcaption>中用<time datetime="2024-03-15">2024年3月15日</time>标记，提升时效性排序权重
标题层级与语义容器必须协同生效
搜索引擎靠文档大纲（Document Outline）构建语义图谱：<h1></h1> 是根节点，<h2></h2> 是一级子主题，<h3></h3> 是其下展开项。脱离语义容器的标题，或跳级、重复、装饰性使用，会让这棵树断裂。
关键约束：
- 全页仅一个
<h1></h1>，且必须含页面核心关键词（如产品页写<h1>React 语义化组件库 v2.3</h1>） - 每个
<article></article>或<section></section>必须以<h2></h2>或带aria-labelledby的元素起始；纯<section><p></p></section>不参与主题建模 - 禁止
<h1></h1>后直接<h4></h4>，也禁止用<h2></h2>包裹图标按钮或无文本区域 —— 这不是标题，是交互元素
最易被忽略的一点：语义容器本身不产生大纲节点，只有配合合法标题才生效。删掉 <section></section> 后，如果浏览器「Outline」视图没变化，那它大概率不该存在。
