WCAG 2.1 · Level AA · Robust
WCAG 4.1.3 — Status Messages, explained with examples
Status messages (success, error, loading) must be announced by assistive tech without moving keyboard focus. Toast notifications, "Saved" confirmations, and inline error summaries are invisible to screen readers if they are not in a live region.
- Number
- 4.1.3
- Level
- AA
- Principle
- Robust
- Guideline
- 4.1 Compatible
Why this criterion exists
Toast notifications, "Saved" confirmations, and inline error summaries are invisible to screen readers if they are not in a live region.
If you only remember one thing: status messages (success, error, loading) must be announced by assistive tech without moving keyboard focus. Everything else on this page is detail.
Who feels it when this fails
Accessibility criteria sometimes feel abstract until you see who pays the cost when a site ignores them. Status Messages affects:
Screen reader users
How sites typically fail it
These are the patterns we see week after week. None are intentional — they are accidents of how teams build interfaces under deadline. Knowing the failure modes is the fastest path to writing them out of your component library.
Toast appears but is never announced
Form-saved confirmation only visible
How to test for it
Trigger a status; a screen reader should announce it without you tabbing.
Automated scanners catch this criterion most of the time, but never all of the time. Manual testing with the keyboard and a screen reader closes the gap.
A code fix you can copy
role="status" with aria-live="polite" announces non-critical changes; role="alert" interrupts for critical errors.
The problem
<div class="toast">Saved</div>The fix
<div role="status" aria-live="polite">Saved</div>
<!-- For errors: -->
<div role="alert">Could not save. Try again.</div>role="status" with aria-live="polite" announces non-critical changes; role="alert" interrupts for critical errors.
Frequently asked questions
What counts as a "status message" under 4.1.3?
Any message that appears without a focus change and conveys information about the result of an action or the progress of a process. Examples: "3 items added to cart", "Form saved automatically", "Searching...", "10 results found", "Password strength: strong", "Your order has been placed." Errors that also require immediate correction (like a failed form validation summary) may use role="alert" for more urgent announcement.
Do toast notifications automatically pass 4.1.3?
Only if they have role="status" or role="alert" with aria-live set. Most toast libraries do not set these by default. A toast that appears visually without a live region is invisible to screen readers. Check your toast library's ARIA implementation — or wrap its container in <div role="status" aria-live="polite"> and ensure the message text is injected into that container when the toast shows.
Is a spinner covered by 4.1.3?
A loading spinner that appears without focus movement should have an associated live region announcing the loading state. Use aria-live="polite" for background loads and aria-busy="true" on the region being updated. When loading completes, update the live region with "Content loaded" or inject the new content into the region — whichever makes more sense for the context.
Other Robust criteria
Find every accessibility issue on your site in 60 seconds.
Free public scan. No card. AI-generated fixes for every issue we find.