How to fix label on Webflow

Steps for Webflow

1. Open your project in the Webflow Designer and click on the Form Block containing the unlabeled input.
2. Select the individual Form Field element (Input, Textarea, or Select); in the right-hand Settings panel, ensure the 'Label' toggle is ON and the label text is descriptive (e.g., 'Email address', not just 'Email').
3. Webflow automatically links the <label> to its input using for/id when the label is added via the Settings panel — do not delete the auto-generated id on the input.
4. If you need a visually hidden label (design-only), add a custom 'sr-only' CSS class to the label element with CSS: position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap;
5. For custom-embedded forms via HTML Embed components, manually add <label for="id"> markup inside the embed.
6. Publish and test with axe DevTools or VoiceOver/NVDA.

<label for="customer-email">Email address</label>
<input id="customer-email" type="email" name="email" autocomplete="email">

<!-- OR, when a visible label is not possible: -->
<input type="search" aria-label="Search products" name="q">

What is label?

Every form field on your website — such as a search box, email signup, checkout address field, or contact form — needs a label that clearly describes what information belongs there. A "label" is either a visible text description linked to the input, or a special code attribute (like `aria-label`) that screen readers can announce. When a form field has no label at all, assistive technology users hear something unhelpful like "edit text" with no context about what to type. WCAG Success Criterion 4.1.2 requires all interactive elements, including form inputs, to have a name that can be determined programmatically.

Unlabeled form fields directly block customers who use screen readers, voice-control software (like Dragon NaturallySpeaking), or keyboard-only navigation — they simply cannot use your checkout, contact, or signup forms. This is a recognized WCAG 2.1 Level A failure, meaning it is among the most serious accessibility violations and creates real legal exposure under the ADA (US), AODA (Canada), EAA (EU), and similar laws — several major retailers have faced lawsuits citing exactly this issue. Beyond legal risk, it also damages conversions: any customer who cannot complete a form cannot buy from you. Additionally, Google uses accessibility signals as part of its overall quality assessment, so fixing these issues supports your SEO health too.

See the complete Label guide for every platform and the full background.