使用ARIA role="none“从可访问性树中删除项目

Question

删除“通用”项是否有效(例如，<div>或<custom-tag>)是否通过应用角色“无”属性从可访问性树中删除？

<custom-tag role="none"><...></custom-tag>

Answer 1

这不会将其从可访问性树中删除，但会将项转换为可访问性树中的通用容器(如<div>或<span>)，并删除所有语义含义。

因此，所有内容仍将是可访问性树的一部分。

更有可能的是，您希望aria-hidden="true"从可访问性树中删除某些内容。

但是，请注意，具有aria-hidden="true"的项中的任何可聚焦项仍然是可聚焦的，因此您还必须向它们添加tabindex="-1"。

你应该问的真正问题是“为什么我要对屏幕阅读器隐藏它”，因为你更有可能需要一个不同的解决方案(比如让项目可访问，或者完全删除所有使用display: none或类似工具的用户)。

Answer 2

屏幕阅读器，如JAWS和NVDA，非常擅长解释可访问性树中的通用或自定义标记。因此，除非您正在做一些需要从可访问性树中剥离语义信息的非常规操作，否则很少需要使用role="none"。

您可能希望使用role="none"来防止意外的屏幕阅读器行为，例如屏幕阅读器解析表中的数据，该表仅用于可视化布局。

相反，在对任何元素应用aria-hidden="true"时都应该格外小心，因为该属性隐藏了应用它的元素以及该元素的任何后代。这意味着屏幕阅读器根本不会报告这个元素或其中的任何内容。因此，在使用它之前，请确保这就是您要做的事情。

我同意Graham的观点，您可能首先要考虑为什么要对屏幕阅读器隐藏元素。应该谨慎地使用ARIA来指导屏幕阅读器的预期行为，而不是在没有首先考虑为什么它是必要的情况下就应用于元素。