• Success Criterion 2.1.4
  • Conformance level A

Shortcut Off-Switch Hidden Behind the Very Barrier It Fixes

2.1.4 — Character Key Shortcuts

Scenario

Setting

A food delivery app's restaurant menu

What’s wrong

"Turn off" setting hidden behind the very interaction pattern users can't perform.

Example 

document.addEventListener('keydown', (e) => {
  if (e.key === 'c') addFocusedItemToCart();
  if (e.key === 'g') pendingGoTo = true;
  if (pendingGoTo && e.key === 's') openSettingsPanel(); // the ONLY way into settings
});
<!-- there is no visible, clickable link to the settings panel anywhere on the page -->

Why it matters

A diner who wants to disable the 'c' shortcut because it keeps adding random items to their cart can only reach settings through another shortcut, "g" then "s."

How to test

Try to reach the 'turn off shortcuts' setting using only the method a shortcut-disabled user would have: if reaching the setting itself requires the very interaction the shortcuts block, it fails.

How to fix

The mechanism to turn off or remap shortcuts must be reachable through an ordinary link or button, never only through another character-key shortcut.

<a href="/settings/shortcuts" class="settings-link">Keyboard shortcuts</a>
<!-- always provide a visible, mouse- and keyboard-operable link into shortcut settings -->

Outcome

A diner clicks the visible settings link and turns off the shortcut without needing to trigger it first.

Who is affected

Speech-input users triggering accidental shortcuts have no escape route, since the fix is locked behind the same input method causing the problem.

Learn more

Related scenarios