必须用<main>而非<div>：当页面存在唯一核心内容时（如博客正文页），且全文档仅能有一个<main>，不可嵌套在<article>等标签内；误用将导致辅助技术失效和SEO降权。
<header>、<main>、<nav>这些标签不是“加了更好”，而是“用错就埋雷”——比如把多个<header>塞进同一页面，或在<main>外再放一篇独立文章，屏幕阅读器和搜索引擎都会困惑。
什么时候必须用 <main> 而不能用 <div>
当页面存在唯一、不可替代的核心内容区块时，<main> 是强制语义要求。典型场景：博客正文页、产品详情页、新闻单篇页。
- 一个 HTML 文档中最多只能有一个
<main>，且不能嵌套在<article>、<aside>、<footer>、<header>、<nav>内部 - 如果页面是首页，且包含多个文章摘要（
<article>），<main>应包裹整个内容流，而不是每个<article>单独套一个 - 用
<div class="main">替代<main>会导致辅助技术无法识别主内容起始位置，部分 SEO 工具会降权该页
<section> 和 <article> 的边界在哪
关键看内容是否“可独立分发、重用或 syndicated”。不是按视觉区块划分，而是按信息单元的自治性判断。
-
<article>：博客正文、用户评论、论坛帖子、新闻稿——复制粘贴到另一网站仍能成立 -
<section>：同一文章内的“引言”“方法论”“结论”章节；或首页里“最新动态”“客户评价”“技术栈介绍”这类逻辑分组 - 常见错误：把侧边栏菜单包进
<section>——它更适合<aside>；把整篇博客包进<section>——它应是<article>，且通常放在<main>内
<nav> 不是所有链接集合都配得上
<nav> 专指“主要导航系统”，不是页面上任意一组链接。它的存在本身就在告诉机器：“这些链接对全站跳转至关重要”。
立即学习“前端免费学习笔记（深入）”；
- 页脚里的“隐私政策｜服务条款｜联系我们”通常不构成
<nav>，更适合普通<p>或<ul> - 面包屑导航（
首页 > 分类 > 文章）属于次要导航，W3C 明确建议不用<nav>包裹 - 搜索结果页右侧的“相关推荐”链接块，即使有 10 个链接，也不属于
<nav>——它服务于当前上下文，而非全站结构
最常被忽略的一点：<header> 和 <footer> 可以出现多次（如每个 <article> 都能有自己的 <header>），但它们的语义范围仅限于父容器。别指望一个全局 <header> 能自动覆盖所有子模块的标题逻辑——那得靠嵌套结构本身说话。
