搜索引擎严格依赖HTML语义标签嵌套与DOM位置定位主要内容；缺失、错置、过深嵌套（超6层）或与document.title不一致，均导致正文不被索引，SSR/SSG中首屏未含有效结构将失效。
搜索引擎不是靠“猜”来定位主要内容，而是严格依赖 HTML 结构中的语义标签嵌套关系和 DOM 位置信号。结构错乱时，<main></main>缺失、<h1></h1>塞在<footer></footer>里、或关键文本藏在 7 层 <div> 深处，内容大概率不被当作主体索引。
<h3>为什么 <code><main></main> 缺失会让正文“消失”
爬虫把 <main></main> 当作内容主干的唯一锚点。没它，就等于没交出“这篇稿子到底讲啥”的明确声明。
- 漏掉
<main></main>：搜索引擎被迫从一堆<div> 中推测主体，常误判广告区或侧边栏为正文 <li>重复出现 <code><main></main>：触发结构混乱标记，整页权重下调 - 把推荐位、相关文章、页脚链接塞进
<main></main>：稀释核心内容密度，降低该区块的语义可信度 - SSR/SSG 项目中，检查
document.body.innerHTML首屏完成时是否已含<main></main>—— JS 动态注入的<main></main>晚于 500ms，基本无效 -
<h1></h1>在<header></header>里但父级是<div class="site-header">：没问题，只要 <code><header></header>是<main></main>的兄弟或祖先 -
<h1></h1>在<footer></footer>或<aside></aside>里：爬虫判定“标题与上下文脱节”，降权甚至忽略整块区域 -
<h1></h1>和document.title语义不一致（如标题写“技术博客”，<h1></h1>写“联系我们”）：Google 采信<title></title>，但标记“结构混乱”，长期拖累相关性得分 - Lighthouse 会明确报 “
<h1> count</h1>” 和 “<h1> matches <title></h1>” 失败 - 正确做法：用
<main><section><article></article></section></main>替代<div class="wrap"><div class="inner"><div class="content">... <li>检查方式：用 DevTools Elements 面板手动数层级——从 <code>开始，到目标段落的直接父节点，≤6 层才算安全 - SPA 项目尤其危险：服务端未输出语义结构，全靠 JS 补，首屏 DOM 深度极易超标
-
<article></article>：必须能脱离当前页面单独存在并被理解（如一篇博客、一条新闻、一个商品详情） -
<section></section>：同一主题下的逻辑分块，不能脱离上下文（如“参数说明”“返回值”“示例代码”） - 把整篇博客塞进
<section></section>而非<article></article>：爬虫无法识别这是独立内容，影响聚合展示（如 Google News） - 把广告位放进
<nav></nav>：被识别为干扰性导航，连带降权整个导航区域
<h1></h1> 放错位置直接削弱标题权重
<h1></h1> 不是“视觉最大字号”，而是页面意图的最强信号。它的 DOM 父级决定了它“属于谁”。
DOM 深度超 6 层，<h2></h2> 及其后文本大概率不进索引
这不是理论限制，是爬虫实际资源截断行为。当纯 <div> 嵌套过深且无语义标签中断时，解析器会在某一层主动终止。<p><span>立即学习</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记（深入）</a>”；</p><div class="aritcle_card flexRow">
<div class="artcardd flexRow">
<a class="aritcle_card_img" href="/xiazai/skill7761" title="Article To Html"><img
src="https://img.php.cn/upload/skill/000/000/081/179168408018805.jpg" alt="Article To Html" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a href="/xiazai/skill7761" title="Article To Html">Article To Html</a>
<p>文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。</p>
</div>
<a href="/xiazai/skill7761" title="Article To Html" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a>
</div>
</div>
<ul><li>实测现象：嵌套 7 层 <code><div>，第 6 层以下的 <code><h2></h2>、<p></p> 文本不被收录，哪怕视觉完全可见
<section></section> 和 <article></article> 混用会干扰内容独立性判断
这两个标签不是“换着用更高级”，爬虫靠它们区分“可复用模块”和“独立发布单元”。用错等于发错信号。
真正难的不是写对标签，而是在 CMS 模板、组件化框架、动态 SSR 渲染中，让语义结构在所有渲染路径下保持一致 —— 尤其是 <h1></h1> 和 <main></main> 的位置，一旦错位，补救成本远高于预防。
