QualiBooth

guides

屏幕阅读器测试:NVDA、JAWS、VoiceOver 与 TalkBack

在 NVDA、JAWS、VoiceOver 与 TalkBack 上进行屏幕阅读器测试的实用指南——为什么多阅读器测试重要、测试要点、阅读器/浏览器搭配及常见陷阱。

2 min read QualiBooth
抽象的音频波形,代表四款屏幕阅读器以不同方式播报同一个网页。

一个页面可以通过每一项自动化检查、以有效的 HTML 发布,却仍然对依靠听觉浏览网页的人完全不可用。自动化工具大约能捕捉三分之一的无障碍问题;其余的都存在于无障碍树技术上所包含的内容与屏幕阅读器实际向用户播报的内容之间的鸿沟里。弥合这道鸿沟意味着把你的界面放到你的受众所依赖的同一批工具面前——而这正是屏幕阅读器测试的意义所在。

本指南将讲解主流屏幕阅读器有何不同、为什么仅测试其中一款永远不够、究竟要测试什么、应使用哪些阅读器与浏览器的组合,以及连经验丰富的团队也会落入的陷阱。它写给那些希望有意识地测试而非靠猜测的开发者、QA 工程师和无障碍专家。如果你更愿意把这项工作交给每天使用这些工具的专家,我们的屏幕阅读器评估服务正是做这件事的。

为什么屏幕阅读器不是一个“朗读”工具

最常见的误解是认为屏幕阅读器只是把页面上的文字念出来。它所做的远不止于此,而理解这种差异是良好测试的基础。屏幕阅读器会根据浏览器的无障碍树构建一个并行的、非视觉的界面模型。它会播报每个元素的名称(“提交,按钮”)、其角色(按钮、链接、标题、复选框)以及其状态(已选中、已展开、已禁用、必填)。它让用户能够在标题、地标、表单字段和链接之间跳转,而无需触碰视觉布局。当动态变化——错误消息、搜索结果、状态更新——被正确暴露时,它会把这些变化念出来。

这与文字转语音有着根本的不同,后者只是把一段文本转换成音频,没有任何关于角色、状态或导航的概念。我们在文字转语音与屏幕阅读器的对比中详细讨论了这一区别,而它在此处很重要,因为为其中一者做测试并不等于为另一者做测试。屏幕阅读器用户不会从头到尾逐行消化你的页面;他们按结构导航,并期望每个交互元素都声明自己是什么以及正在做什么。

NVDA、JAWS、VoiceOver 与 TalkBack 有何不同

大多数团队需要关注的这四款阅读器,其行为差异之大,以至于“在某一款里能用”几乎无法告诉你它在其他几款里的情况。

NVDA(Windows)

NVDA 是一款免费、开源的阅读器,也是全球使用最广泛的屏幕阅读器。它与 Firefox 和 Chrome 搭配得最自然。NVDA 往往严格遵循 ARIA 和 HTML 语义,这使它成为出色的基准:如果你的标记中有什么坏了,NVDA 通常会把它直白地暴露出来。它有两种关键模式——浏览模式(用于阅读和结构导航)和焦点模式(用于在表单中输入和操作小部件)——而一个常见的 bug 来源就是未能触发正确模式切换的小部件。

JAWS(Windows)

JAWS 是历史悠久的商业阅读器,在企业、政府和许多工作场所中仍占主导地位。它与 Chrome 和 Edge 搭配。JAWS 以“热心”著称:它会应用启发式方法来猜测含义,有时会播报 NVDA 保持沉默的内容,偶尔还会掩盖本应修复的标记错误。这种热心是把双刃剑——“在 JAWS 里能用”的代码可能在 NVDA 或 VoiceOver 里失效,因为 JAWS 把问题掩盖了过去。它还有自己的虚拟光标和表单模式行为,与 NVDA 的略有不同。

VoiceOver(macOS 和 iOS)

VoiceOver 内置于每一台 Mac、iPhone 和 iPad 中,几乎只与 Safari 搭配。在 macOS 上,导航通过转子VO 组合键进行;在 iOS 上则完全由手势驱动——滑动以移动、双击以激活、两指旋转以使用转子。VoiceOver 通常是这四款中对 ARIA 最严格的:当名称或角色缺失时,它往往保持沉默而不去猜测,因此 JAWS 会播报的某个控件在 VoiceOver 里可能什么都不说。桌面版和移动版的 VoiceOver 彼此之间也不同,因此它们算作两个独立的测试目标。

