nav标签仅在包裹真实跳转链接、结构可访问、语义精准时生效；空、含logo/搜索框或伪链接的nav会被忽略，必须按“站点级、重复性、主要跳转路径”标准筛选内容，内部用ul/li结构，当前页加aria-current="page"，多nav需aria-label区分，href须准确匹配部署路径与协议。
nav标签不是为了“让导航看起来像导航”
它只在包裹真实跳转链接、结构可访问、语义精准时才生效。浏览器和屏幕阅读器会直接忽略空
哪些链接该进nav，哪些必须踢出去
核心判断标准是：这组链接是否承担「站点级、重复性、主要跳转路径」功能？
- ✅ 该放：
href="index.html"、href="/products"、href="#features"——顶部菜单、侧边栏目录、页内锚点导航 - ❌ 必须移出：
<button onclick="goTo('about')">、<div class="logo"></div>、<form></form>、社交媒体图标链接 - ⚠️ 面包屑可以进
内部结构怎么写才不踩坑
用<ul>不是为了CSS好写，而是WCAG和主流读屏器只稳定识别这种结构。平铺<a>会导致键盘用户无法感知“这是个列表”，Tab顺序也容易混乱。
- 必须写
<ul><li><a href="...">首页</a></li></ul>，别省<li> - 当前页链接必须加
aria-current="page"，比如<a href="about.html" aria-current="page">关于我们</a> - 多个
-
role="navigation"是冗余的，现代浏览器已原生支持<nav>语义，加了反而可能干扰解析
href值写错，nav再规范也没用
语义再准，跳转失效等于白搭。常见错误不是语法错，而是部署环境和交互预期不匹配。
立即学习“前端免费学习笔记（深入）”；
- 内部页面优先用根相对路径：
href="/contact"，避免href="contact.html"在子目录下404 - 锚点跳转要防fixed遮挡：
html { scroll-padding-top: 80px; }或给目标元素加scroll-margin-top - 外部链接必须带协议：
href="https://example.com"，不能只写href="example.com" - 邮箱链接必须写全：
href="mailto:help@example.com"，漏mailto:前缀会变成404
最常被忽略的是：nav本身不处理跳转逻辑，它只负责说清“这是导航”。跳转是否可靠，全看href值是否与实际路由、部署路径、协议层级对得上。
