<main>必须且只能出现一次并作为<body>的直接子元素，否则会导致搜索引擎降权或跳过正文索引；其错位、嵌套或缺失会破坏爬虫对页面主题的识别，且DOM深度超6层无语义标签中断时将截断后续内容索引。
<main> 是搜索引擎定位页面主题区域的唯一锚点，不是“建议用”，而是“必须用且只能用一次”——漏掉、重复、嵌套错位，都会导致正文内容被降权或直接跳过索引。
为什么 <main> 错位会让爬虫忽略整段正文
Googlebot 把 <main> 当作页面语义主干的强制分界线：它不看 CSS 视觉位置，只认 DOM 中的标签层级和嵌套关系。一旦 <main> 被包在 <div class="wrapper"> 里，或出现在 <header> / <footer> 内部，爬虫就会判定“主体不可信”，转而回退到旧式启发式分析（比如靠 <h1> + 文本密度猜主题），准确率大幅下降。
-
<main>必须是<body>的直接子元素，不能嵌套在任何<div>、<section>或<article>里 - 如果 CMS 模板默认把
<main>套进两层<div>，哪怕内容完全正确，也会触发“结构不可信”信号 - SPA 项目 SSR 渲染时漏写
<main>，CSR hydration 后补上，对 Googlebot 无效——它只读首屏 HTML
<h1> 和 <main> 不匹配的典型错误现象
常见于 CMS 模板硬编码 + 动态内容拼接场景：<h1> 写在页头区域（如站点名），正文区再输出一个 <h1>（如文章标题），结果两个都落在 <main> 外，或一个在内一个在外。爬虫不会合并判断，而是直接放弃以 <h1> 为线索的主题推导。
-
<h1>必须位于<main>内部，且是其第一个块级子元素（紧贴开头，不隔<div>） -
<h1>文本需包含页面核心关键词，但不能堆砌；例如「React Suspense 边界调试指南」比「欢迎来到技术文档中心」有效得多 - Vue/React 中用
v-if或条件渲染切换<h1>，若 SSR 和 CSR 输出不一致（比如 SSR 渲染出空<h1>），会触发“结构漂移”惩罚
DOM 深度超 6 层如何切断主题识别链
实测表明：当 <main> 内部出现连续 6 层以上 <div> 嵌套，且中间未穿插任何语义标签（如 <section>、<article>、<header>），Googlebot 会在解析到第 6 层时截断后续节点——<h2> 及其后的段落、列表、代码块，全部不进索引库。
立即学习“前端免费学习笔记（深入）”；
- 这不是延迟索引，而是永久性丢弃；即使页面加载完成，那段内容也不会被收录
- 尤其影响技术文档类页面：参数表格、返回值说明、示例代码常被塞进多层
<div>容器，极易触达深度阈值 - 修复方式不是删 div，而是用
<section>替代无意义包裹——每个<section>都算作语义中断点，重置深度计数
真正卡住 SEO 的从来不是关键词密度，而是 <main> 是否干净、<h1> 是否唯一且紧贴、DOM 是否在第六层前就给出语义锚点——这三处出问题，再好的内容也进不了 Google 的主题理解模型。
