duplicate-id
Ensure that the id
attribute values are unique.
Description
To avoid assistive technology overlooking the second instance where the same id
value is used, ensure that the assigned value for the id
attribute is unique.
Why is it important?
Having duplicate id
values is a frequently encountered validation error that can lead to unexpected behavior in scripting and assistive technologies. This issue can compromise both the functionality and accessibility of a website or application. When multiple elements have the same id
, screen readers will only recognize the first element and skip the subsequent ones. As a result, users will miss out on the complete content.
Examples
-
Success:
- Screen Readers reliably treat two
<form>
elements with differentid
values as separate entities.
- Screen Readers reliably treat two
-
Failure:
- Screen readers producing unpredictable results when two
<form>
elements have the sameid
values.
- Screen readers producing unpredictable results when two
How to fix?
Ensure that the page is free from any duplicate “id” values and remove any duplicates if they are present.
Tags
cat.parsing, wcag2a, wcag411
References
- WCAG 4.1.1: Parsing
- WCAG 2.1 Technique H64
- Deque University: duplicate-id
- Accessibility Insights: duplicate-id
- Evinced Digital Accessibility Knowledge Base: duplicate-id
We're sorry to hear that. Please share your feedback so we can do better
Contact our Support team for immediate help while we work on improving our docs.
We're continuously improving our docs. We'd love to know what you liked
We're sorry to hear that. Please share your feedback so we can do better
Contact our Support team for immediate help while we work on improving our docs.
We're continuously improving our docs. We'd love to know what you liked
Thank you for your valuable feedback!