html元素是否需要焦点才能被屏幕阅读器读取(Does an html element require focus to be read by screen readers)

html元素是否需要焦点才能被屏幕阅读器读取(Does an html element require focus to be read by screen readers)

如果我在屏幕上某处显示模态，并且我希望屏幕阅读器在某个时刻读取它，将aria-live设置为其中一个值就足够了，或者我还必须在显示时明确地对焦元素？

If I show a modal somewhere on the screen, and I want the screen reader to read it at some point, does setting the aria-live to one of the values suffices, or do I also have to explicitly focus the element when I show it?

最满意答案

根据W3C ：

根据对话框要执行的操作，应保存打开对话框之前具有焦点的对象。 这将允许在关闭对话框时将焦点恢复到此元素。 打开对话框时，焦点应设置为对话框中的第一个选项卡焦点元素。 如果对话框内容中没有制表符可聚焦元素，请将焦点设置为用于取消或关闭对话框的项目。 对话框中必须有一些元素可以接受焦点，以便屏幕阅读器在打开时说出对话框标题和信息。 为了防止键盘焦点离开对话框，请确定对话框中的第一个和最后一个选项卡可聚焦元素，并捕获文档中的键盘事件。

如果不这样做，这没有具体说明会出现什么问题，但是这个问题， 将屏幕阅读器的焦点设置在ember中的模态警报上 ，意味着如果你不这样做，屏幕阅读器将无法工作。

According to the W3C:

Depending upon the action to be performed by the dialog, the object with focus before the dialog box is opened should be saved. This will allow restoring focus to this element when the dialog box is closed. When the dialog box is opened, focus should be set to the first tab focusable element within the dialog. If there is no tab focusable element within the dialog box contents, set the focus to the item that is used to cancel or close the dialog. There must be some element within the dialog which can accept focus in order for the screen reader to speak the dialog title and information when it is opened. In order to prevent keyboard focus from leaving the dialog, determine the first and last tab focusable elements in the dialog and trap keyboard events within the document.

This doesn't get specific on what will go wrong if you don't but this SO question, Setting focus of a screen reader on a modal alert in ember, implies that the screen reader won't work if you don't do this.