The following applies to any interactive element. Interactive elements include:
- Links
- Form fields
- Radio buttons
- Checkboxes
- Buttons
- Tab panels
- Navigation menus (including flyouts)
- Accordion menus
All of these must be reachable, visible, logical and usable from the keyboard.
Reachable
- Can you reach interactive elements using the Tab key?
- Tip: Hold down a Shift key, then use the Tab key to move backwards through the interactive elements on a page.
Visible
- Can you visibly tell which interactive element you have reached (in other words, do elements have visible keyboard focus)?
- Is the visible indication of keyboard focus obvious?
- Tip: Ideally, if an interactive element looks different when the mouse pointer hovers over it,
then it should do the same when it has keyboard focus.
Logical
Does the order that you move between interactive elements with the Tab key make sense and follow the natural reading order of the page?
Usable
- Can you use interactive elements without a mouse?
- Do arrow keys move between options in a checkbox or radio button group?
- Does the spacebar check and uncheck checkboxes?
- Does the spacebar select an option in a radio button group?
- Does either the Enter key or spacebar trigger a button?
- Does the Enter key let you follow a link?
