Finding 1: Appointment form fields have no labels
- Where
- Book an appointment: First name, Phone and Preferred date fields
- Who it affects
- Screen reader users hear “edit text” with no name, so they can't tell which field is which. Voice control users can't say the field's name to select it.
- Evidence
- The fields use placeholder text only. There is no label element and no accessible name. The placeholder disappears as soon as someone starts typing.
- WCAG criteria
- 1.3.1 Info and Relationships (Level A)
- 3.3.2 Labels or Instructions (Level A)
- 4.1.2 Name, Role, Value (Level A)
- Recommendation
- Add a visible label for each field and connect it with the for attribute. Keep placeholders, if any, as examples only.
- Retest status
- Fixed and verified with NVDA and VoiceOver on 6 March 2026
<input type="text" name="first_name" placeholder="First name"><label for="first-name">First name</label>
<input type="text" id="first-name" name="first_name" autocomplete="given-name">