incorrect-group

Description

Fields that are programmatically grouped must actually constitute a logical group. This ensures that assistive technologies can accurately convey the relationships between fields to users. Proper grouping is essential for users who rely on screen readers or other assistive tools to understand the structure and context of form fields.

The incorrect-group rule aligns with WCAG Success Criterion 1.3.1 (Info and Relationships), which requires that information, structure, and relationships conveyed through presentation must be programmatically determinable.

Examples

In the following example, fields are programmatically grouped using the <fieldset> and <legend> elements, but the fields do not logically belong together. This violates the incorrect-group rule because the grouping does not reflect a meaningful relationship between the fields.

In the following corrected example, the fields are logically grouped. The “Car Model” and “Car Color” field is moved to a separate group, ensuring that each group contains related fields:

How to fix?

To fix violations of the incorrect-group rule, follow these steps:

1. Identify all programmatically grouped fields on your webpage.
2. Ensure that each group contains fields that are logically related.
3. Use appropriate elements like <fieldset> and <legend> to define and label groups.
4. If fields do not logically belong together, separate them into distinct groups.

Reference

WCAG Success Criterion 1.3.1: Info and Relationships