Keyboard Accessibility

Websites should be keyboard accessible according to WCAG2.2. This article discusses some aspects of this requirement.

Should Keyboard Accessibility be implemented for mobile devices

  1. According to the Guideline 2.1 of WCAG 2.2 websites need to be keyboard accessible for mobile devices as well, since this ensures that users can use a wide variety of assistive technologies that create simulated keystrokes as their output (e.g. voice controls). 1
  2. Success Criterion 2.1.1 states that "Everything can be done with a keyboard except freehand movements.". The authors of the article further explain that most gestures that are done by pointing devices should also be made keyboard accessible like clicking, selecting, moving, sizing. 2
  3. Further they elaborate what can be interpreted as freehand movements which can be exempt from the requirement for keyboard accessibility: "However, there is a small class of input that is done with a pointing device that cannot be done from the keyboard in any known fashion without requiring an inordinate number of keystrokes. Free hand drawing, or watercolor painting require path dependent input. Drawing straight lines, regular geometric shapes, re-sizing windows and dragging objects to a location (when the path to that location is not relevant) do not require path dependent input." 2
  4. But this does not mean that every control needs to be accessible via keyboard interfaces, but that there must be at least an alternative to achieve the same or a comparable action. 2
  5. Note that the AAA level Success Criterion 2.1.3 requires that all pointer actions have a keyboard accessible equivalent. 3

Autofocus

  1. The autofocus global attribute is a Boolean attribute that specifies an element should automatically receive focus when the page loads or when the it belongs to is displayed.
  2. Generally, it's best practice not to use the autofocus attribute. Automatically focusing on the first form field can be problematic for users with screen readers or on mobile devices, as it can cause them to miss important context or feel like they're losing control of the web browsing experience.
  3. That said, it can in some limited cases be beneficial to use it. If you can answer these questions with "yes" your users might benefit from you using the autofocus attribute: 4
    1. Is there a single component that all users will focus on when the page loads?
    2. Does the component appear at the beginning of the page?
    3. Will implementing autofocus improve the user experience?
    4. Is the operation of the component unambiguous?
    5. Could autofocus cause the page to scroll automatically when viewed on smaller screens?

Sources 

  1. Keyboard Accessible by Accessibility Guidelines Working Group (AG WG) Participants (Co-Chairs: Alastair Campbell, Charles Adams, Rachael Bradley Montgomery. W3C Staff Contact: Kevin White). is licensed under W3C Document License
  2. Keyboard (Level A) by Accessibility Guidelines Working Group (AG WG) Participants (Co-Chairs: Alastair Campbell, Charles Adams, Rachael Bradley Montgomery. W3C Staff Contact: Kevin White). is licensed under W3C Document License
  3. Keyboard (No Exception) (Level AAA) by Accessibility Guidelines Working Group (AG WG) Participants (Co-Chairs: Alastair Campbell, Charles Adams, Rachael Bradley Montgomery. W3C Staff Contact: Kevin White). is licensed under W3C Document License
  4. Accessibility Tips: Be Cautious When Using Autofocus Copyright Bureau of Internet Accessibility, Inc
Created at: 09.10.2024, Last updated at: 08.11.2024