如何让 Voiceover 正确读取日期

How to make Voice0ver read dates correctly

NOTE: using Chrome on Mac with VoiceOver

如果日期是"September 16th 2016",VoiceOver 读出的是"September One Six T H Two Zero One Six"。有没有办法让它正确读取为 "September Sixteenth Two Thousand and Sixteen"。 code pen link

<div tabindex="0" aria-label="September 16th 2016">16</div>

一个解决方案可以更改 aria-label 属性以保存 "September Sixteenth Two Thousand and Sixteen" 文本,但是有没有可以正确读取它的库?

我建议你不要试图改变这种行为。

您假设 VoiceOver 用户会遇到这个问题。 VoiceOver 用户更有可能从他们访问的所有其他宣布此类日期的网站上熟悉这一点。

如果有的话,请考虑去掉序号指示符("th," "rd," "nd," 等)。也许允许它在视觉上显示,但使用 aria-hidden.

从屏幕阅读器中隐藏它

此外,VoiceOver 用户通常不使用 Chrome,他们使用 Safari。

我还建议您找一些 VoiceOver 用户并听取他们的反馈。

SR 没有库,要符合要求,你应该是语义化的,你看到的就是 SR 宣布的内容,你可以使用带全文的 aria-label "September Sixteenth Two Thousand and Sixteen" 并且完全正确A11Y标准。 Tabindex 不是 a11y 的最佳实践。

要么使用 aria-label 并按照您希望的方式进行表达,要么请注意这是 VoiceOver (VO) 首选项(一项设置)。

例如。如果您希望您的 "September 16th, 2016" 按预期读取,请执行以下操作。

  1. 开始旁白
  2. 按住VO+V(控制+选项+V)
  3. 这为您提供了 Verbosity Rotor。按向右箭头浏览面板,直到到达 "numbers"
  4. 改为"words"

现在再次尝试阅读您的文字。它应该按预期读取。

有时,这是一个屏幕-reader 偏好。