问题描述
屏幕阅读器会在页面加载时宣布带有 role="alert"
的内容吗?
我看到了 MDN 对此提出的相互矛盾的建议。
https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Alert_Role 声明:
[T]他的警报作用是它用于动态内容......如果一个页面加载有多个可见警报分散在各处,则不会读取任何警报,因为它们不是动态触发的。
示例1:在HTML代码中添加角色
下面的代码片段显示了如何将警报角色直接添加到 html 源代码中。元素完成加载屏幕阅读器的那一刻应该收到警报通知。如果页面加载时该元素已经在原始源代码中,屏幕阅读器会在宣布页面标题后立即宣布错误。
警报角色可以/应该用于静态内容还是仅用于实时区域?
解决方法
我发现它不能可靠地读出。一些屏幕阅读器确实会读出警报,但其他人则不会。我们通过将焦点移到启用了 role="alert" 的元素来部分解决了这个问题,因为这通常也是读取元素的触发器。如果页面重新加载并读出一条消息,用户会期望他们的注意力集中在该消息上,这也是有道理的。
这个代码笔在展示以不同方式使用 role=alert 的影响方面非常有用:codepen.io/vloux/full/JOwxmO
discussion in the aria Github repo 关于添加在页面加载时读取的新属性。无论是否这样做(有一些分歧),在行为应该是什么方面肯定存在差距,这需要定义。