nvda 在鼠标悬停时默认读取可见文本而非 `aria-label`，这是设计使然；要确保屏幕阅读器正确播报自定义标签，应通过键盘导航（如 tab 键）触发，并避免用 `aria-label` 覆盖已有可见文本——推荐使用视觉隐藏（visually hidden）技术实现无障碍与可见性的统一。
在 Web 无障碍实践中，一个常见误区是认为 aria-label 应该在所有交互方式下（包括鼠标悬停）都覆盖可见文本。但事实并非如此：NVDA（及其他主流屏幕阅读器）在鼠标悬停模式下优先播报元素内实际渲染的可见文本内容，而非 aria-label。这是出于对“部分视力障碍用户”的兼容性考虑——他们依赖屏幕放大、高对比度等视觉辅助，需要耳听与眼见一致，否则会产生严重认知冲突。
✅ 正确验证方式：
请完全脱离鼠标，仅用键盘操作：
- 按 Tab 键聚焦到按钮；
- 或用方向键（如 →/↓）在虚拟光标模式下移动至按钮；
此时 NVDA 将准确播报 aria-label 的值（例如 “A button to upload”），证明其已正确生效。
⚠️ 关键原则：aria-label 不应替代可见文本
当按钮已有清晰、语义明确的可见文字（如 ）时，强行添加 aria-label 属于反模式。这不仅导致鼠标悬停与键盘焦点播报不一致，还可能干扰语音控制软件（如 Dragon NaturallySpeaking）——后者通常依据 aria-label 触发命令，而用户却看到“Upload”，造成操作失败。
? 推荐方案：视觉隐藏文本（.sr-only）
若需为屏幕阅读器提供更详细说明（如强调用途、上下文），同时保持界面简洁，应采用视觉隐藏但屏幕阅读器可读的文本结构：
配套 CSS（符合 WCAG 推荐的 .sr-only 类）：
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}? 为什么这样更可靠？
- 屏幕阅读器读取完整 DOM 文本流 → 播报“Upload required documents for verification”；
- 视力用户仅看到简洁的“Upload”；
- 键盘、鼠标、语音控制均基于同一语义源，行为一致；
- 完全规避 aria-label 与可见文本冲突的风险。
? 最佳实践总结：
- 优先使用清晰、唯一的可见按钮文本（如 “Upload Documents” 而非模糊的 “Upload”）；
- 若必须扩展语义，用 .sr-only 包裹补充说明，而非 aria-label；
- 永远通过键盘导航测试无障碍体验（Tab / Shift+Tab / Arrow Keys）；
- 避免为纯文本按钮添加 aria-label —— 这不是缺陷，而是规范要求。
遵循这一原则，你的应用不仅能通过 Total Validator 的“唯一标签”检查，更能为全谱系残障用户提供真正一致、可靠、可预测的交互体验。
