• Success Criterion 2.1.4
  • Conformance level A

Shortcut Toggle Setting That Resets on Every Page Load

2.1.4 — Character Key Shortcuts

Scenario

Setting

A project-management tool's task board

What’s wrong

Toggle exists but doesn't persist (resets every load) or is itself unreachable by keyboard/speech.

Example

shortcutsToggle.addEventListener('change', (e) => {
  shortcutsEnabled = e.target.checked; // held only in a JS variable, never saved
});
// a full page reload always resets shortcutsEnabled back to true

Why it matters

A user who turns shortcuts off to stop accidental archiving of tasks finds them silently back on after the next page load or tab switch.

How to test

Change a shortcut or disable it, then reload the page: if the setting resets to default instead of persisting, it fails.

How to fix

Persist the shortcuts preference to storage or the user's account, and make sure the toggle itself is a real, keyboard-operable checkbox.

shortcutsToggle.addEventListener('change', (e) => {
  shortcutsEnabled = e.target.checked;
  localStorage.setItem('shortcutsEnabled', e.target.checked);
});
// on load: shortcutsEnabled = localStorage.getItem('shortcutsEnabled') !== 'false';

Outcome

A user turns shortcuts off once, and they stay off across every future visit.

Who is affected

Speech-input users who rely on the toggle staying off can never trust it to hold, since it resets without warning.

Learn more