Keyboard navigation checklist for every web app

The audit

Unplug your mouse. In order:

1. Tab through the page from the URL bar. Every interactive element must receive focus in a logical order.
2. Focus must always be visible. If it disappears, an element or its parent has outline: none without a replacement.
3. Skip link. Press Tab once from the URL bar — the first focusable element should be a "Skip to main content" link.
4. Open a modal. Focus should move into the modal, cycle within it, and return to the trigger on close.
5. Menus and comboboxes. Arrow keys should navigate options; Escape should close.
6. Custom widgets. Any div with a click handler must be reachable via Tab and activate with Enter or Space.
7. Forms. Every field must be reachable and clearly labeled at focus.

Common failures

• onClick on a <div> with no tabindex and no keyboard handler.
• tabindex values greater than 0 that override natural order.
• Custom dropdowns that trap focus permanently.
• Focus lost after a modal closes.