Keyboard navigation in websites and documents is an important part of universal design for the web. This article will outline how content creators can design websites and documents that people can navigate using keyboards or other input devices.
Keyboard Navigation in Websites and Documents
One principle of the Web Content Accessibility Guidelines (WCAG) requires that web content must be operable. In other words, people should be able to navigate websites using various input devices and methods. Furthermore, WCAG requires websites to be robust, to work with current and future assistive technologies.
Many people navigate websites and documents with a keyboard instead of a mouse. Alternatively, people may use other input devices or methods to navigate, such as a:
- Trackball
- Head pointing system
- Mouth stick
- Eye-tracking system
- Switch device
Websites designed to be accessible by keyboard navigation are also accessible to people using these and other input methods. For example, websites that are keyboard-accessible also work well with speech recognition. Therefore, web designers should ensure that people can navigate websites and documents with a keyboard.
For example, people use the tab key to move between elements of a page that they can interact with, such as:
- Links
- Buttons
- Dropdown menus
- Form fields, such as:
- Edit fields
- Radio buttons
- Check boxes
In addition, people reading websites or documents with screen readers can use keyboard shortcuts to move between different types of text on a page, such as:
Alternatively, people can also use keyboard commands to hear all the links or lists on a page.
While some people use keyboards with screen readers, other people look at their screens while they navigate with their keyboards. As a result, the area of a webpage that has keyboard focus should be visible. Moreover, this keyboard focus indicator should have good colour contrast.