是否可以使用 javascript 来检测屏幕阅读器是否在用户机器上运行?

Posted

技术标签:

【中文标题】是否可以使用 javascript 来检测屏幕阅读器是否在用户机器上运行?【英文标题】:Is it possible to use javascript to detect if a screen reader is running on a users machine? 【发布时间】:2011-12-04 11:01:00 【问题描述】:

我想检测屏幕阅读器是否在用户的机器上运行,以避免声音与 html 中的音频标签发生冲突。如果是这样,请提供有关如何做到这一点的详细信息。

【问题讨论】:

+1。我没有这方面的经验,但支持<audio> 标签的屏幕阅读器肯定会找到一种避免声音冲突的方法吗?这肯定是他们的核心功能吗? 通常无法检测屏幕阅读器是否正在运行。 (即使某些无障碍技术正在运行,它也可能不是基于音频的屏幕阅读器:它可能是基于盲文的屏幕阅读器,或者使用某些与屏幕阅读器相同的技术的命令和控制语音控制应用程序确实。)如果您可以确定屏幕阅读器正在运行,您希望做些什么不同的事情? 【参考方案1】:

即使您可以检测到屏幕阅读器正在运行,您也不应该尝试做任何特别的事情。即使您对一组屏幕阅读器用户正确,也可能对另一组用户错误。最好一开始就专注于编写干净的 HTML5。

请注意,并非所有屏幕阅读器用户都使用文本转语音;许多使用盲文输出。此外,其他类型的可访问性工具(例如内容荧光笔和语音输入应用程序)使用与屏幕阅读器相同的技术和 API(例如 DOM、MSAA),因此任何“检测屏幕阅读器”的技术也可能会检测到这些 - 所以你不能假设这意味着用户完全失明并且只使用语音。

就目前的情况而言,音频标签目前还不是普遍可访问的,不同的浏览器具有不同级别的可访问性支持 - 请参阅 HTML5 Accessibility 并向下滚动到音频以获取有关当前支持的更多详细信息。我已经看到一些页面在音频标签之后添加了基于 HTML5 的控件和 javascript,因此它们可以提供自己的 UI 以确保键盘或屏幕阅读器用户可以根据需要播放/停止音频。 (最终,当浏览器赶上来时,这应该是不需要的。)

就一般可访问性而言,WCAG 2.0 (Web Content Accessibility Guidelines) 建议任何自动播放超过 3 秒的音频都应具有可访问的方法来暂停或停止音频。 (我会更进一步,建议不要使用任何自动音频 - 使用选项卡式浏览时,通常无法确定音频来自哪个选项卡。)

【讨论】:

投反对票 - 想解释为什么投反对票?这个答案有什么可以改进的吗? 我不是反对者,但我能想到的一个例子是,如果您正在编写一个提供一些基本控制的框架,例如带有附加选择器的日期输入。对于移动平台或屏幕阅读器,您可能希望使用 input[type=date]。它很hacky,但检测移动设备并不难;该问题将涵盖屏幕阅读器。 我也不是反对者——在我的情况下,我有一个功能完美的原生选择下拉菜单,它的效果与屏幕阅读器的预期效果一样好。但是当我用 selectric 之类的插件“增强”它时,它突然对屏幕阅读器毫无用处。如果我知道屏幕阅读器在起作用,我永远不会启动 selectric,每个人都会更快乐。 我不能投票,但在我的情况下,我想要两个包含大量数据的不同表,一个用于具有普通 标签和 的屏幕阅读器和另一个 在响应式视图中使它变得漂亮的表格。正如 Garrett Dimon 所说:“数据表在响应式设计中表现不佳。只是说说而已。”
【参考方案2】:

虽然可能不是一种完全可靠的方法,但当用户浏览内容时,可以使用焦点事件通过 javascript 检测屏幕阅读器的进度。

隐藏的“跳过导航链接”(http://webaim.org/techniques/skipnav/) 如果被聚焦,将是检​​测某人是否在使用屏幕阅读器的一种方法。

尽管它没有解决问题的音频部分,但我只是想提供这个部分解决方案,因为我正在寻找自己检测屏幕阅读器的可能方法。

【讨论】:

那些使用键盘导航但使用屏幕阅读器的人呢? @stevax,据我所知,除了所描述的常见 IE 怪癖之外,无论您是否使用屏幕阅读器,使用键盘导航都意味着焦点事件。例如,Safari 的辅助 VoiceOver 确实在使用键盘浏览内容时应用焦点。当用户浏览页面时,tabindex 可用于按顺序强制关注特定元素。 也许我的评论不清楚。我试图说明的一点是,无法区分屏幕阅读器用户和由于其他原因(可能与 a11y 相关)使用键盘导航且未使用屏幕阅读器并试图定位屏幕的人这样的读者用户可能会受到很大的伤害。 我明白你的意思。 “显示:无;”屏幕阅读器看不见也是一个障碍。但是,一种可行的方法是在 3 个连续的元素中将中间元素标记为 aria-hidden="true" 或 aria-disabled="true"。如果元素 1 和 3 接收到焦点,则表明正在使用辅助技术(因为跳过了一项),而不是简单的键盘导航。因为我没有预见到任何键盘导航工具或插件应用任何与 WAI-ARIA 相关的状态或属性。 一些示例代码(可能已过时)可检测 javascript 事件(在屏幕阅读器、键盘用户和鼠标用户之间)的差异dylanb.github.io/screenreaderdetection【参考方案3】:

您无法使用 javascript 检测屏幕阅读器,也无法使用任何客户端技术检测屏幕阅读器。您可以使用 Flash 检测运行MSAA 客户端的软件。有关它的工作原理以及为什么它没有用且不应用于检测屏幕阅读器的更多详细信息,请参见此处:Developer Beware: Using Flash to Detect Screen Readers

【讨论】:

@billthelizard,如果您提供删除 cmets 的原因会很有帮助。

以上是关于是否可以使用 javascript 来检测屏幕阅读器是否在用户机器上运行?的主要内容,如果未能解决你的问题,请参考以下文章

检测地址栏是不是在 iOS 中显示

如何使用 JavaScript 检测移动设备?

是否可以检测到长按 Android 中的应用程序图标?

WAI-ARIA:Javascript 能力测试?

使用 JavaScript 检测通知弹出窗口

如何在客户端使用 JavaScript 来检测页面是不是已加密?