Important dynamic changes in content, that are not given focus, are announced by screen readers
Design Notes
None
Developer Notes
Use aria-live to announce important visual updates
Users of assistive technology should be aware of important changes in content that are not given focus in a way that doesn’t interrupt them.
Inform users change of context by using the aria-live attribute on a sentence that notifies users on the change.
In most cases, aria-live should be set to "polite", which ensures any existing announcements will be allowed to finish before the context change.
Assigning aria-live="assertive" means information is announced immediately. You may want to use "assertive" in instances where an immediate response is required — such as to alert users of destructive actions (delete all Yes/No) or where there is a time limit coming to an end.
Information and tools
Testing Notes
Users are aware of important dynamic changes in content that are not given focus
Users of assistive technology should be aware of important changes in content that are not given focus — for example adding an item to a shopping basket. Generally this should be done in a way that doesn't interrupt users.
Developers should ensure users are informed of a change of context using aria-live regions. To ensure these updates occur only after existing announcements, the live region should be set to aria-live="polite".
Steps to check
- Test interface using a screen reader — for example, NVDA on PC and VoiceOver on Mac
- ARC Toolkit provides a way to identify all the live regions that have been implemented on a page
Impact range: Medium - High
Test type: Manual
Tool: ARC Toolkit (ARIA live)
Information: Developers Mozilla: ARIA Live Regions
WCAG Reference: Understanding Success Criterion 4.1.3 Status Messages