name-missing-multipart

Description

Parts of a multipart field must have their own accessible names to ensure that assistive technologies can accurately convey the purpose and structure of the field to users. This rule ensures that each part of a multipart field, such as a date field or phone number, is individually labeled and accessible.

The name-missing-multipart rule aligns with WCAG Success Criterion 4.1.2 (Name, Role, Value), which requires that all user interface components have names that can be programmatically determined.

Examples

In the following example, a multipart field for entering a date is not properly labeled. Each part of the field (day, month, year) lacks a descriptive accessible name (e.g. using DD instead of ‘Day’, which is not descriptive enough), making it difficult for users of assistive technologies to understand the purpose of each input.

In the following corrected example, each part of the date field is given a descriptive accessible name. This ensures that users of assistive technologies can clearly understand the purpose of each input.

How to fix?

To fix violations of the name-missing-multipart rule, follow these steps:

1. Identify all multipart fields on your webpage, without labels.
2. If individual labels cannot be provided to the fields, ensure that each part of the field has its own accessible name, using hidden <label> elements, aria-label attributes or aria-labelledby attributes.
3. If visible labels can be provided to the fields, use appropriate visible elements like <label> to provide accessible names for each part.
4. Test the accessibility of the multipart fields using assistive technologies to ensure compliance.

Reference

• Technique F86: Failure of Success Criterion 4.1.2 due to not providing names for each part of a multi-part form field
• WCAG Success Criterion 4.1.2: Name, Role, Value