TalkBack(Android)

TalkBack 是 Android 内置的阅读器,与 Chrome 搭配。与 iOS 的 VoiceOver 一样,它基于手势,但它的手势、焦点行为以及对实时区域和自定义控件的处理都与 VoiceOver 不同。移动阅读器总体上会暴露出桌面端从不出现的问题:无法通过滑动到达的触摸目标、在屏幕切换后意外跳转的焦点,以及视觉上存在却被线性手势顺序完全跳过的内容。

为什么多阅读器测试至关重要

由于这些阅读器在解释完全相同的标记时存在分歧,仅用一款阅读器测试会带来虚假的安全感。一些具体的模式反复出现:

  • JAWS 能完美播报的自定义组合框,在 VoiceOver 里可能完全沉默,因为 VoiceOver 拒绝推断缺失的 rolearia-expanded 状态。
  • NVDA 礼貌地播报一次的实时区域,在另一款阅读器里可能被反复播报,或根本不播报,这取决于 aria-live 与 DOM 插入时机如何相互作用。
  • 一个带有冗余或冲突名称的控件(可见标签加上 aria-label 再加上 title)可能被一款阅读器合理地播报,而被另一款阅读器播报成一串令人困惑的重复内容。
  • 在某一种浏览器/阅读器组合中与视觉顺序一致的阅读顺序,在另一种组合中可能出现分歧——当 CSS 重新排列内容而 DOM 没有时。

每款阅读器还绑定到不同的浏览器,因此你实际上测试的是阅读器加浏览器的组合,而非单独的阅读器。要确定你的产品对所有人都连贯一致,唯一的办法就是测试你的受众实际使用的真实组合。这一原则与手动无障碍审计背后总体上的原则相同:工具缩小搜索范围,人来确认体验。

测试什么

当测试有结构时,其效果会高得多。以下是重要的几个维度,大致按优先级排列,每个都映射到具体的 WCAG 2.2 成功标准。

播报:名称、角色、值

对于每一个交互元素,确认阅读器播报出准确的名称(它是什么)、正确的角色(按钮、链接、复选框、选项卡),以及在相关时的或状态。这是 WCAG 4.1.2(名称、角色、值)的核心。要特别留意:沉默的控件、仅被播报为“可点击”或“组”的控件、没有无障碍名称的图标按钮,以及被读成原始文件路径或类名的名称。

角色与状态

状态必须随着用户的交互而更新。一个展开的折叠组件应当从“已折叠”翻转为“已展开”;一个复选框应当从“未选中”变为“已选中”;一个排序按钮应当播报其当前方向。从不更新 aria-expandedaria-checkedaria-selectedaria-pressed 的静态标记是最常见的缺陷之一,而它只有在你于运行中的阅读器下操作该小部件时才会显露出来。

焦点顺序与焦点管理

用 Tab 键遍历整个界面。焦点必须以合乎逻辑、可预测的顺序移动(WCAG 2.4.3),必须始终可见,并且除了在模态框内有意为之,否则绝不能被困住。困难的情况是动态的:当对话框打开时,焦点应移入其中;当它关闭时,焦点应返回到打开它的那个元素。跳过这一点是模态流程不可用的最常见原因。

阅读与导航顺序

除焦点之外,屏幕阅读器用户还按结构导航。验证标题构成合乎逻辑的大纲(WCAG 1.3.1),地标(headernavmainfooter)让用户能够跳转,列表和表格的标记方式使阅读器能够导航并清点它们。检查阅读顺序是否与视觉意图一致,以及没有任何重要内容被乱序播报。

实时区域与动态更新

异步变化——验证错误、“找到 3 条结果”、“正在保存…”、toast 通知——必须传达给用户而不让其不堪重负。aria-live="polite" 用于非紧急更新,aria-live="assertive" 仅用于真正紧急的更新,role="status"role="alert" 用于常见情形。测试该区域在内容变化之前是否已存在于 DOM 中、更新是否恰好被播报一次,以及它是否不会在用户说到一半时打断。这支持 WCAG 4.1.3(状态消息)。

