R I S K M O N I T O R

Loading

Intelligent Cybersecurity Check for vulnerabilities now

Ensuring Unique Accesskey Attributes for Better Accessibility

Rule ID: accesskeys
Ruleset: axe-core 4.10
User Impact: Serious
Guidelines: Deque Best Practice


How to Fix the Problem

To resolve this issue, ensure that every element using the accesskey attribute in your HTML document has a unique value. Access keys provide keyboard shortcuts to certain elements on a page, which can greatly aid users with limited mobility or those who prefer keyboard navigation. However, if multiple elements share the same accesskey, it creates conflicts and results in unpredictable behavior.

Steps to Fix:

  1. Search for All Accesskey Attributes:
    Review your HTML and locate all instances of accesskey="...".

  2. Check for Duplicate Values:
    Identify any duplicate accesskey values and revise them to be unique across the page.

  3. Modify Conflicting Keys:
    If two elements have the same access key, change one of them to something distinct.
    ✅ Corrected Example:

    html
    <a href="google.com" accesskey="g">Link to Google</a>
    <a href="github.com" accesskey="h">Link to GitHub</a>
  4. Consider Avoiding Accesskeys Entirely:
    Even though they are valid, accesskey attributes are often discouraged because:

    • They are inconsistently supported across browsers.

    • Users may not know they exist.

    • They can conflict with built-in browser or assistive technology shortcuts.

    • They may not localize well for multilingual content.

  5. If You Do Use Them:

    • Choose key values that don’t conflict with major browser shortcuts.

    • Clearly communicate access keys to users, e.g., via tooltips or help text.

    • Validate and test access key behavior across platforms and assistive technologies.


Why it Matters

Duplicate accesskey attributes can confuse or frustrate keyboard users. These users may include:

  • Individuals with motor disabilities who rely on keyboards instead of mice.

  • Users who use assistive technologies that simulate keyboard navigation.

  • Screen reader users who depend on predictable keyboard shortcuts.

If two elements share the same access key, pressing that key may:

  • Trigger only one element (with no control over which one).

  • Do nothing.

  • Trigger the wrong action entirely.

This violates the principle of operability in accessible web design and can significantly hinder a user’s ability to navigate your site efficiently.


Rule Description

Every accesskey value must be unique throughout the document. Repeating access key values undermines their intended benefit and introduces unpredictable results for keyboard users. This rule is part of best practices in accessibility, though not explicitly required by WCAG success criteria.


The Algorithm (in Simple Terms)

  1. Look through all HTML elements on the page.

  2. For every element with an accesskey attribute, check its value.

  3. Make sure no other element uses the same accesskey value.

  4. If any duplicates are found, flag them as issues.

Leave A Comment