- Success Criterion 2.4.3
- Conformance level A
Activating a Control That Throws Keyboard Focus Elsewhere
2.4.3 — Focus Order
Scenario
Setting
A fashion e-commerce site's checkout page
What’s wrong
Activating a control (a filter checkbox, a Next button) throws keyboard focus somewhere else instead of keeping it on the control — the user loses their place after every action.
Example
Here's a real case from a fashion e-commerce site's checkout page: activating a control (a filter checkbox, a Next button) throws keyboard focus somewhere else instead of keeping it on the control — the user loses their place after every action.
Why it matters
Keyboard and screen-reader users who follow focus rather than the pointer. Here, on a fashion e-commerce site's checkout page, the result is they can't operate the feature without a mouse.
How to test
Activate a filter checkbox or a 'Next' button and check focus: if it jumps away from the control you just used instead of staying on/near it, it fails.
How to fix
Keep focus on the activated control (checkbox, Next button) after it's triggered.
Outcome
After the fix, the same visitor to a fashion e-commerce site's checkout page can now reach and operate the control without a mouse.
Who is affected
Keyboard and screen-reader users who follow focus rather than the pointer.
Learn more
- Understanding Understanding document (opens in a new tab)
Related scenarios
- Tab Order That Jumps Around the Page Illogically
- Dialog That Opens Far From the Button That Triggered It
- Visual Layout Order That Doesn’t Match the Keyboard Tab Order
- Modal That Opens Without Moving Keyboard Focus Into It
- Modal That Closes Without Returning Focus to Its Trigger
- Expanded Content That Never Receives Keyboard Focus