自定义 ARIA 小部件

任何由你自己构建的东西——菜单、选项卡、组合框、日期选择器、轮播、数据网格、树状视图——都需要最严格的审视。对照 ARIA Authoring Practices 测试预期的键盘交互和播报,然后确认真实的阅读器确实如此表现。APG 描述的是理想状态;阅读器对它的实现并不完美,这正是为什么一个可行的模式仍必须在每款阅读器中验证。

一个具体示例:不可访问与可访问的开关对比

考虑一个设置开关。一个在视觉上有样式但在语义上是空的版本:

<div class="toggle" onclick="setNotifications()">
  <span class="dot"></span> Notifications
</div>

对屏幕阅读器来说,这充其量是一段静态文本。它没有角色,所以不会被播报为控件;没有状态,所以用户无法判断通知是开还是关;它也不在 Tab 顺序中,所以键盘或屏幕阅读器用户根本无法到达或操作它。在测试中,NVDA 会读出“Notifications”然后继续;VoiceOver 可能会完全跳过它。

可访问的等价版本使用原生元素并暴露状态:

<button type="button" aria-pressed="false" id="notif">
  Notifications
</button>
const btn = document.getElementById('notif');
btn.addEventListener('click', () => {
  const on = btn.getAttribute('aria-pressed') === 'true';
  btn.setAttribute('aria-pressed', String(!on));
});

现在每款阅读器都会播报“Notifications,切换按钮,未按下”,它可通过 Tab 到达,可用 Enter 或空格键操作,并且在激活时状态会以可听的方式翻转。这个教训可以推而广之:优先使用原生语义;当你必须使用 ARIA 时,要测试每款阅读器是否真的遵守角色和状态。像这种缺失状态的缺陷模式,属于应避免的常见无障碍问题之一。

推荐的阅读器与浏览器搭配

测试真实用户使用的组合,而非任意配对。一个覆盖绝大多数屏幕阅读器用户的实用矩阵:

  • NVDA + Firefox(Windows)——发现标记问题最干净的基准
  • NVDA + Chrome(Windows)——实际中最常见的免费阅读器搭配
  • JAWS + Chrome(Windows)——在企业和政府环境中占主导地位
  • VoiceOver + Safari(macOS)——唯一完全受支持的桌面端 VoiceOver 搭配
  • VoiceOver + Safari(iOS)——基于手势的移动端,是与桌面端不同的独立目标
  • TalkBack + Chrome(Android)——标准的 Android 搭配

搭配很重要,因为阅读器是针对特定浏览器调校的;VoiceOver 配 Chrome 或 JAWS 配 Firefox 所产生的行为,并不能反映你的受众实际体验页面的方式。当你的分析数据显示出某个特定受众时——比如一个大量使用 JAWS 的公共部门产品,或一个偏向移动端的消费类应用——就相应地加权这个矩阵。我们的屏幕阅读器评估服务会根据每个客户的分析数据来调校这个矩阵,而不是测试一份固定的清单。

常见陷阱

即使是细心的团队也会在同样的事情上栽跟头。请留意这些:

  • 睁着眼睛测试。 如果你能看到屏幕,你会下意识地补偿阅读器没有告诉你的东西。关掉显示器,或至少把视线移开,仅凭听觉导航。
  • 只测试一款阅读器。 上文已述——这是虚假信心的最大来源。
  • 跳过表单/焦点模式。 在 NVDA 和 JAWS 上,自定义小部件往往需要用户处于正确的模式。如果你只在浏览模式下测试,就会错过在焦点模式下出问题的交互。
  • 过度使用 aria-label 到处添加 ARIA 标签可能会覆盖可见文本,使无障碍名称与所显示的内容失去同步,并使语音控制用户感到困惑。优先使用原生标注;只有当 HTML 无法表达这种关系时才动用 ARIA。
  • 假定 APG 能保证成功。 ARIA Authoring Practices 描述的是预期行为,而非每款阅读器的实际行为。务必对照真实阅读器进行验证。
  • 信任覆盖层小部件。 那些声称在运行时修复屏幕阅读器访问的覆盖层和“AI 无障碍”小部件,无法提供可靠的体验,而且往往会让它们声称要帮助的那些人的导航变得更糟。没有什么能替代经过真实测试确认的无障碍标记。审计实际的 DOM 和播报,而不是覆盖层的营销说辞。
  • 把移动端当作事后才考虑的事。 iOS 的 VoiceOver 和 Android 的 TalkBack 会暴露它们各自的手势、焦点和实时区域问题,而这些是桌面测试永远无法揭示的。

