Goal
Ensure keyboard focus moves in a logical order.
Success Criterion · WCAG 2.4.3
Focus Order
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 operability.
Level AWCAG 2.0Operable2.4 · Navigable
Copy button ready
What to do
Order interactive elements in the DOM so focus follows a meaningful sequence that matches the task.
Why it matters
Keyboard and assistive technology users rely on focus order to understand and operate the interface.
Success criterion
What WCAG 2.4.3 requires
Summarized directly from the official Understanding document so teams can quote the requirement accurately.
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 operability.
Intent
Why WCAG created this requirement
- Tab order should support completing tasks efficiently.
- DOM order typically defines focus order; avoid visual reordering that breaks DOM order.
- Incorrect focus order can make forms and dialogs unusable.
Benefits
Who gains when you pass
- Keyboard users can predictably navigate through controls.
- Screen reader users can follow the intended task flow.
- Users with cognitive disabilities benefit from consistent interaction order.
Why it matters
User impact when this criterion fails
Summaries drawn from the Understanding document help you socialize impact statements with product stakeholders.
Users may miss required fields or controls if focus jumps unexpectedly.
Dialogs may be unusable if focus starts in the wrong place or escapes unexpectedly.
Overview
When users press Tab to move through focusable elements, the order must make sense and preserve meaning. Focus should follow the visual and logical flow of tasks (e.g., top to bottom, left to right) and should not jump unpredictably.
- Prefer natural DOM order; avoid positive tabindex.
- When using modals, place focus on a meaningful initial control and trap focus inside.
- If using CSS order/grid placement, ensure DOM order still matches intended sequence.
Reference: All summaries and highlights originate from Understanding WCAG 2.4.3 and the W3C quick reference.
Fast facts
- Conformance level
- Level A
- WCAG version introduced
- WCAG 2.0
- Principle
- Operable
- Guideline
- 2.4 · Navigable
Examples
Make success tangible for teams
Share pass/fail snapshots to coach designers, engineers, QA, and content authors.
Checkout form
Pass
Focus goes Name → Email → Address → Payment → Submit.
Fail
Focus jumps from Name to Submit to Address due to DOM reordering.
Modal
Pass
Initial focus goes to modal heading/first field and stays within modal until close.
Fail
Focus moves behind the modal into page content while modal is open.
Evidence to keep
Document conformance decisions
Capture artifacts for VPATs, procurement reviews, and regression testing.
- Document focus management patterns for dialogs, menus, and custom widgets.
- Maintain regression test cases for critical flows and their focus order.
Official resources
Deep dives and supporting material
Keep these links handy when writing acceptance criteria or responding to audits.
Understanding 2.4.3
Official W3C interpretation, techniques, and intent for Focus Order.
Quick Reference 2.4.3
Filterable list of sufficient techniques and failures.
Technique G59
Placing interactive elements in an order that follows sequences and relationships.
Failure F44
Failure due to using tabindex to create illogical focus order.
Implementation checklist
Capture progress and blockers
- Ensure DOM order matches intended reading/interaction order.
- Avoid positive tabindex values; use 0/-1 appropriately for managed focus.
- For modals, set initial focus and keep focus within until closed.
- Review complex layouts (multi-column, sidebars) for logical focus order.
Testing ideas
Prove conformance with evidence
- Tab through pages and verify focus order matches logical/visual order.
- Test forms end-to-end and confirm focus follows completion sequence.
- Test dialogs: open and verify initial focus; Tab/Shift+Tab cycles properly.
- Use a screen reader and confirm navigation order remains meaningful.
Related success criteria
More from Navigable (2.4)
WCAG 2.4.1Bypass BlocksLevel AWCAG 2.4.2Page TitledLevel AWCAG 2.4.4Link Purpose (In Context)Level AWCAG 2.4.5Multiple WaysLevel AAWCAG 2.4.6Headings and LabelsLevel AAWCAG 2.4.7Focus VisibleLevel AAWCAG 2.4.8LocationLevel AAAWCAG 2.4.9Link Purpose (Link Only)Level AAAWCAG 2.4.10Section HeadingsLevel AAAWCAG 2.4.11Focus Not Obscured (Minimum)Level AAWCAG 2.4.12Focus Not Obscured (Enhanced)Level AAAWCAG 2.4.13Focus AppearanceLevel AAA