Error prevention

A safety step for high-stakes submissions: let people reverse, correct, or review the action before money, data, or legal commitments change.

are you sure before I send moneylet me review before submittingundo a dangerous changeconfirm before deleting my accountI sent the payment to the wrong persongive me an undo instead of a warningreview screen before checkouterror prevension

See it

Live demo coming soon

What it is

WCAG's error prevention requirement puts an extra safety net around submissions with serious consequences. When an action creates a legal commitment, moves money, changes or deletes user-controlled stored data, or submits test answers, at least one protection must exist: make it reversible, check for errors and allow corrections, or let the user review, confirm, and correct everything before the final step.

Reach for it in checkout, banking, account deletion, contract signing, and online exams. A useful review screen repeats the exact items, amount, recipient, and account affected, then keeps an Edit route beside the final action. When reversal is genuinely possible, an undo window or soft delete is often stronger protection than another warning. Gmail's Undo Send is the model worth copying: no dialog, no extra click, just a short window in which the action can be taken back.

The gotcha is confirmation theater. A generic 'Are you sure?' dialog makes people click through on habit and does not help them spot what is wrong. Name the consequence, show the values that matter, and do not discard entered data when the user goes back to correct it.

Ask AI for it

Add WCAG 2.2 SC 3.3.4 error prevention to this high-consequence submission. Validate known rules with the HTML Constraint Validation API and show every error beside its field without clearing entered values. Insert a review step that repeats the exact amount, recipient, items, account, and irreversible consequence, with an Edit control for each section. Label the final button with the concrete action, such as 'Pay $240' or 'Delete account', instead of 'Confirm'. For a Stripe payment, call stripe.confirmPayment() only after that review step. Make data changes reversible with a soft delete or an undo window wherever the system can restore the previous state.

You might have meant

undoable actiondestructive action confirmationerror identificationmodal dialog semanticswcag

Go deeper