Standard

Tab Order Checker

Paste HTML to see the order the Tab key moves through it, and catch positive tabindex, clickable things keyboards can’t reach and unnamed focus stops.

Tab order

Issues

Advertisement

About this tool

Keyboard users move through a page with Tab, so the order has to follow the visual and reading order. Browsers visit anything with a positive tabindex first, lowest number first, and only then everything else in source order. That's why positive values cause trouble: one tabindex="1" can drag a button to the front of the whole page. The fix is nearly always to use 0 or nothing and put the HTML in the right order.

Links need an href and disabled controls are skipped, which the order shows. The checker also flags things that look clickable but can't be reached by keyboard, such as a <div onclick> or role="button" without tabindex="0"; focusable elements inside aria-hidden="true"; and focus stops with no accessible name. It works from the HTML alone, so it can't see CSS that reorders things visually (flexbox order, absolute positioning). Tab through the real page to confirm.