CODEWITHSUNDEEP
screenwai-ariareader
amy8374
amy8374

Reputation: 1530

Does an html element require focus to be read by screen readers

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?

Upvotes: 3

Views: 1471

Answers (1)

BSMP
BSMP

Reputation: 4807

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.

Upvotes: 2

Related Questions