• Tweet this item
  • share this item on Linkedin
Helen Grimbly

Week 15 Technical Service Bulletin - H44 Using label elements to associate text labels with form controls

Tech Update


This week, Support Lead, Helen Grimbly is looking at adding labels to form fields, to make forms more accessible.

Form fields are used on a site to collect information about site visitors. Form fields should be labelled so that a screen reader can read back to the user what is required for each field, ensuring that users can understand, navigate and fill them in correctly.

So for example if we have a subscription form, two of the form fields may be:

<input type="text" name="name" id="fullname"> 
<input type="text" name="email" id="emailaddress">

Add labels to the above HTML, so that the screenreader can describe the form.

<label for="fullname">Name:</label> 
<input type="text" name="name" id="fullname"> 
<label for="emailaddress">Email:</label> 
<input type="text" name="email" id="emailaddress">

In Sitemorse, Accessibility actions called "Please add descriptive labels to form fields" will be raised if form labels need to be added.

Training

Automatic delivery - Just-in-time

Direct ‘just-in-time’ training materials are offered against actions, delivering immediate understanding and confidence in actioning. These videos provide help prevent the same issues being repeated.