Read time: 50 seconds
Can you reach everything that’s interactive using the tab key?
Why it's important
- Maria has tendonitis and is unable to use a mouse; instead, uses the keyboard to navigate the web.
Steps to take
- Using only your keyboard, navigate through the page using the tab key.
- Make sure you can reach all interactive elements and trigger them with the spacebar, enter key, or arrow keys, and
- Make sure you design 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 off screen 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.
Web Content Accessibility Guidelines
- 2.1 Keyboard Accessible (Guideline)
- 2.1.1 Keyboard
- 2.1.2 No Keyboard Trap
- 2.4.3 Focus Order
- 2.4.7 Focus Visible