| Title | Missing Form Control Label and Title Check |
|---|---|
| id | input_01 |
| type | prop |
| elem | inputLabel |
| test | inputIdTitleNo |
| score | 3 |
| level | A |
| trust | 1 |
| ref | H65 |
| scs | 1.1.1,1.3.1,3.3.2,4.1.2 |
| dis | 53122 |
| result | failed |
The "Missing Label and Title Check" evaluates whether any form input elements are missing accessible labels.
I identified 1 form control without an associated <label> element and without the title attribute.
- Visual Impairments: Screen readers cannot announce the purpose of the form control, making it unusable.
- Motor Impairments: People using voice input software (e.g., Dragon) may not be able to interact with the field without a name.
- Cognitive Disabilities: Unlabeled controls increase cognitive load and can make forms unusable.
To address form control elements missing a <label> and a title:
- Locate the form control element.
- Add, if possible, a
<label>element and properly associate it with the<input>element using theforattribute. - If you don't want to have a visible label, use the
titleattribute in the<input>element, providing a meaningful title.
- WCAG 2.2: Understanding Success Criteria 1.1.1
- WCAG 2.2: Understanding Success Criteria 1.3.1
- WCAG 2.2: Understanding Success Criteria 3.3.2
- WCAG 2.2: Understanding Success Criteria 4.1.2
- WCAG 2.2 Techniques: Technique H65: Using the title attribute to identify form controls when the label element cannot be used
- WebAIM: Semantic Structure: Regions, Headings, and Lists
- WebAIM: Creating Accessible Forms