• Success Criterion 4.1.3
  • Conformance level AA

Status Message Conveyed Only Visually, Never Programmatically

4.1.3 — Status Messages

Scenario

Setting

A car-rental site's checkout flow

What’s wrong

Overusing assertive/role="alert" (code that announces urgent messages) for non-status content is the inverse problem — the 4.1.3 fail is when *status* text appears only visually.

Example

<div id="cart-status">Item added</div> <!-- silent DOM update -->

Why it matters

Screen-reader users who need spoken confirmation of saves, errors, and results.

How to test

Trigger a status change with a screen reader running (eyes closed): if it's only visible on screen with nothing announced, it fails.

How to fix

The status text must be wired as a live region (code that makes screen readers announce updates)/status role so screen readers announce it automatically without moving focus.

<div id="cart-status" role="status" aria-live="polite">Item added</div>

role="status" with aria-live announces the update to screen reader users without moving their focus.

Outcome

On a car-rental site's checkout flow, this barrier is gone for screen-reader users who need spoken confirmation of saves, errors — they get the same result as anyone else here.

Who is affected

Screen-reader users who need spoken confirmation of saves, errors, and results.

Learn more