播报结束时切换aria-live吗？

Question

我目前正在研究一个交互式pdf阅读器项目，以使其更易于访问。 我做了一个<p>元素，它在屏幕上是不可见的，并赋予它aria-live属性。 每当我要宣布某事（例如打开抽屉）时，我都会设置该<p>元素的文本。 但是，如果用户希望整个页面都是公告，而Voice Over的键是VO + a ，那么也会读取<p>元素，但是我想防止这种情况发生。

有人可以建议这是否是宣布更改的正确方法吗？ 如果是这样，那么如果用户希望读取整个页面，该如何防止<p>元素被读取？ 我目前正在使用<p>元素来宣布是否打开/关闭了抽屉，或者字体/页码等是否发生变化。

Answer 1

您不能阻止屏幕阅读器读取整个页面来读取aria-live元素。 您可以从屏幕上直观地隐藏它，但不能从虚拟缓冲区或屏幕阅读器的内部表示中隐藏它，从而无法访问和读取它。

要从屏幕上隐藏元素，请查看流行框架中存在的CSS类，如.visually-hidden，.sr_only等。 这是向屏幕阅读器用户显示某些内容，而对常规屏幕用户隐藏该内容的一种常用方法。

要从屏幕阅读器表示中隐藏元素（但不一定是屏幕），可以使用aria-hidden。 但是随后，咏叹调生活也变得无效了。

您可能还会认为使用display：none或visible：hidden隐藏对scren阅读器和可视屏幕的元素。 其他相同的技巧，例如font：0，width / height：0，opacity：0，clip：0等也有相同的问题，它们不一定有效地将元素隐藏在各处。 但是，在那种情况下，行为就不存在。 根据使用的确切技巧，在某些屏幕阅读器和浏览器组合中，ARia-live将保持正常运行，而将停止与其他屏幕阅读器一起工作，尤其是在Safari Mac和iOS上的VoiceOver。

一个小技巧是从DOM中删除该元素，或在显示或设置之后不久将其空白，以免一晃一晃的读者之后便找不到该页面。 但是，您还必须注意这一点。 在某些情况下，我已经观察到，如果元素删除得太早（在仍在播报公告的同时），它会使屏幕阅读器立即删除该公告。 而且，当然，您无法知道屏幕阅读器是否已经完成阅读消息，当前是否正在阅读消息或尚未阅读消息。 如果这样做，请花点时间让元素可见5秒钟，10秒钟或更长时间，以确保完全读取该消息。

因此，总而言之，您没有一种真正好的方法来保持aria-live元素正常工作，同时又无法防止屏幕阅读器通过正常的页面阅读方式访问它。

Answer 2

正如@quentinc已经解释了视觉隐藏元素和屏幕阅读器隐藏元素之间的区别一样，您不能让屏幕阅读器可以使用该元素，但是要阻止它使用“全部读取”命令。

在许多情况下使用aria-live非常方便，但是由于没有关于您的具体情况的更多详细信息，因此很难提出其他建议。 但是，由于您确实提到过“抽屉打开”，对我来说，这听起来像是可以扩展/折叠的东西。 如果是这样，那么您应该检查出aria-expanded 。 您可以将该属性的值从false更改为true以向屏幕阅读器指示已扩展内容。 抽屉开口被认为是扩大的。 屏幕阅读器将负责宣布更改，因此您不需要aria-live 。