Operable · 2.2 Enough Time
Users must be able to postpone or suppress interruptions, such as alerts, pop-ups and automatic content updates initiated by the content or server. Interruptions involving an emergency are exempt.
Live demo
The same task, done two ways: switch between the version that passes and the one that fails, or put them side by side. Everything in the box is live, so try it with a keyboard, a pointer or a screen reader.
Start filling in the form while travel updates keep arriving. In Passes you can hold the updates until you are ready to read them.
Enter your booking reference and the date you want to travel instead.
Enter your booking reference and the date you want to travel instead.
The tools follow the version you last used.
What happened
Why it passes
You can put the updates on hold while you work and read them all when you choose, so nothing breaks your concentration.
Why it fails
A new update pushes in every few seconds and nothing holds them back, so you keep losing your place in the form.
Examples
Four examples, each one running: the usual ways this criterion fails, and code that passes. Listen to them, measure them, or copy the code.
Fails
Live preview
// Reloads the news page every 60 secondssetInterval(() => { location.reload();}, 60000);Every minute the page reloads: the reader loses their place and a screen reader starts again from the top. There is no way to postpone or stop it.
Passes
Live preview
const source = new EventSource("/live/stories");let waiting = [];source.addEventListener("message", (event) => { waiting.push(JSON.parse(event.data)); showNewButton.textContent = "Show " + waiting.length + " new stories"; showNewButton.hidden = false;});showNewButton.addEventListener("click", () => { waiting.forEach(addStoryToList); waiting = []; showNewButton.hidden = true;});New stories are held until the reader asks for them, so the page never changes under them (technique G76).
Fails
Live preview
setTimeout(() => { chatInvite.hidden = false; chatInvite.querySelector("button").focus();}, 30000);Thirty seconds in, a chat invitation appears and takes focus in the middle of a task. There is no setting to stop or delay it.
Passes
Live preview
<fieldset> <legend>While I shop</legend> <input type="checkbox" id="chat-invites" name="chat-invites"> <label for="chat-invites">Offer me live chat</label> <input type="checkbox" id="price-alerts" name="price-alerts" checked> <label for="price-alerts">Show price drop alerts</label></fieldset>Each kind of interruption can be turned off, and chat invitations start off. Only emergency messages, which the criterion exempts, would still appear.
Why it matters
People with attention deficits, cognitive disabilities or low vision, and screen reader users, lose their place and their train of thought when content interrupts them unexpectedly.
W3C: Understanding 2.2.4Level AAA
Level AAA is the highest level. It is not required for whole sites, but it is worth meeting where you can.
Where it is required
No law on this site requires Level AAA criteria for whole sites.
How to test
A few concrete steps. Automated tools find some failures; most need a person.
Common failures