In ARIA, what is the difference between aria-live="polite" and aria-live="assertive" on a live region, and which of the two do role="status" and role="alert" imply?
answer
- queue versus interrupt
- off is the default
- status is calm, alert cuts in
- both roles re-read the whole region
- output is a polite region already
basics
~10 saria-live="polite" queues the announcement until the screen reader finishes what it is saying; aria-live="assertive" interrupts immediately. role="status" implies polite, role="alert" implies assertive, and both imply aria-atomic="true".
solid answer
~50 sBoth values mark the element as a live region; they differ in urgency. `polite` means "tell the user at the next natural pause" — the announcement is queued behind whatever the screen reader is currently speaking, including the user's own navigation. `assertive` means "say it now" — it interrupts the current utterance, which is disruptive and should be reserved for things the user must act on immediately, like a session about to expire or a submission that just failed destructively. The third value, `off`, is the default for ordinary elements and means the region is not watched. Two roles carry these settings implicitly: `role="status"` behaves as `aria-live="polite"` and `role="alert"` as `aria-live="assertive"`, and both also imply `aria-atomic="true"`, so the whole region is re-read rather than just the changed fragment. Reach for the role rather than the raw attribute where it fits — it is shorter and conveys intent. `<output>` maps to `role="status"`, so it is a polite live region for free.
code
html · 10 lines<!-- Polite: waits for a pause in speech -->
<p role="status">3 items in your cart</p>
<!-- Assertive: interrupts the current utterance -->
<p role="alert">Your session expires in 60 seconds</p>
<!-- Append-only stream: polite, not atomic -->
<ul role="log">
<li>Ada joined the room</li>
</ul>go deeper
Recall the three values — off, polite, assertive — say that polite waits for a pause and assertive interrupts, and name role="status" and role="alert" as their shorthand.
Explain the implicit settings each role carries, including aria-atomic="true" on status and alert, and justify picking one value over the other for a specific message.
Demonstrate judgment about interruption cost: which messages in a real product deserve assertive, why a page with several assertive regions is a design smell, and why an announcement is not a substitute for navigable on-page content.
Own the convention across a product: a small vocabulary of message severities mapped to roles, so teams stop choosing assertive ad hoc, and a review rule that catches interrupting announcements before they ship.
## The three values `aria-live` takes exactly three values: - **`off`** — the default for elements that are not live regions. Changes inside are not announced. - **`polite`** — changes are announced at the next natural break in the screen reader's speech. If the user is reading a paragraph or arrowing through a list, the message waits its turn. - **`assertive`** — changes interrupt whatever is being spoken right now. There is no fourth value. "rude" appeared in very old drafts and is not part of the specification; `alert` is a *role*, not an `aria-live` value, and writing `aria-live="alert"` does nothing. ## What "polite" costs and what "assertive" costs Polite is the correct default for almost everything: search result counts, "Draft saved", "3 items in cart", a filter that narrowed the list, an async panel that finished loading. The cost of polite is latency — if the user is mid-sentence in a long paragraph, the message may land seconds later, or be dropped if several messages pile up. Assertive cuts the user off mid-word. That is genuinely disorienting: they lose their place in what they were reading, and if assertive messages are frequent, the page becomes unusable rather than more accessible. Reserve it for content the user must react to immediately — "Your session expires in 60 seconds", "Payment failed, your card was not charged", a validation error surfaced on submit that blocks the user from continuing. If you find yourself with several assertive regions on one page, the design is wrong, not the users. ## The implicit-role shortcut ARIA defines roles whose live semantics come built in: | role | implicit aria-live | implicit aria-atomic | |---|---|---| | `status` | `polite` | `true` | | `alert` | `assertive` | `true` | | `log` | `polite` | `false` | ```html <!-- these two are equivalent --> <p role="status">3 results</p> <p aria-live="polite" aria-atomic="true">3 results</p> ``` `role="log"` is the odd one out: it is meant for an append-only stream such as a chat transcript or a console, where each new entry matters and re-reading the whole history would be absurd, so it does *not* imply atomic. Prefer the role when it fits. It is one attribute instead of two, it names the intent for the next developer, and it carries the atomic default that most single-sentence messages want anyway. You can still override — `<div role="alert" aria-atomic="false">` is legal — but if you are fighting a role's defaults, you probably want the raw `aria-live` attribute instead. ## The native freebie `<output>` maps to `role="status"`, which means it is already a polite live region: ```html <form> <input type="range" id="qty" min="1" max="10" value="1"> <output for="qty" id="qtyOut">1</output> </form> ``` Updating the `<output>` text announces politely with no ARIA attributes written by hand. This is the first rule of ARIA in miniature: when a native element already carries the semantics, use it instead of decorating a `<div>`. ## Choosing in practice A workable rule of thumb: ask what happens if the user hears the message thirty seconds late. If the answer is "nothing bad", it is polite. If the answer is "they lose money, data, or their session", it is assertive. Confirmations, counts, progress and non-blocking errors are polite. Timeouts, destructive failures and security prompts are assertive. And note what neither value does: they do not move focus, and they do not make the message reachable afterwards. A live-region announcement is transient speech. If the user needs to *return* to the message — to read a validation error again, for instance — the message must also exist as real, navigable content on the page, not only as an announcement. ## Common mistakes - Using `assertive` "to be safe" so the message definitely gets through — it definitely gets through, and it definitely interrupts. - Putting `aria-live` on an element that is already `role="alert"`, then setting a conflicting value, which leaves readers of the code unsure which wins (the explicit `aria-live` does). - Assuming `polite` guarantees delivery. If several polite messages queue up, screen readers may collapse or drop some of them; do not use a live region as a reliable log of everything that happened. - Treating `role="alert"` as if it made a dialog. It announces; it does not trap focus or block the page. A blocking prompt is a different pattern entirely.
- Where does role="log" fit alongside status and alert?`role="log"` is a polite live region intended for an append-only sequence such as a chat transcript or an activity feed. Unlike `status` and `alert` it does not imply `aria-atomic="true"`, so only the newly added entry is announced rather than the whole history — which is exactly what you want for a growing list.
- Is there a native HTML element that behaves as a live region without any ARIA attributes?Yes — `<output>` maps to `role="status"`, so it is a polite live region out of the box. Updating its text content announces the new value with no `aria-live` written by hand, which makes it the right element for calculated results and slider readouts.
- Does an assertive announcement move keyboard focus to the message?No. `aria-live` and the live roles affect speech only — they never move focus, change the tab order, or make the page block. If the user must act on the message, it also has to exist as real content they can navigate to; announcing it is not the same as putting it in their path.
saying these in an interview costs you the question
- Uses assertive everywhere so messages are not missed
- Writes aria-live="alert" as if alert were a value
- Thinks role="alert" moves focus or blocks the page
- Believes polite messages are guaranteed to be spoken
- Adds aria-live to an element that already has role="status"