该用 时是整站级主导航（如顶部菜单），因其被屏幕阅读器识别、提升seo权重；非主导航链接组应选 或 ； 需有明确主题和标题； 全局唯一且不可嵌套于 ； 和 提供关键机器可读语义。
什么时候该用 <nav></nav> 而不是 <div class="nav">
<p>屏幕阅读器用户按快捷键跳转导航时，只识别原生 <code><nav></nav>；<div class="nav"> 完全不被识别，等于主动屏蔽辅助访问能力。搜索引擎也会对 <code><nav></nav> 内部链接赋予更高权重，尤其当它出现在 <header></header> 或页面顶部时。
但别一看到“导航”就套 <nav></nav>：页脚里的“友情链接”、文章末尾的“相关推荐”链接组，语义上不属于主导航，用 <div> 或 <code><aside></aside> 更合适。
-
<nav></nav>应包裹整站级、跨页面一致的导航（如顶部菜单、侧边全局菜单） - 单个按钮、分页控件、面包屑（
<nav aria-label="breadcrumb"></nav>除外）不推荐用<nav></nav> - 旧版 IE8 及更早浏览器不支持
<nav></nav>，需配合document.createElement("nav")或 polyfill（但 2026 年已基本可忽略）
<section></section> 和 <div> 的边界在哪
<p><code><section></section> 不是“视觉分块”的代名词。它要求内容有明确主题，且必须配一个标题（<h2></h2>–<h6></h6>），否则就是误用。比如一个纯图标+文字的工具栏，没标题、无独立主题，用 <div> 更准确。
<p>常见误判：<code><section></section> 嵌套 <section></section> 是允许的，但若子 <section></section> 没有自己的 <h3></h3>，而只是父 <section></section> 的展开项，那它大概率该降级为 <div>。
<ul>
<li>正确用法：<code><section><h2>产品功能</h2>
<p>…</p></section>
<section><div>按钮组</div></section>（没标题，主题模糊）
<main></main> 只能出现一次，但可以嵌套在 <article></article> 里吗
不能。<main></main> 表示整个文档的唯一主体内容，必须直接位于 下，且全文只能有一个。而 <article></article> 是可复用的独立内容单元（如一篇博客、一条新闻），它内部应使用 <header></header>、<p></p>、<footer></footer> 等组织，而不是再塞一个 <main></main>。
典型错误：在 CMS 页面中，把每篇动态加载的文章都包进 <main></main>，结果生成多个 <main></main> —— 这会破坏辅助技术的“直达正文”逻辑，也让 SEO 认为页面结构混乱。
- 正确结构：
<header>…</header><main><article>…</article></main><footer>…</footer> -
<main></main>内可包含多个<article></article>、<section></section>，但不可被任何其他语义标签包裹（<div> 可以） <li>若页面是单页应用（SPA），路由切换时需手动更新 <code><main></main>的aria-live属性，否则屏幕阅读器可能不感知内容更新 -
<time></time>的datetime必须是合法机器可解析格式（如YYYY-MM-DD、HH:MM），"昨天"或"8月25号"无效 -
<mark></mark>不该用于装饰性高亮（如强调价格数字），那是<strong></strong>或 CSS 的事 - 二者在 HTML 验证器中不会报错，但缺失会导致结构化数据测试（如 Google Rich Results Test）失败
为什么 <time></time> 和 <mark></mark> 容易被忽略却很关键
<time datetime="2026-08-25">今天</time> 不只是为了加个 tooltip，它的 datetime 属性是机器可读的时间戳，日历类扩展、RSS 解析器、SEO 结构化数据提取器都依赖它。不用它，就只能靠正则硬扒文本，准确率暴跌。
<mark></mark> 也不是高亮样式替代品。它表示“这段文字在当前上下文中有特殊相关性”，比如搜索结果页中关键词匹配部分、法律条文中被引用的条款——这种语义能被辅助技术朗读强调，也能被 CSS 用 mark:not([hidden]) 单独控制可见性。
<div>。</div>
