System Design · Middle · Question 71 of 75

How do you announce asynchronous updates (e.g. "3 new messages") to screen reader users?

✓Correct answer: Render the message in an aria-live region (polite or assertive) that screen readers announce when it changes
2Change the page title only
3Use a red color

Explanation

The live region must exist in the DOM before the update. Don't overuse assertive, it interrupts users.

Further reading

MDN: aria-live ↗

Test yourself

Take the System Design · Middle quiz: questions and options are shuffled, and you get a review of your mistakes at the end.