Keyboard Navigation
Every interactive element must be reachable and operable by keyboard alone — the tab order must be logical, predictable, and cover the complete interface.
Keyboard navigation is the foundation of interactive accessibility. If something cannot be reached and activated by keyboard, it cannot be used by screen readers, voice control, or switch devices — regardless of how it looks.
What keyboard navigation requires
Every interactive element — links, buttons, form inputs, custom controls — must be focusable via Tab and activatable via Enter or Space. The tab order must be logical: it should follow the visual reading order of the page, not jump randomly between elements. Users must be able to complete every task available to a mouse user using only a keyboard.
Tab order
Tab order follows the DOM order by default. When DOM order matches visual order, tab order is usually correct. When visual layout is achieved through CSS positioning that reorders elements visually without reordering the DOM, tab order and visual order diverge — and keyboard users experience a sequence that makes no visual sense. The fix is to align DOM order with visual order, not to manipulate tabindex.
The tabindex trap
tabindex="0" makes any element focusable, which is useful for custom interactive components. tabindex="-1" removes an element from the tab sequence but keeps it programmatically focusable — useful for focus management. tabindex values greater than 0 create an explicit tab order that overrides the DOM order and almost always causes problems. Avoid positive tabindex values.
Keyboard traps
An interface must never trap focus in a way users cannot escape. The one exception is a modal dialogue — where keeping focus inside the dialogue while it is open is correct behaviour. But that trap must be intentional, documented, and escapable via Escape key. Accidental focus traps, where tabbing past a certain point leaves users unable to continue, are a WCAG failure.
The takeaway
Test every interface with a keyboard only before considering it complete. Tab through every interactive element. Activate every button and link. Complete every form. If any of these steps fail, or if the sequence is confusing, the interface is not keyboard accessible regardless of its visual state.