Forms
Options are not grouped with their question
WCAG 2.2 success criterion 1.3.1 Info and Relationships (Level A)
- WCAG 2.2
- 1.3.1 Info and Relationships
- Level
- A
- Default severity
- Needs review
- Available in
- Free
Why it matters
Options like "Yes" and "No" only make sense next to their question. Sighted visitors see the question above the choices, but a screen reader moving into the group hears "Yes, radio button, 1 of 2" with no idea what is being asked — unless the options are grouped and the group is named after the question.
Who it affects: Screen reader users, voice-control users who say a field's label to move to it, and people with memory or attention difficulties who lose a placeholder once they type.
What Lumtera flags
Two or more visible radio buttons (or two or more checkboxes) that share a name in the same form and are not inside a <fieldset> with a non-empty <legend>. A fieldset named with aria-label or aria-labelledby, or a wrapper with role="radiogroup" or role="group" and a name, also counts as grouped. Each unnamed group is reported once, on its first option.
Check ID form-group-no-fieldset — use it to filter the content report or with wp lumtera issues --rule.
How to fix it in WordPress
Wrap the options in a <fieldset> and put the question in a <legend> as its first child, e.g. <legend>Preferred contact method</legend>. In form plugins, look for a setting that shows the field label as a group label or legend; most do this for radio and checkbox fields. Alternatively, give the wrapper role="radiogroup" (or role="group") and an aria-labelledby pointing at the question.
Example
<p>Preferred contact method</p>
<label><input type="radio" name="contact" value="email"> Email</label>
<label><input type="radio" name="contact" value="phone"> Phone</label>
<fieldset>
<legend>Preferred contact method</legend>
<label><input type="radio" name="contact" value="email"> Email</label>
<label><input type="radio" name="contact" value="phone"> Phone</label>
</fieldset>
How to check your fix
- Update the post. The issue disappears from the Accessibility sidebar on the next check, and from the site report on the next scan.
- Click each field's label: the cursor should move into the field. With a screen reader, each field should announce its label when it receives focus.
Find this issue across your whole site
Lumtera runs this check in the block editor sidebar as you write, in the Elementor panel, in Review mode on the live page, and across the whole site in the content report and with wp lumtera scan. You can change its severity or turn it off in Accessibility → Settings.
Related checks
-
WCAG 1.3.1 · AError
Heading is empty
-
WCAG 1.3.1 · ANeeds review
Heading level is skipped
-
WCAG 1.3.1 · ATip
Content uses an H1 heading
-
WCAG 1.3.1 · ATip
Bold text may be a heading
-
WCAG 1.3.1 · ATip
Heading is very long
-
WCAG 4.1.2 · AError
Form field has no label
Start with the free plugin today
All 64 checks, the editor sidebar, Elementor panel and site report — free, with no account and no page limits.