Inappropriate Structural Grouping Check

Description

The “Inappropriate Structural Grouping Check” evaluates whether there is any misuse of multiple <br> elements in a row, tipically used to create visual spacing or simulate structured content (like lists) rather than using proper semantic HTML elements.

Example outcome

I found 1 sequence composed by 3 or more <br> elements - I suspect they are being used to represent list items.

Impact

• Visual Impairments: Screen readers interpret <br> as a pause or line break, not as a list item or section divider. As a result, list-like content rendered with <br> is read as a single, uninterrupted block of text, making it confusing and difficult to parse.
• Motor Impairments: Navigating semantically correct HTML (e.g., jumping between list items) is much easier than navigating through dozens of <br> tags, which offer no structural context.
• Cognitive Disabilities: Visual layout tricks using <br> create inconsistency between visual structure and logical meaning. Users with cognitive disabilities benefit from clear, predictable semantic grouping (like real <ul>, <ol>, or <dl> elements).

Fixes

To address inappropriate structural grouping:

1. Locate the incorrectly used <br> elements.
2. Replace them with the correct semantic tags, depending on the intended meaning (e.g., <ul>).

Resources

• WCAG 2.2: Understanding Success Criteria 1.3.1
• WCAG 2.2 Techniques: Technique H48: Using ol, ul and dl for lists or groups of links
• WebAIM: Semantic Structure: Regions, Headings, and Lists