Fieldset missing on checkbox or radio buttons
| Field | Value |
|---|---|
| Rule code | Manual_FieldsetButtons_Missing |
| WCAG conformance level | A |
| WCAG success criterion | 1.3.1 Info and Relationships |
| Must be fixed at source | No |
Description
A group of checkboxes or radio buttons is missing a fieldset HTML element, which is used to group related form controls. Without the fieldset element and an associated legend, it can be unclear to users how the options are related.
How to fix
To fix this issue, wrap the related checkboxes or radio buttons inside a <fieldset> and provide a descriptive <legend> to explain the purpose of the group. For example: <fieldset><legend>Choose your favorite fruit</legend><input type="checkbox" id="apple" name="fruit" value="apple"><label for="apple">Apple</label><input type="checkbox" id="banana" name="fruit" value="banana"><label for="banana">Banana</label></fieldset>. This groups the options and provides context for assistive technologies, improving accessibility.