*This article is an English translation of a Japanese article.
JIS X 8341-3:2016 is Japan’s web accessibility standard, designed to ensure that all users can easily access web content. “Keyboard Accessible” is a critical success criterion aimed at making websites easy to navigate for users who cannot use a mouse or find it difficult to do so. This article provides an in-depth explanation of “Keyboard Accessible” and practical ways to achieve it.
What is “Keyboard Accessible”?
“Keyboard Accessible” requires that all website functions can be operated using only a keyboard. For users who have difficulty using a mouse or touch screen, such as those with visual impairments or motor disabilities, being able to operate the site with a keyboard or keyboard-emulating devices (like switches or voice input tools) is crucial.
Key Success Criteria for “Keyboard Accessible”
There are three primary success criteria related to “Keyboard Accessible.” By meeting these criteria, you can ensure that users who rely solely on keyboard navigation can comfortably use your website.
1. Guaranteeing Keyboard Access (Success Criterion 2.1.1)
Overview of the Criterion
All website functions must be operable using the keyboard, without relying on mouse actions. For example, users should be able to click buttons, select links, and fill out forms using only the keyboard. If there are mouse-based elements, equivalent keyboard functions must also be provided.
Key Implementation Points
-
Tab Navigation
Ensure that users can naturally move between elements using the Tab key and that all necessary elements can be focused in the proper sequence. Key elements should be focusable, and the tab order should follow a logical and intuitive flow. -
Activate with Enter Key
Ensure that buttons or links can be activated with the Enter key when focused. Even if you use custom JavaScript to handle click events, ensure that keyboard users can trigger the same functionality. -
Visible Focus Indicator
Make sure that the focus location is visually apparent when using the keyboard. Retain or customize the default focus ring (dotted outline or highlight) to enhance its visibility for users.
2. Preventing Keyboard Traps (Success Criterion 2.1.2)
Overview of the Criterion
A “keyboard trap” occurs when a user becomes stuck in a specific area of a page while navigating with the keyboard. If users cannot move focus away from a particular element or form, it disrupts the flow of navigation. Preventing keyboard traps ensures seamless keyboard operation.
Key Implementation Points
-
Allow Escape with the Keyboard
When displaying modal windows or dialog boxes, ensure that users can navigate out of these areas using the keyboard. Use the Esc key or Tab key to let users move focus back to the main content. -
Proper Focus Management
After closing a form or dialog, make sure that focus returns to a logical location, such as the button that opened the dialog. This ensures continuity in the navigation flow.
3. Controlling Timing with the Keyboard (Success Criterion 2.1.4)
Overview of the Criterion
If a time-dependent action requires user input, the user must be able to control the timing using the keyboard. Users should have the ability to adjust time constraints for actions, reducing the stress of time-limited operations.
Key Implementation Points
-
Extend or Disable Time Limits
For forms with time limits, provide options for users to extend or disable the limit using the keyboard. For example, offer a button or link that allows users to extend the time, ensuring it is accessible via keyboard. -
Control Video and Sliders with the Keyboard
For auto-advancing content like sliders or videos, ensure users can pause, rewind, or adjust the speed using the keyboard. Allow users to control the content with keys like the Spacebar for play/pause and arrow keys for navigation.
The Importance of Meeting the “Keyboard Accessible” Standard
Meeting the “Keyboard Accessible” criterion ensures that websites are easy to use for keyboard-only users, improving overall usability for all. This benefits users with visual impairments, motor disabilities, and even those who cannot use a mouse temporarily. Supporting keyboard access also ensures compatibility with assistive technologies like screen readers and voice input devices, promoting fair access for everyone.
Conclusion
The “Keyboard Accessible” success criteria in JIS X 8341-3:2016 are essential for making websites fully operable via the keyboard. Ensuring that all functions are keyboard-accessible, preventing keyboard traps, and allowing users to control time-dependent content are critical elements. By following these guidelines, you can create web content that provides a comfortable experience for all users, regardless of disability, and build an accessible website that meets the highest standards of usability.
We have released the UUU Web Accessibility Widget Tool, designed to make web accessibility easy to implement. This tool helps improve the accessibility of websites quickly and efficiently, even without specialized knowledge.
If you’re interested in enhancing your website’s accessibility, please check out the details. We are here to support you in making your website more user-friendly and accessible to a wider audience.