Can you reach anything that’s interactive using the tab key?
Why it’s important: Maria has tendonitis and is unable to use a mouse; instead, she uses the keyboard to navigate the web.
Steps to take
- Using only your keyboard, navigate through the page using the
- Make sure you can reach all interactive elements and trigger them with the
enterkey, or arrow keys, and ensure that you have designed intentional styles for these states: focus, hover, active, and visited.
- Check to see that focus is always visible and that interactive items on the page appear in logical order. Make sure that no content gets focused offscreen or is hidden from view.
- Check to see that the page includes a skip navigation link (if navigation is present before the main content). This will allow users to skip past navigation to reach the page’s main content.
Video tutorial: How I do an accessibility check
WCAG 2.0 references
- 2.1 Keyboard Accessible (Guideline)
- 2.1.1 Keyboard
- 2.1.2 No Keyboard Trap
- 2.4.3 Focus Order| WCAG 2.0
- 2.4.7 Focus Visible