在阅读此div标签的文本时，如何阻止屏幕阅读器说“组”？

Question

在我的网页上，我有一个div（如下所示），其中包含我想要由屏幕阅读器阅读的文本。

HTML

<div tabIndex={0}>
    "text needs to be read"
</div>

我甚至可以听到没有提供咏叹调标签的文字。但是，我听说“文本需要阅读组”。我想知道如何避免它说“组”？我没有为div标签添加组角色。

Answer 1

这里发生了很多事情。

首先，网页上的所有文字都可供屏幕阅读器使用，不需要tabindex="0"即可阅读。屏幕阅读器提供lots of shortcut keys以导航到不同类型的元素（标题，表格，列表等）。对于没有直接导航键的元素，屏幕阅读器用户可以使用向上/向下箭头键来移动accessibility tree（类似于DOM）。

其次，关于tabindex="0"，它应该只设置在互动元素上。 tabindex spec说：

如果作为交互式控件或小部件，作者应该只使元素具有可聚焦性。此外，作者应确保这些可聚焦元素具有适当的ARIA角色属性。

关于规范引用中第二句中的ARIA角色，如果你的元素确实获得焦点，如果它不是本机可聚焦元素（例如<a>或<button>或<input>），那么它需要有一个合适的role以便屏幕读者用户将知道如何与它进行交互。

与此相关，你提到了aria-label。 aria-label仅对具有适当角色的元素表示敬意。见“2.10 Practical Support: aria-label, aria-labelledby and aria-describedby”。

所以尽管如此，回答你的问题有点困难，因为你的简单例子不够具体。没有角色的<div>不应该读为“组”。小组通常是role="region"（或<section>）。您听到的行为可能取决于您正在使用的浏览器，屏幕阅读器，您如何使用屏幕阅读器（标签或箭头或quicknav键）。