- Success Criterion 2.4.3
- Conformance level A
Toolbar With a Broken Roving Tabindex Pattern
2.4.3 — Focus Order
Scenario
Setting
A photo-sharing app's upload screen
What’s wrong
Toolbars where roving tabindex (a toolbar keyboard pattern) is broken, scattering stops.
Example
A photo-sharing app's upload screen shows the problem clearly: toolbars where roving tabindex (a toolbar keyboard pattern) is broken, scattering stops.
Why it matters
Keyboard and screen-reader users who follow focus rather than the pointer. On a photo-sharing app's upload screen, this barrier means they can't operate the feature without a mouse.
How to test
Tab through a toolbar: if the roving tabindex pattern is broken (each button is its own tab stop instead of one stop with arrow-key navigation inside), it fails.
How to fix
Fix the roving tabindex (a toolbar keyboard pattern) so the toolbar is one stop with arrow-key movement inside.
Outcome
Corrected, a photo-sharing app's upload screen now lets a visitor complete the task using only the keyboard.
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