IDs of active elements must be unique

Rule ID: duplicate-id-active
Ruleset: axe-core 4.7
User Impact: Serious
Guidelines: Not specified, or not applicable

Accessibility testing for dev teams - No experience required

Find and fix up to 80% of accessibility issues with axe DevTools Pro. Get started with your free trial today. No credit card needed.

Compliance Data & Impact

User Impact

Serious
Minor
Critical

Disabilities Affected

  • Blind
  • Deafblind

Standard(s)

  • Not specified, or not applicable

How to Fix the Problem

Rename attributes that reuse an ID on active, focusable elements.

Duplicate active IDs are common validation errors that can break the accessibility of labels for focusable elements, forms, table header cells, etc.

To fix the problem, change the duplicate ID value to ensure each ID is unique. Unique ID values differentiate each focusable element from another and prevent invalid markup and the active ID instance is acted upon by client-side scripting, or where assistive technologies typically only reference the active ID of repeated elements.

Good markup eliminates at least one possible source of accessibility problems. WCAG 1.0 used to have a provision which explicitly required the use of valid markup. That requirement has been taken out of WCAG 2.0. We mention it here because valid markup is a quick path toward ensuring accessibility. Most validation issues are usually inconsequential for accessibility (e.g., un-encoded ampersands). Other ID validation errors are very important and may cause issues relating to how assistive technology interacts with the page and renders the page to the end user.

One way to test the validity of HTML markup in order to quickly identify reused attribute ID values is to submit the code through the W3C validator at http://validator.w3.org.

Why it Matters

The ID attribute uniquely identifies focusable elements on a page. It does not make sense to duplicate an active ID.

Duplicate active ID values break the accessibility of focusable elements including labels for forms, table header cells, etc., Screen readers and client-side scripts will skip any duplication other than the first instance. Validating HTML files help prevent and eliminate possible sources of accessibility problems, when not breaking accessibility.

Those experienced with client-side scripting know that when you re-use an active ID, typically the only one that gets acted upon by the scripting is the first instance of the use of that active ID. Similarly, assistive technologies may, when referencing an active ID, only reference the first one accurately.

Rule Description

The value assigned to active ID attributes on focusable elements must be unique to prevent the second instance from being overlooked by assistive technology. Put another way, active ID attributes may not be used more than once on focusable elements in the same document; focusable active elements require unique IDs for assistive technology to distinguish one element from another.

The Algorithm (in simple terms)

Ensures that each focusable element on the page with an active ID has a unique value.

Resources

Other Resources

You may also want to check out these other resources.

Refer to the complete list of axe 4.7 rules.

Was this information helpful?

You have already given your feedback, thank you..

Your response was as follows:

Was this information helpful?
Date/Time feedback was submitted: