如何在不让它在句子中间暂停的情况下覆盖屏幕阅读器对句子中单词的发音？

Posted 2023-05-07

【中文标题】如何在不让它在句子中间暂停的情况下覆盖屏幕阅读器对句子中单词的发音？

【英文标题】：How can I override a screen-reader's pronunciation of a word in a sentence without having it pause mid-sentence?

【发布时间】：2017-09-15 10:36:32

【问题描述】：

假设我在 html 中有以下句子：

<p>Please enter your licence number</p>

屏幕阅读器将“licence”一词误读为“liss-ens”（拼音）。它应该发音为“lice-ens”（拼音）。

我想通过向屏幕阅读器提供语音拼写来解决此问题，同时让文本在视觉上看起来相同。

我可以使用<span>s、aria- 属性和样式如下：

<p>Please enter your <span aria-hidden="true">licence</span><span style="position: absolute; left: -10000em;">license</span> number</p>

这很好用，只是屏幕阅读器（我在 MacOS 上使用 VoiceOver 进行测试）在到达第一个跨度时暂停，迫使我按 [VO]+[右箭头] 前进到下一个词：

“请输入您的”...[VO]+[右箭头]...“lice-ens”...[VO]+[右箭头]...“数字”

我希望屏幕阅读器能够流畅地读出句子而不会停顿。

这可能吗？还是我不应该试图控制它？

【问题讨论】：

fwiw：在我的环境（设置为英国英语）中，使用 OSX、ios 上的 VoiceOver 和 android 上的 TalkBack，简单的 <p>... licence ...</p> 发音正确。就个人而言，我不会纠正/破解发音。您认为为一种环境修复的内容在另一种环境中可能是错误的，除非您有幸使用不同的 AT 工具和语言设置在所有平台上对其进行测试。如果视力受损的用户不理解所说的单词，那么 AT 设备/屏幕阅读器通常会提供工具来逐个字符地拼写单词，这有助于消除歧义。

【参考方案1】：

不要。

真的，别担心。我知道这听起来很陈词滥调，但这是基于多年来与屏幕阅读器用户合作（并尝试做你想做的事情）的真正建议。

大多数屏幕阅读器用户已经熟悉他们的工具是如何说出单词的，以及与缩写、日期、时间等相关的怪癖。如果试图覆盖它，您就有可能让用户感到困惑。

如果您与屏幕阅读器用户交谈，您可能会发现这是真的。这是一个非常普遍的问题，它再次出现在本周的 WebAIM 邮件列表中：http://webaim.org/discussion/mail_message?id=34398

请注意该线程中的这条有见地的评论：

事实上，有时如果您非常仔细地聆听屏幕阅读器用户的讲话，您会发现我们会像屏幕阅读器一样发音单词 - 而我们甚至没有意识到这一点。

绝对不要尝试重新利用<ruby>。一般来说，如果你不理解一个元素，那么就不要使用它，当然也不要作为一个 hack。这可能会给尝试自动翻译内容的人带来问题。

此外，如果您不准备 test it across all screen reader and platform combinations（包括每个屏幕阅读器和浏览器配对的多个版本），请不要使用 hack。

最后，请记住关于1/3 of screen reader users have vision，所以有时强制发音会与他们在屏幕上看到的内容相混淆。

【讨论】：

有充分理由的“不要”始终是最好的可访问性建议。

喜欢“不要”的答案！我通常会回答与可访问性相关的问题。建议投入潜在的可靠“黑客”实施。它可以防止不接受您的推理的开发人员创建重复的问题！如果在我回答的许多与可访问性相关的问题上发生这种情况，我只是引用 WCAG 并说“不要这样做！”。不幸的是，“复制和粘贴”代码答案不可避免地变得越来越流行，因为它们对开发人员来说更容易，然后告诉他们的经理导致他们寻求此类解决方案的要求被误导了。

同意代码点，在许多答案中，我包括了一个攻击性最小的黑客，但我选择不使用这个。我听到很多用户热情地描述了这个问题，我觉得如果我提供一种解决方法，我会是个混蛋。

不幸的是，不这样做可能同样糟糕或更糟。我正在尝试制作一本 15 世纪书籍的外交版，但是像 ñl 这样的词需要发音为 en el 而不是 ene ele，并且 dõde eſtã 需要发音为 dónde están 而不是 dode eta 。鉴于几乎每个单词都有这样的缩写，坦率地说，默认阅读是难以理解的。 W3C 正在研究它，但它可能暂时不会成为一个可行的解决方案：w3.org/TR/pronunciation-use-cases

来自 SR 用户 Léonie Watson 的持续确认：lists.w3.org/Archives/Public/w3c-wai-ig/2020OctDec/0047.html

【参考方案2】：

我想我找到了解决办法。这似乎适用于 MacOS 上的 VoiceOver。 （尚未使用 JAWS 等其他屏幕阅读器对其进行测试。）

解决方案是重新利用 <ruby> 元素，使用 CSS 覆盖其样式：

Please enter your 
<ruby>
  <rt aria-hidden="true" style="font-size: 1em"><!--Standard-->licence</rt>
  <rt style="display: inline-block; width: 1px; height: 1px; overflow: hidden"><!--Phonetic-->license</rt>
</ruby>
 number

这将显示正确的字符串，并以语音发音将其读出而无需暂停。

但我愿意接受其他/更好的解决方案。或者对问题本身的批评。 :)

【参考方案3】：

这行得通，有点：

<span aria-label="license">licence</span>

如果span 元素是AT 的焦点，它将被宣布为具有“组”角色，可以用aria-roledescription 属性覆盖（仅允许非空白值）。阅读句子或段落时不描述作用。

【讨论】：

developer.paciellogroup.com/blog/2017/07/…