Accessible web forms, labels, errors, and checkout fields that work

A beautiful form that only a mouse user with perfect vision can complete is a broken sales channel. Contact, booking, and payment forms must be operable with a keyboard, understandable with a screen reader, and recoverable when something is wrong.

Labels that assistive tech can bind

Use a <label> (or equivalent programmatically associated name) for each control. Do not rely on placeholder alone. Group related radios and checkboxes with a fieldset and legend when needed.

Errors that people can fix

• Say which field failed and how to fix it
• Keep the submitted values when possible
• Do not clear the whole form after one mistake
• Avoid color-only error cues

Checkout-specific risks

Autofill broken by odd autocomplete values, required fields marked only with a red asterisk in an image, and payment iframes that steal focus without instructions.

A practical acceptance checklist

1. Complete the form with keyboard only
2. Turn on a screen reader and hear each label
3. Submit empty and read every error
4. Zoom to 200% and confirm fields still stack cleanly