<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=1639054036391679&amp;ev=PageView&amp;noscript=1">

WCAG 2.1.1 - Keyboard

All functionality of the content is operable through a keyboard interface without requiring specific timings for individual keystrokes, except where the underlying function requires input that depends on the path of the user's movement and not just the endpoints.

Wherever possible, content can be operated through a keyboard or keyboard interface (so an alternate keyboard can be used). When content can be operated through a keyboard or alternate keyboard, it is operable by people with no vision (who cannot use devices such as mice that require eye-hand coordination) as well as by people who must use alternate keyboards or input devices that act as keyboard emulators.

Offical Requirements:

2.1.1 Keyboard: All functionality of the content is operable through a keyboard interface without requiring specific timings for individual keystrokes, except where the underlying function requires input that depends on the path of the user's movement and not just the endpoints. (Level A)

Note 1: This exception relates to the underlying function, not the input technique. For example, if using handwriting to enter text, the input technique (handwriting) requires path-dependent input but the underlying function (text input) does not.

Note 2: This does not forbid and should not discourage providing mouse input or other input methods in addition to keyboard operation.

How to fix:

  • Enable keyboard navigation by adding tabindex attributes to elements on page
  • Use the label element to associate form label text with the form controls
  • In scripting, use semantic event handlers (onsubmit, onload, onunload, onchange,onfocus) or add keyboard event handlers (onkeypress, onkeyup,onkeydown, ) in addition to mouse based handlers (onmousedown).
  • Attach handlers to a keyboard accessible control; for example, a button, a submit, checkbox, radio button or image type input, or an <a> tag. The user agent will take care of firing an onclick event for you if activated via the keyboard.
  • Don't use scripting on HTML elements that don't have a default element to add an onclick handler, as these elements do not respond to keyboard input

Not sure where to start?

Start with a free analysis of your website's accessibility.

Get Started