Tag: Keyboard accessible

Allow users to turn off or remap single-key character shortcuts. 

Introduction

Keyboard shortcuts can help some users, but cause difficulty for those using speech input and some users with motor impairments. They can also cause issues on mobile screens as the functional area is reduced on a mobile keyboard.

For speech input users, single-key shortcuts (for example, the letter key “F” for starting a search) are particularly bad as a spoken word can be interpreted as several individual keystrokes. 

The best course of action is to avoid using single-key shortcuts.

How to Pass ‘Character Key Shortcuts’

• Don’t use single-key shortcuts
  
• If you really want to:
  
  • give users a way to turn off the shortcut;
    
  • allow users to remap the shortcut to use non-character keys; or
    
  • ensure the shortcut only works when an element has focus.
    

Exceptions

• Shortcuts where one key is not a character (for example ‘alt’ or ‘alt’ + ‘c’)
  
• Elements where the shortcut is only active on focus (for example, lists and dropdown menus).
  

‘Character Key Shortcuts’ Tips

One last time, please just avoid setting up single-key shortcuts.

Characters include letters, numbers, punctuation and symbols – anything you could type into a word processor and print off.

See Also

• On Focus
• Understanding Success Criterion 2.1.4 (W3C)

‘No Keyboard Trap’ ensures users can navigate to and from all content using a keyboard.

Introduction

Users with visual or motor impairments may choose to access your website with only their keyboard. Users must be able to navigate to and away from all content and functionality on your website using a keyboard. 

How to Pass ‘No Keyboard Trap’

All elements on your website can be navigated to and away from by keyboard only using the ‘tab’ or arrow keys.

‘No Keyboard Trap’ Tips

To test for this guideline, unplug your mouse and make sure you can fully use your website with only your keyboard.

It’s tempting to use non-standard navigation with an explanation of what to do, but this isn’t worth your time. Stick to the ‘tab’ and arrow keys that most users are familiar with.

See Also

• 2.1.1 – Keyboard
• Understanding Success Criterion 2.1.2 (W3C)

All functionality is accessible by keyboard with no specific timings.

Introduction

Users with visual or motor impairment may navigate your website using only their keyboard or through assistive technology that relies on a keyboard-like interaction with your website.

How to Pass ‘Keyboard’

• Ensure users can access all elements of your website using only a keyboard
  
• Ensure there are no specific timings needed for keystrokes, for example holding down ‘Enter’ for three seconds to submit a form

Exceptions

Functions that require a mouse pointer for input, for example free drawing tools and some types of games. 

‘Keyboard’ Tips

To test for this guideline, unplug your mouse and make sure you can fully use your website with only your keyboard – you might be surprised by what you can’t do.

Make sure no function on your website requires timed keystrokes (for example, ‘double tap on enter within two seconds’).

Don’t use ‘access keys’ (assigning a navigation link to a particular key) or page-specific key commands as they can conflict with assistive technology.

At Level AAA, 2.1.3 – Keyboard (No Exception) removes the exception.

See also

• 2.1.2 – No Keyboard Trap
• 2.1.3 – Keyboard (No Exception)
• 2.4.3 – Focus Order
• 2.4.7 – Focus Visible
• Understanding Success Criterion 2.1.1 (W3C)