2.4.3: Focus Order

What it means

When users tab through a page, focus must move in an order that preserves meaning and operability. Focus should generally follow visual reading order and not jump unpredictably.

Positive tabindex values and CSS reordering often cause focus chaos.

How to fix it

• Keep tabindex at 0 or -1 unless you have a rare, documented reason otherwise.
• Ensure modal dialogs receive focus first and return it on close.
• Check that hidden off-screen elements are not focusable.
• Test focus order after responsive layout changes.

Quick examples

• Good: Focus moves from header to main content to footer in a logical sequence.
• Bad: Focus jumps to a hidden cookie banner in the DOM before the visible heading.
• Good: Opening a menu moves focus into the menu items in top-to-bottom order.
• Bad: tabindex=“1” on random widgets steals focus from natural tab order.