1.5 Fieldset not associated with a legend (Positive)

1.5.1 WCAG 1.3.1 (A), 3.3.2 (A) - Desktop, Automated Finding

On certain pages with conditional form fields, the ‘Frequency’ label is not associated with the corresponding radio inputs. The radio buttons have been grouped within a <fieldset>, however, this is missing a <legend>.

Screen readers and other assistive technologies rely on the <legend> to provide context and describe the purpose of the grouped form controls. Without a <legend>, users may have difficulty understanding the context of the controls within the <fieldset>. They might not know what the options ‘Every week’, ‘Every month’, etc. correspond to. While it might be self-explanatory to some users since the options directly follow the Amount value, it would still be beneficial to explicitly mention it to all screen reader users.

This issue was captured using an automated checker, WAVE. Automated accessibility tools are used to quickly identify frequently occurring issues that are generally easy to resolve. Fixing these will help increase the accessibility of the site.

FIGURE 1.5: Frequency label highlighted on Other Income page

FIGURE 1.6: Frequency label highlighted on Your Clients Outgoings and Deductions page

1.5.2 Code Snippet

<fieldset >
    <p> Frequency </p>
    <input> ...
</fieldset>

1.5.3 Recommendation

We recommend keeping the <fieldset> that is in place, but updating the current paragraph tag to a <legend>. This will help users understand why certain form fields have been grouped together and will help them work through the form more easily. For example:

<fieldset >
    <legend> Frequency </legend>
    <input> ...
</fieldset>

1.5.4 Spot check: April 2024

This issue has been resolved. Radio buttons are now programmatically associated using a <fieldset> and <legend>.

This has been changed from a ‘Low’ severity issue to a ‘Positive’ finding.

---