This translation has not been editorially reviewed yet. The German version is authoritative. Deutsche Fassung →
Checking keyboard operability: everything reachable, nothing trapped
Everything that works with the mouse must also work with the keyboard — and focus must be able to leave everywhere. An area you can enter with Tab but can only leave by reloading the page is a keyboard trap, and a Level A violation.
- The fastest self-test takes two minutes: put the mouse aside and operate your page using only Tab, Shift+Tab, Enter, Space, and the arrow keys. Wherever you get stuck or can't trigger something, there's a finding.
- Typical traps are homemade controls: a <div> with a click handler is invisible to the keyboard. The same goes for dialogs that don't trap focus — you tab behind the window and operate invisible elements behind it.
- Scrollable areas belong here too: a box with horizontal overflow must be focusable, otherwise nobody without a mouse can reach its right-hand part. We found this finding twice on our own site.
FAQ
How do I test keyboard operability myself?
Put the mouse aside, go through the page with Tab. Check three things: Can you reach every control? Can you always see where you are? Can you get out of every area?
What is a keyboard trap?
An area you can enter with the keyboard but can't leave — common with embedded players, maps, or editors. For keyboard users, the page ends there.
May we use single keys as shortcuts?
Only if they can be switched off, remapped, or restricted to when focus is present. Otherwise voice input or an accidental keystroke triggers functions unintentionally.