WCAG 4.1.1: Parsing
Content must be implemented using well-formed HTML. While modern browsers are forgiving, malformed markup can cause accessibility issues. Duplicate IDs, unclosed elements, and improper nesting can break assistive technology.
What is WCAG 4.1.1 Parsing?
WCAG 4.1.1 Parsing is a Level A web accessibility success criterion under the Robust principle. Content must be implemented using well-formed HTML. While modern browsers are forgiving, malformed markup can cause accessibility issues. Duplicate IDs, unclosed elements, and improper nesting can break assistive technology. Common failures include duplicate id attributes causing label/aria associations to break and improperly nested elements that confuse the dom tree. Meeting this criterion is essential for accessible, inclusive web design.
How to Test
- ✓ Run the page through the W3C HTML Validator
- ✓ Check for duplicate ID attributes on the same page
- ✓ Verify all elements are properly opened and closed
- ✓ Check for improper nesting (e.g., <a> inside <a>, <div> inside <p>)
- ✓ Verify all attributes have valid values per the HTML spec
Common Failures
- ✗ Duplicate ID attributes causing label/aria associations to break
- ✗ Improperly nested elements that confuse the DOM tree
- ✗ Unclosed elements that cause following content to inherit wrong styles/roles
- ✗ Invalid attribute values (e.g., role='invalid-role')
- ✗ Missing required attributes on elements
✓ Good Example
<!-- Valid, unique IDs --> <label for="name">Name</label> <input id="name" type="text"> <label for="email">Email</label> <input id="email" type="email"> <!-- Properly nested --> <ul> <li><a href="/page">Link text</a></li> </ul>
All IDs are unique. Elements are properly nested. Labels are correctly associated with inputs.
✗ Bad Example
<!-- Duplicate IDs --> <label for="input1">Name</label> <input id="input1" type="text"> <label for="input1">Email</label> <!-- Points to wrong input! --> <input id="input1" type="email"> <!-- Duplicate ID! --> <!-- Improper nesting --> <p>Click <a href="/page"><div>here</div></a></p>
Both inputs share the same ID, so only the first label-input association works. A div element is nested inside an anchor inside a paragraph, which is invalid HTML.
Test Your Site for 4.1.1 Compliance
Use our free accessibility tools to check your website against WCAG 4.1.1.
Open Testing Tool