Read time: 50 seconds
Can you reach everything that’s interactive using the tab key?
- 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.
- Read our information about focus visible. It includes advice on best practice colour combinations.
- 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.
- Watch World Wide Web Consortium's (W3C) keyboard compatibility video (47 seconds):
Video link: https://www.youtube.com/watch?v=93UgG72os8M
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
Page last updated: 15 June 2020