Character key shortcuts are customizable or removable

Applicable Role(s): Developer

Overview

Keyboard shortcuts can help make navigating or doing things on a page easier. If the shortcut uses only characters for typing though (letters, punctuation, symbols, etc.), this could lead to accidentally triggering actions the user doesn't intend to.

This can be especially frustrating for keyboard users, people using alternative pointing devices like head pointers, or people using speech input (i.e. saying a string of letters).

Best Practices

Keyboard shortcuts should use a combination of keys

Using 2-3 keys for a keyboard shortcut (example: Ctrl + E) makes it less likely to activate a custom action, and reserves the keys for their default behavior.

If printable characters must be used

If a single character key like letters, punctuation, or symbols is used a keyboard shortcut, one of the following must be true:

  • The shortcut can be turned off/on
  • The shortcut can be remapped to a different key or combination
  • The shortcut is active only when the user is focused on the element it's for (a link, button, input, etc.).

Pattern Examples

Accessible Example: Jira

Under their site help, there is a keyboard shortcuts info section, with the ability to turn shortcuts off.

A dialog shows keyboard shortcuts are turned on, and which ones are available to the user.

Accessible Example: Outlook (web-based)

Outlook has the option to turn off shortcuts, but also lets users remap shortcuts based on the provider they prefer. For example, if a user prefers Gmail keyboard shortcuts, they can carry that option over to their Outlook account.

Five radio buttons with different email provider options that apply their keyboard shortcuts