Working title
Silent Results
Accessibility problem
A search/filter interface dynamically updates the results list as the user types or selects filter options. The visual content changes (items appear/disappear, a count updates), but there is no announcement to screen reader users. They have no idea that results have changed, how many results are now shown, or that their filter action had any effect. No aria-live region, no status message, and no focus management is in place.
Learning objective
- Understand that dynamic content updates are invisible to screen readers without explicit announcements
- Learn to use
aria-live="polite" to announce result count changes (e.g. "5 results found")
- Understand when to use
role="status" for implicit polite live regions
- Learn the difference between
aria-live="polite" and aria-live="assertive" in this context
- Optionally: manage focus to the results region after a deliberate search action
Difficulty
intermediate
Related WCAG success criterion
4.1.3 Status Messages (Level AA)
References
Before submitting
Working title
Silent Results
Accessibility problem
A search/filter interface dynamically updates the results list as the user types or selects filter options. The visual content changes (items appear/disappear, a count updates), but there is no announcement to screen reader users. They have no idea that results have changed, how many results are now shown, or that their filter action had any effect. No
aria-liveregion, no status message, and no focus management is in place.Learning objective
aria-live="polite"to announce result count changes (e.g. "5 results found")role="status"for implicit polite live regionsaria-live="polite"andaria-live="assertive"in this contextDifficulty
intermediate
Related WCAG success criterion
4.1.3 Status Messages (Level AA)
References
Before submitting