强制“旁白”在 Web 浏览器 (OS X) 中朗读文本

Force Voiceover to speak text in Web Browsers (OS X)

本文关键字:文本 OS 旁白 浏览器 Web 强制      更新时间:2023-09-26

我正在尝试使复杂的Web应用程序可访问。 我现在正在处理的部分涉及获取带有验证的表单字段,以便与屏幕阅读器很好地配合使用。

整体结构是一个输入标签(#input-with-validation(,带有控制验证的javascript。 根据输入的验证状态显示或隐藏单独的div(#validation 错误(。

我让它在 Chrome、Firefox 和 Windows 上的 IE 中使用 JAWS 主要一致地使用 role="alert" 和 aria-live="assertive" 的组合。

我正在寻找正确的方法来使其与OS X上的Voiceover(Chrome/Firefox/Safari或它们的任意组合(一起使用。 行为应该是,当 #input-with-validation具有焦点时,在每次按键上,如果存在验证错误,它将从 #validation 错误中向用户读取完整的验证错误消息。

它不应将焦点从验证 #input 改变。 我们可以使用 wai-aria 属性的任意组合,或者以我们认为合适的任何方式更改结构。

或者,有没有办法让我进行 javascript 调用,告诉 Voiceover "立即阅读此文本"? 这将解决几乎所有问题。

我们希望让每个人都能更容易访问互联网,但他们肯定不会让互联网变得容易。 感谢您的帮助!

注意:我们的页面是一个主要用 React 编写的复杂 Web 应用程序。

在努力使页面可供所有用户组访问时,您必须记住的一件事是,对于您可能选择使用的每个控件来说,现在都处于早期阶段。这包括浏览器、小部件库、屏幕阅读器;真的是整个工具集。

如果您测试并发现给定的 ARIA 功能不起作用,您可能不得不放弃某个浏览器/AT 组合。确保检查其他人是否有类似的问题,以支持您对您为其编写代码的任何人的声明。

我认为您这里有正确的解决方案,我可能会做同样的事情 - 将验证消息放在一个自信的 aria-live 区域中,并在出现问题时向这些区域触发验证消息。

我发现了这点测试,但我不能说你的具体情况被记录在案。但是,我说相信你的测试。在这个领域有很多工作要做。