• Success Criterion 3.3.7
  • Conformance level A

Checkout Flow Requiring Shipping Address Twice

3.3.7 — Redundant Entry

Scenario

Setting

A food delivery app's restaurant menu

What’s wrong

Multi-step checkout asking for the same info twice (shipping re-typed at billing) with no "same as" option, no auto-population, and not essential.

Example 

<h2>Shipping address</h2>
<input id="ship-street"><input id="ship-city">
<h2>Billing address</h2>
<input id="bill-street"><input id="bill-city">
<!-- no 'same as shipping' checkbox and no auto-fill between the two -->

Why it matters

A customer ordering dinner has to type their address twice for one order, adding friction right when they're hungry and in a hurry.

How to test

Walk a checkout flow: if shipping information must be re-typed at billing with no 'same as shipping' option, it fails.

How to fix

Default to reusing the first address and only re-enable the fields if the user unchecks the box.

<h2>Shipping address</h2>
<input id="ship-street"><input id="ship-city">
<h2>Billing address</h2>
<label><input type="checkbox" id="same-as-shipping" checked> Same as shipping address</label>
<input id="bill-street" disabled><input id="bill-city" disabled>

Outcome

The customer checks out with one address entry instead of two and gets their food ordered faster.

Who is affected

People with motor disabilities and cognitive disabilities who find retyping identical text a significant added burden on a small touchscreen.

Learn more

Related scenarios