Clear labels, useful error messages, and keyboard support help more people complete important web forms.
- web accessibility
- accessible forms
- WCAG
- form UX
Label every field clearly
Use persistent labels and explain the expected format before users make a mistake. Do not rely on placeholder text alone, because it disappears during entry and may have insufficient contrast.
Web & E-commerceWeb & E-commerce
Thoughtful decisions compound over time.
Practical product work brings technical choices back to the people and workflows they are meant to serve.
Connect errors to the right field
Describe the problem in text, preserve valid entries, and move focus to a helpful summary when submission fails. Colour can support an error state but should not be its only signal.
Test without a mouse
Complete the form using keyboard navigation and a screen reader where possible. A focused accessibility check can uncover barriers that visual review alone misses.
Practical application
Test a contact form using only a keyboard: reach every control, identify its label, submit empty values, and locate each error without relying on colour. Repeat with a screen reader to verify that the error summary and field instructions are announced.