为什么由残障人士进行测试能增加价值

自己运行一款阅读器能发现很多问题——但在技术上通过与真正可用之间存在着实质性的差异,而这正是亲身经历最为重要的地方。每天使用屏幕阅读器的用户是凭本能导航的:他们按标题移动、用转子略读、能辨别一段播报何时啰嗦或冗余,并能立即感觉到某个流程何时迫使他们走上低效的路径——即便每一个单独的元素都“符合规范”。

一位视力正常、初次进行测试的开发者往往验证的是是否存在——“按钮被播报出来了”——而专家用户评估的是体验——“按钮被播报出来了,但标签含糊不清、确认信息没有被读出,而且走到这一步多花了十二次滑动”。这些可用性发现很少出现在合规检查清单中,然而它们恰恰决定了一个人能否真正完成一项任务。这就是为什么 QualiBooth 将自动化的无障碍扫描软件和我们的无障碍工具包由残障人士进行的审计相结合:工具找出显而易见的问题,专家找出真正破坏体验的问题。对于频繁变化的产品,周期性无障碍审计能让这种覆盖在各个版本之间不致漂移。

屏幕阅读器测试在你的项目中处于何处

屏幕阅读器测试是更广泛实践中的一门学科。它与纯键盘测试以及你的用户所依赖的自适应网页工具自然地配合,并产生那种支撑EAAADASection 508下法律义务的证据。这些发现还会直接汇入文档:我们的团队会把逐个阅读器的结果转化为 VPAT 报告,以及我们通过无障碍咨询交付的、按优先级排列的整改计划。如果你构建的是一个长期项目而非一次性检查,正是这种整合让无障碍不致倒退。

结论

屏幕阅读器并非可以互换,而一份干净的自动化报告也不等于一个可用的产品。NVDA、JAWS、VoiceOver 和 TalkBack 各自以不同方式解释你的标记、与不同浏览器搭配、暴露不同的缺陷——因此,跨你的受众实际使用的真实组合进行测试,是获得信心的唯一途径。围绕播报、角色与状态、焦点、阅读顺序、实时区域和自定义小部件来组织你的测试;优先使用原生语义而非 ARIA 补丁;忽略覆盖层;并且尽可能让每天使用这些工具的人来告诉你什么才是真正有效的。

当你希望由专家来验证这份信心时,QualiBooth 的屏幕阅读器评估会跨所有主流阅读器进行测试,并附带精确的标记修复方案返还发现结果。你也可以从免费扫描开始,或申请演示,看看你的界面如今处于什么状况。

常见问题

我究竟需要测试多少款屏幕阅读器?

至少要在桌面端测试 NVDA、JAWS 和 VoiceOver,如果你交付移动端体验,还要加上 iOS 上的 VoiceOver 和 Android 上的 TalkBack。测试得更少会留下盲区,因为这些阅读器在处理 ARIA 和动态内容的方式上存在分歧。

自动化工具能取代屏幕阅读器测试吗?

不能。自动化工具只能可靠地捕捉一部分问题——缺失的替代文本、一些对比度问题、某些结构性错误——但它们无法判断一段播报是否清晰、焦点是否合理地移动,或者一项任务是否真的能仅凭听觉完成。这些都需要真实的阅读器,最好还有真实的用户。

覆盖层或“AI 无障碍”小部件是否消除了测试的必要?

不能。覆盖层无法产生可靠的屏幕阅读器体验,而且经常引入新问题。持久的解决方案是经过真实阅读器测试确认的无障碍标记,而这正是我们的屏幕阅读器评估服务所提供的。

屏幕阅读器测试覆盖哪些 WCAG 标准?

它直接支持 1.3.1(信息与关系)、2.4.3(焦点顺序)、4.1.2(名称、角色、值)和 4.1.3(状态消息)等。结构化评估中的每一项发现都可以映射到相关的 WCAG 2.2 成功标准。

不确定你的产品在真实屏幕阅读器上读起来如何?