Skip to content

This translation has not been editorially reviewed yet. The German version is authoritative. Deutsche Fassung →

Accessibility

What does focus order mean on a website?

The focus order is the sequence in which the Tab key moves through a page's control elements. It must follow the visible arrangement: top to bottom, left to right. If focus instead jumps around every which way, keyboard users lose their orientation — they can't predict where the next keypress will land. WCAG criterion 2.4.3 requires a coherent order.

How an incorrect focus order comes about

The Tab key follows the order of elements in the source code — not what's visible on screen. If the design moves elements to different positions, the two orders diverge: focus jumps from the name field to the footer and back to the submit button. Dialog boxes added later often end up right at the end in the source code too — anyone wanting to tab into them first has to get through the rest of the entire page. A third classic case is fixed tab-index numbers in the source code that force their own order, colliding with the layout. All of this only becomes visible in an actual keyboard pass.

How the audit service measures the focus order

The audit service actually presses the Tab key on your page and logs the position of every stop. It then counts backward jumps: places where focus clearly jumps upward, or leftward within the same line, against the reading direction. If more than 30 percent of the focus changes are backward jumps, the criterion counts as violated; between 10 and 30 percent, the report notes a manual check case, since multi-column layouts can explain individual jumps. Below that, the order counts as coherent. The report states the number of backward jumps and the stops checked — you see the measurement basis, not just the verdict.

  • Tab through your most important page and watch the highlight — does it follow the reading direction from top left to bottom right?
  • Pay special attention to forms: the field order by keyboard must match the visible order.
  • Ask your agency to avoid fixed tab-index numbers in the source code — the source-code order should be the visible order.
  • Have dialog boxes move focus into the window when opening, and return it to its starting point when closing.

FAQ

Why does the keyboard focus on my website jump around erratically?

The Tab key follows the order in the source code, not the visible arrangement. If the design moves elements to different screen positions, or if fixed tab-index numbers force their own order, the two diverge. Focus then appears to jump around the page seemingly at random. The solution: bring the source-code order and the visible order into alignment.

Who is affected by an incorrect focus order?

Everyone who works without a mouse: blind people using a screen reader, people with motor impairments, and users of specialised keyboards. They navigate the page exclusively with the Tab key. If focus jumps unpredictably, they fill in form fields in the wrong order or miss required fields — and, in doubt, abandon the process.

How is the focus order checked automatically?

Our audit service performs an actual keyboard pass: it presses the Tab key, logs the screen position of every stop, and counts jumps against the reading direction. With more than 30 percent backward jumps, the criterion counts as violated; between 10 and 30 percent, as a manual check case. The report states stops and backward jumps — the measurement basis is transparent.

Deutsche Fassung dieser Seite