WCAG 3.3.4 Error Prevention: Confirm Before Submitting Important Data

What This Criterion Requires

WCAG 3.3.4 requires that for web pages that cause legal commitments or financial transactions for the user, that modify or delete user-controllable data in data storage systems, or that submit user test responses, at least one of the following is true: submissions are reversible (the user can undo the action), data is checked for input errors and the user is given an opportunity to correct them, or a mechanism is available for reviewing, confirming, and correcting information before finalizing the submission. This criterion recognizes that certain types of submissions have significant consequences and users must be protected from errors. Online purchases, bank transfers, legal agreements, account deletion, and test submissions all fall under this criterion. The goal is to ensure that users, especially those with cognitive or motor disabilities who may make input errors more frequently, have a safety net before committing to consequential actions.

Why It Matters

Users with cognitive disabilities, learning disabilities, and motor impairments are more likely to make input errors, and the consequences of errors in legal, financial, or data-critical contexts can be severe. A user who accidentally orders 100 items instead of 1, who transfers money to the wrong account, or who deletes their data without understanding the consequences faces real harm. Users with dyslexia may transpose numbers or misspell names in legal documents. Users with motor impairments may accidentally tap the wrong button or enter incorrect values due to unsteady hands. Older adults who are unfamiliar with web interfaces may not realize a transaction is final until it is too late. Providing a review step before finalizing a purchase, allowing users to undo recent actions, or checking for common errors before submission protects all users from costly mistakes. This criterion is especially important for e-commerce checkout flows, banking interfaces, account management pages, and any system where user errors have real-world consequences that may be difficult or impossible to reverse.

Common Failures and How to Fix Them

<form action="/process-payment" method="post">
  <h2>Checkout</h2>
  <!-- Payment fields -->
  <input type="text" name="card" placeholder="Card Number">
  <input type="text" name="expiry" placeholder="MM/YY">
  <input type="text" name="cvv" placeholder="CVV">
  <button type="submit">Pay Now</button>
  <!-- Immediately processes payment, no review -->
</form>

<form action="/review-order" method="post">
  <h2>Checkout - Step 1: Enter Payment Details</h2>
  <input type="text" name="card" placeholder="Card Number" autocomplete="cc-number">
  <input type="text" name="expiry" placeholder="MM/YY" autocomplete="cc-exp">
  <input type="text" name="cvv" placeholder="CVV" autocomplete="cc-csc">
  <button type="submit">Review Order</button>
</form>

<!-- Review page shows order summary before final submission -->
<!-- <h2>Review Your Order</h2>
     <p>Item: Widget x 1 - $29.99</p>
     <p>Shipping: $5.00</p>
     <p>Total: $34.99</p>
     <button>Edit Order</button>
     <button>Confirm and Pay</button> -->

<button onclick="fetch('/api/delete-account', {method:'DELETE'})">
  Delete My Account
</button>

<button onclick="showDeleteConfirmation()">
  Delete My Account
</button>

<dialog id="delete-confirm" role="alertdialog" 
  aria-labelledby="delete-title" aria-describedby="delete-desc">
  <h2 id="delete-title">Confirm Account Deletion</h2>
  <p id="delete-desc">
    This will permanently delete your account and all associated data 
    including orders, saved items, and preferences. 
    This action cannot be undone.
  </p>
  <p>Type "DELETE" to confirm:</p>
  <input type="text" id="confirm-input" autocomplete="off">
  <button onclick="cancelDelete()">Cancel</button>
  <button onclick="confirmDelete()" class="danger">
    Permanently Delete Account
  </button>
</dialog>

How to Test

1. Identify all pages that involve financial transactions, legal agreements, data modification, or data deletion.
2. Attempt to complete a transaction and verify that a review or confirmation step is provided before the action is finalized.
3. Check whether submitted data is validated for errors before the transaction is processed, and that users are given a chance to correct any errors.
4. Verify that users can either undo the action after submission, or that adequate confirmation safeguards exist before the irreversible action occurs.

CMS-Specific Guidance

This criterion commonly causes issues on these platforms:

• Shopify Accessibility Checklist
• Bigcommerce Accessibility Checklist
• Magento Accessibility Checklist
• Wordpress Accessibility Checklist
• Wix Accessibility Checklist
• Squarespace Accessibility Checklist

Further Reading

• Accessible Forms Guide
• Wcag Explained Plain English
• Shopify Store Accessibility Guide

Related WCAG Criteria

• WCAG 3.3.1
• WCAG 3.3.3