area标签必须显式声明href或nohref才具语义，否则被浏览器和屏幕阅读器忽略；nohref是唯一标准方式表达“禁用跳转”，coords坐标在无JS下无法响应缩放。
area 标签在无 JS 环境下不会“退化为普通链接”——它压根就不是链接，除非你显式写了 href。没 href 也没 nohref，浏览器和屏幕阅读器都会直接忽略它。
不写 href 或 nohref，area 就是无效的空节点
很多人以为 <area coords="..."> 天然可点击，其实不然。HTML 规范要求：area 必须携带 href（表示跳转）或 nohref（表示禁用），否则它不具备语义，也不触发任何交互行为。
-
href存在 → 浏览器渲染为可点击热区，支持键盘聚焦、回车跳转、右键菜单 -
nohref存在 → 明确声明该区域不可交互，屏幕阅读器会播报“已禁用”，但不跳过 - 两者都缺失 → 大部分浏览器视其为冗余标记，DOM 中存在但辅助技术完全无视，连 tab 键都聚焦不到
href="#" 不等于“无脚本也能用”，它会刷新页面
用 href="#" 看似简单，但它在无 JS 场景下实际效果是：点击后滚动到页面顶部，并触发一次完整页面重载（等价于 location.href = "#"）。这不是“保留功能”，而是引入副作用。
- 若页面有锚点
id="top"，则跳转到该位置；否则回到页首 - 若页面通过 History API 或 hashchange 监听做了路由，
#可能意外触发逻辑 - 真正想“禁用跳转但保持可访问性”，应配
href="javascript:void(0)"+tabindex="0"+role="link"（虽非标准，但无 JS 时至少能聚焦）
nohref 是唯一明确表达“此处不跳转”的标准方式
nohref 是 HTML4 就存在的布尔属性，HTML5 中虽被标记为“废弃”，但所有主流浏览器和辅助技术仍完整支持。它是唯一无需 JS 就能向用户和机器传达“此热区仅作视觉/布局用途”的合法手段。
立即学习“前端免费学习笔记（深入）”；
- 写法只需
<area nohref coords="0,0,100,100">，无需值 - 搭配
alt="装饰性分隔区域"，屏幕阅读器会读出描述并注明“已禁用” - 注意：
nohref和href互斥，同时出现时href优先，nohref被忽略
无脚本环境里，coords 坐标错位问题无法绕过
area 的 coords 是像素绝对值，不响应缩放。当用户缩放页面、切换设备或使用高 DPI 屏幕时，热区会整体偏移。这个缺陷在无 JS 环境下完全无解——因为重算坐标必须依赖 JS 监听 resize 和 load 事件。
- 即使你把图片设为
width: 100%; height: auto，coords仍按原始尺寸计算 - SVG 替代方案天然支持响应式，但 SVG 本身不支持
nohref，需用<a>包裹<path>并设href=""+aria-disabled="true" - 如果项目必须兼容无 JS 且需精准热区，唯一现实选择是放弃响应式图像，固定容器宽高 + 固定图片尺寸
真正容易被忽略的是：area 的可访问性不取决于是否用了 JS，而取决于是否严格满足语义前提——href 或 nohref 缺一不可，alt 不可空，usemap 名称大小写必须完全匹配。少一个，整个热区在无障碍链路上就断了。
