Tab accessibility primarily focuses on making all functionality available from a keyboard. Many people access the web through only their keyboard, specifically with the tab button. This guideline goes over how to create a page with this in mind, as well as gives insights on how, when, and why you would want to include tab as a functionality.

Who is impacted?

Users with motor disabilities or vision impairment are primarily impacted. Others would include those who don’t use a mouse or trackpad.

How to test?

Tab/key through a page of your website. The order of elements should follow the DOM (Document Object Model) order, moving from left to right and top to bottom of the page.

Tab Order


Tab order is important for navigating across a webpage. The keyboard order should be coordinated with the order on the webpage moving from left to right, top to bottom. It should start with the header and move into the navigation and then proceed into the rest of the content on the page and concluding with the footer.



Keyboard Functionality


All functionality of content on your webpage should be operable through a keyboard interface. Any functionality should not require specific timing for individual keystrokes (except for when functions require input dependent on the path of the user’s movement).

Specific timing for individual keystrokes would include situations where users need to repeat multiple keystrokes within a short period, or when a key must be held down for an extended period to register a keystroke.



No Keyboard Trap


The keyboard trap is where a user’s “focus” gets stuck at a specific portion of the webpage, and they struggle to exit out of that focus.

If the focus on a keyboard can be moved somewhere on the page, then using the same keyboard interfaces, the user should be able to move away from that component. If moving from the focus requires more than arrow keys or tab keys, then the user is told the method for moving away.



Character Key Shortcuts


Character key shortcuts are important to make note of, as you don’t want users to accidentally activate any of the keyboard shortcuts.

The user should be presented with 2 key options:

  1. The user should be able to turn off any shortcuts
  2. The user should be able to reconfigure any keyboard shortcuts to use one or more non-printable characters



Keyboard Testing


There are many ways an author can test their keyboard accessibility. You can find the most common keyboard interactions and additional information here.

© 2023 - All For Web For All