必须且只能出现一次，因google将其视为页面唯一主体内容区的强信号；多个会触发结构冲突检测，降低可信度评分。

<main></main> 标签缺失时，Googlebot 容易把侧边栏或页脚当成主内容；<nav></nav> 用对了，爬虫会跳过重复链接、更快抓取正文——语义化标签不直接加权，但直接影响爬虫对“哪段文字该参与排名”的判断。

为什么 <main></main> 必须且只能出现一次

Google 明确将 <main></main> 视为“页面唯一主体内容区”的强信号。一旦出现多个（比如 SPA 页面切换时旧节点没销毁），会触发其结构冲突检测机制，降低内容可信度评分。

• 常见错误：在 React/Vue 组件中动态插入 <main></main>，但未清理上一个实例
• 验证方式：用 Chrome DevTools 的 Lighthouse 运行 “Document structure” 审计，检查是否报 “Multiple
  elements”
• 替代方案：若需多区块逻辑，用 <section></section> + 明确的 <h2></h2>，而不是硬塞第二个 <main></main>

<section></section> 和 <article></article> 到底怎么选

两者都表达“独立内容”，但语义强度不同：<article></article> 要求内容能脱离当前页面被单独分发（比如 RSS 订阅、转发到社交平台）；<section></section> 只是文档内的逻辑分块，不需要自包含性。

Gingiris Seo Geo Agent

🇺🇸 SEO/GEO 代理运营 SOP — 完整实操手册，教你运行一个在一个月内实现约 3.2 万曝光的自主 SEO 代理。涵盖第 0‑4 周…

下载

• 适合用 <article></article>：博客正文、新闻稿、用户评论、产品详情卡片（含标题+描述+价格+按钮）
• 适合用 <section></section>：“关于我们”、“服务流程”、“客户案例”这类带小标题的栏目区块
• 陷阱：把整个商品列表页包进一个 <section></section>，却不给每个商品加 <article></article> —— 爬虫无法识别单个商品单元，影响结构化数据提取

<header></header> 和 <footer></footer> 不是“放logo和版权”的装饰品

它们是内容权重调节器：<header></header> 内的文本（尤其 <h1></h1>）默认获得较高主题相关性；<footer></footer> 内的链接和文字则会被降权处理，因为 Google 认为其属于站点元信息。

• 危险操作：在 <footer></footer> 里塞一堆关键词锚文本外链，或把登录表单、联系方式全丢进去——可能被判定为“元信息过载”，拖累整页可信度
• 合理做法：用 <footer></footer> 包裹版权年份、备案号、隐私政策链接；把“联系我们”“加入我们”等操作类入口放在 <nav></nav> 或主内容附近
• 兼容提醒：IE8 及更早版本不识别这些标签，但只需引入 html5shiv.js 即可支持（现代项目基本无需考虑）

真正容易被忽略的是：语义化标签本身不生成内容，它只是给内容加了一层“说明书”。说明书写得再准，内容空洞或关键词错配，照样没用。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！