- Success Criterion 2.4.3
- Conformance level A
Focus Resetting to the Top After Loading More Content
2.4.3 — Focus Order
Scenario
Setting
A video streaming service's show detail page
What’s wrong
After activating a load-more/expander control, focus resets to the top of the page instead of continuing at the injected content.
Example
Watch a video streaming service's show detail page closely and you'll spot this: after activating a load-more/expander control, focus resets to the top of the page instead of continuing at the injected content.
Why it matters
Keyboard and screen-reader users who follow focus rather than the pointer. On a video streaming service's show detail page, this barrier means they can't complete the task using a keyboard alone.
How to test
Activate a 'load more' or expand control and press Tab: check whether focus moves to (or starts at) the newly loaded content, rather than resetting to the top of the page.
How to fix
After load-more/expand, keep or place focus at the start of the injected content.
Outcome
Corrected, a video streaming service's show detail page 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