可访问性盲区源于语义断裂、焦点失控、状态失同步三类问题叠加；修复需回归html本意，正确使用语义化标签、label绑定、fieldset/legend分组、aria-live通知及第三方内容管控。
直接说结论：可访问性盲区不是“代码没写好”，而是语义断裂、焦点失控、状态失同步三类问题叠加的结果。修复它不靠加一堆 aria- 属性，而要回归 HTML 本意——让每个标签干它该干的事。
button 必须是 <button></button>，不是 <div> + onclick
<p>屏幕阅读器读不到 <code><div> 上的点击行为，键盘用户按 Tab 也停不住。它没有默认聚焦能力，也不响应空格/回车键。
<ul>
<li>必须用 <code><button></button> 标签，哪怕只是视觉上要重置样式
<button></button> 显式声明 type="button"，避免意外提交<div>（极少数场景），至少补全：<code>tabindex="0" + role="button" + keydown 监听 Enter/Space
label 不关联 input，等于没写
没 for 属性、也没把 <input> 包在 <label></label> 里，屏幕阅读器只会读“编辑文本”，完全不知道这是邮箱还是密码。
-
<label for="email">邮箱地址</label><input id="email" type="email">是最稳妥写法 - 避免用
aria-label替代可见文本，它不能解决上下文缺失问题 - 一组单选/复选框必须用
<fieldset></fieldset>+<legend></legend>包裹，否则选项之间无逻辑归属
动态内容更新后，必须用 aria-live 主动通知
JS 改了 DOM，但屏幕阅读器不会自动感知。比如表单校验失败、倒计时结束、通知弹出——这些变化对键盘用户是静默的。
- 非中断性提示（如成功提交）用
aria-live="polite" - 紧急状态（如错误阻断操作）用
aria-live="assertive" - 确保
aria-live容器本身不设display: none或visibility: hidden，否则会被忽略
第三方广告或嵌入内容，不能“放任自流”
广告 SDK 插入的按钮、弹窗、iframe，默认全是可访问性黑洞。你页面再规范，它一进来就破坏整个无障碍流。
- 广告 iframe 的
title属性常被运行时覆盖，必须用postMessage或同源contentDocument注入aria-label或aria-labelledby - 动态插入的广告弹窗，需用
MutationObserver捕获并立即加上tabindex="0"+aria-modal="true" - 完全不可控的广告（如 GPT 托管），外层容器必须加
aria-hidden="true"，并提供替代说明文本
最容易被忽略的是：语义不是一次写完就结束的事。当 JS 动态替换节点、CSS 隐藏关键元素、第三方脚本注入新结构——这些都会瞬间切断可访问性链路。检查不能只看初始 HTML，得在真实交互路径中逐帧验证焦点位置、ARIA 状态和屏幕阅读器播报内容。
