Features

Ensure every accesskey attribute value is unique

Rule ID: accesskeys User Impact: serious Guidelines: Best Practices

The accesskey attribute allows users to activate or focus on specific elements using keyboard shortcuts. To prevent unexpected behavior and enhance accessibility, each accesskey value within a document must be unique.

About This Rule

This guideline ensures that each accesskey attribute value is unique, preventing conflicts and enhancing accessibility for keyboard users. Adhering to this practice aligns with the following standards:

Why It Matters

Assigning duplicate accesskey values can cause conflicts, leading to unpredictable results when users attempt to use these shortcuts. This can hinder navigation and accessibility, particularly for users who rely on keyboard interactions, such as individuals with mobility impairments or those using assistive technologies.

How to Fix

To ensure unique accesskey values:

  • Assign Unique Values: Ensure that each accesskey attribute within the document has a distinct value.
    Copy code
    <a href="https://www.google.com" accesskey="g">Google</a>
    <a href="https://www.github.com" accesskey="h">GitHub</a>
  • Avoid Conflicts with Browser Shortcuts: Be cautious not to assign accesskey values that conflict with existing browser or assistive technology shortcuts.
  • Consider User Awareness: Since accesskey assignments are not always apparent to users, provide documentation or visible cues to inform them of available shortcuts.
  • Evaluate Necessity: Assess whether implementing accesskey attributes is beneficial for your audience, as they are not universally supported and may introduce complexity.

Examples

Incorrect

Multiple elements with the same accesskey value:

Copy code
<a href="https://www.google.com" accesskey="g">Google</a>
<a href="https://www.github.com" accesskey="g">GitHub</a>

Correct

Elements with unique accesskey values:

Copy code
<a href="https://www.google.com" accesskey="g">Google</a>
<a href="https://www.github.com" accesskey="h">GitHub</a>

Other Rules

Interested in other web accessibility rules? Please see these other rules: