Access keys need to be unique

• Rule: axe/accesskeys
• Checks: accesskey attribute value should be unique
• WCAG: none; a best practice, not a WCAG success criterion
• Fix class: mechanical: A fix needs no authored text or visual decision.

Who it affects

• People who use a keyboard or a switch device instead of a mouse.
• People who use a screen reader or a braille display, most of them blind.

How to fix it

Two or more elements share the same accesskey value

Give each element its own key, or remove the duplicate. axe ignores case, so s and S count as the same key. Browsers differ in what a shared key does, so it may not reach the element people expect.

<a href="/search" accesskey="s">Search</a>
<a href="/help" accesskey="h">Help</a>

The page relies on access keys at all

Consider removing them. The modifier keys differ by browser and operating system, the keys can clash with browser and screen reader shortcuts, and people cannot discover them unless the page lists them. If you keep them, list each key and its action on the page.

Fixes that fail

Picking new keys without checking for clashes

A key such as d or f collides with browser shortcuts in some browsers, so either the access key or the browser command stops working.

In React

The part of the fix that differs in React, in its syntax. The rest of the guidance holds.

A reusable component hard-codes accessKey, and the page renders it more than once

Take the key as a prop, and pass it only to the one instance that should own it. Every other instance renders without accessKey.

function SearchLink({ accessKey }) {
  return (
    <a href="/search" accessKey={accessKey}>
      Search
    </a>
  );
}

function Page() {
  return (
    <>
      <header>
        <SearchLink accessKey="s" />
      </header>
      <main>
        <h1>Help center</h1>
      </main>
      <footer>
        <SearchLink />
      </footer>
    </>
  );
}

More on the rule

axe-core’s documentation of the rule

CORA’s fix guidance adapts content from accessibility-agents, under the MIT License: see its notice.