Skip to content
SilktideHelp

Field labels

Silktide checks that every form field and button on your pages has a name that software can read. People who cannot see the form rely on these names to know what each field is asking for.

A sighted visitor works out what a field means from the text near it. That visual association carries no meaning in code: the name must be attached to the field itself, most often with a <label> element in the .

<!-- Problem: the text looks like a label but isn't attached to the field -->
<p>Full name</p>
<input type="text">

Why this matters

A announces each field by its as the visitor moves through a form. An unnamed field is announced as just "edit text" - the visitor has to guess what to type from context, and on a longer form that quickly becomes impossible. Unlabelled fields are one of the most common reasons a form cannot be completed without sight, which means lost sign-ups, orders, and enquiries.

How to fix it

  1. Attach a <label> to each field, either linked by ID or wrapped around it:
<!-- Linked by ID -->
<label for="name">Full name</label>
<input type="text" id="name">

<!-- Or wrapped around the field -->
<label>Full name <input type="text"></label>
  1. Buttons name themselves through their text or value - no label element is needed:
<button>Send message</button>
<input type="submit" value="Send message">
  1. Where a visible label is impractical, use an attribute such as aria-label or aria-labelledby. Note this only helps - sighted visitors won't see it.

Do not rely on placeholder text as a label: it disappears as soon as the visitor starts typing, and is not treated as a name consistently.

How Silktide tests this

  1. Find the form controls on each page: inputs, text areas, dropdowns, and buttons, plus elements given a form control role with ARIA (such as role="button" or role="checkbox").
  2. Skip controls that don't need a name: hidden inputs, fields injected by known third-party widgets (such as services, or the hidden forms that tracking and translation scripts add for their own use), and elements whose ARIA role does not require a label.
  3. Work out each control's accessible name from its label, ARIA attributes, button text, or value.
  4. Report each control whose accessible name is empty.

Troubleshooting

The field has text next to it

Nearby text does not name a field unless it is connected in code - use a <label> with a for attribute, or wrap the field in the label.

The field is decorative or managed by a plugin

Fields injected by widgets you don't control can be hard to fix directly. Check whether the plugin offers an accessibility setting or an update; if the field genuinely doesn't affect visitors, you can the finding.

Learn more

Last updated

Was this page helpful?

Field labels | Silktide Help