Accessibility

Keyboard-only Accessibility

Last modified 11/6/2023

Keyboard accessibility is a vital aspect of web design and development that ensures users can navigate and interact with a website using only a keyboard, without relying on a mouse or other pointing devices. By making your web pages keyboard accessible, you create a more inclusive user experience for individuals with motor disabilities, as well as those who prefer keyboard navigation. 

Why is keyboard accessibility important?

  1. Inclusivity: Keyboard accessibility ensures that individuals with motor impairments or limitations can access and interact with your website. It promotes inclusivity by providing an alternative means of navigation for those who cannot use a mouse or other pointing devices effectively.

  2. Compliance: Keyboard accessibility is mandated by accessibility standards and legal requirements, such as the Web Content Accessibility Guidelines (WCAG). Adhering to these guidelines not only promotes accessibility but also helps organizations meet legal obligations and avoid potential legal issues.

  3. User Experience: Keyboard accessibility enhances the overall user experience for all visitors to your website. It allows users to navigate quickly, access interactive elements, and complete tasks efficiently without the need for precise mouse movements. Keyboard navigation is also helpful in situations where a mouse may not be available, such as when using a mobile device with a physical keyboard or for users with specific preferences.

Testing web page keyboard accessibility:

  1. Tab Navigation: Press the Tab key to navigate through interactive elements on your web page, such as links, buttons, and form fields. Ensure that the focus indicator (the box or highlight around the element) is visible and moves logically through the elements. Verify that all interactive elements can be accessed and activated using the keyboard alone. Typical key commands are: tab key, enter key, spacebar, up/down/right/left arrows).

  2. Skip Links: Check if your web page includes skip links, which allow users to bypass repetitive navigation menus and directly access the main content. Use the Tab key to confirm that skip links are functional and lead to the appropriate content section.

  3. Form Accessibility: Test form fields to ensure that users can navigate between them using the Tab key. Verify that proper focus indication is provided, and users can enter and submit data using the keyboard alone. Check for any error messages or validation notifications that are keyboard accessible.

  4. Keyboard Traps: Verify that there are no keyboard traps on your web page, where users get stuck in a particular section or cannot navigate away using the keyboard. Press the Tab key and ensure that the focus can move freely to all interactive elements without being trapped.

Need Help?

Illinois State's WEB team continually checks the website template and components for keyboard accessibility. If you add any 3rd party components to an Illinois State site or create a website for university purposes outside the Omni CMS then you will need to check for keyboard accessibility. If you need help reviewing your university-related website, submit a Help Request Ticket (be sure to add "accessibility" and the page(s) url to the description).