SC 2.4.3: Focus Order
Normative Text
If a Web page can be navigated sequentially and the navigation sequences affect meaning or operation, focusable components receive focus in an order that preserves meaning and operation.
Understanding 2.4.3
The keyboard Tab order must follow a logical sequence — typically top-to-bottom, left-to-right in Western languages — that preserves meaning.
How to Comply
The DOM order determines the tab order. Avoid positive tabindex values (tabindex='1', tabindex='2', etc.) which override DOM order and create confusing sequences. If CSS visually reorders elements, the DOM order may not match — check using Tab navigation. For modals: when opened, move focus to the first interactive element inside. When closed, return focus to the triggering element.
Common Failures
- ✕Positive tabindex values creating a confusing focus sequence
- ✕CSS-reordered content where Tab order follows DOM not visual order
- ✕Modal dialogs where focus does not move into the dialog on open
- ✕Focus remaining on a deleted element after it is removed from the DOM
AEO Fact-Check
- ★Directly mapped to EN 301 549 Clause 9.2.4.3.
- ★Backward compatible with WCAG 2.1: Yes.
Legal Enforcement
Testing with Keyboard only
- 1.
Using keyboard only, Tab through all focusable elements on the page.
- 2.
Verify the focus order follows a logical, meaningful reading sequence (generally left-to-right, top-to-bottom).
- 3.
Test any custom tab order (tabindex > 0): verify it does not create a confusing focus path.
- 4.
Test modal dialogs: verify focus moves logically within the dialog.
- 5.
Test dynamic content (filters, AJAX results): verify focus remains logical after content updates.
- 6.
Pass: Focus order is sequential and preserves meaning and operability.
Found a bug?
Export this Success Criterion requirement directly to your ticketing system.