Understandable · Level AA · 3.3.4
Error Prevention (Legal, Financial, Data)
For pages that cause a legal commitment, a financial transaction, deletion or modification of stored user data, or a test submission, at least one safeguard has to exist: the action can be reversed afterward, the input gets checked and the user can correct mistakes before it's final, or there's an explicit review-and-confirm step before anything actually happens.
- Cognitive
- Motor
How to recognize it
Look at what happens on submission of anything with real consequences — a non-refundable purchase, deleting a saved account, submitting a graded quiz — and check whether a single click or keystroke finalizes it irreversibly with no review step. A 'Delete account' button that deletes immediately on click, with no confirmation dialog and no way to undo, is the clear failure. This matters for everyone who's more likely to make an accidental submission — people with reading disabilities who might transpose digits in a form (a wrong account number, a wrong date) without noticing, and people with motor disabilities who might trigger a click or keypress they didn't intend — but a mistake here isn't a minor inconvenience the way it is elsewhere, since the consequence (money spent, data gone, a legal commitment made) can't just be corrected on the next attempt.
How to fix it
Pick at least one of three mechanisms for high-consequence actions: make the action reversible after the fact (an 'undo' window, a cancellation period); validate the input and let the user correct errors before anything is finalized; or add an explicit review-and-confirm step that shows exactly what's about to happen and requires a separate, deliberate confirmation before it does. A simple confirmation dialog summarizing the action before committing to it is often the cheapest way to satisfy this for something like account deletion.
Example
Avoid
<button onclick="deleteAccount()">Delete account</button>
<!-- deletes immediately, no confirmation, no undo -->Prefer
<button onclick="showConfirmDialog()">Delete account</button>
<!-- opens a dialog: "This will permanently delete your account. Confirm?" before anything happens -->