Accessible forms: labels, errors, and useful inquiries
Design inquiry forms that explain their fields, help people recover from errors, and confirm receipt without collecting unnecessary information.
An accessible inquiry form needs understandable labels, clear requirements, recoverable errors, and a trustworthy confirmation. Reducing avoidable obstacles can help people complete the task, but accessibility work alone does not justify a promised conversion increase. Evaluate the form’s actual behavior before making claims about its results.
The right starting question is simple: what information does your team need to take the next useful action? Everything else has to earn its place.
Give each field a reason and a persistent label
Keep a field required only if its absence prevents the next action. A phone number may be essential for a callback request but unnecessary for a request answered by email. Explain unusual requirements where the person encounters them.
Use visible labels that remain after typing. Associate them with their controls; W3C’s form-label guidance explains the label and input relationship. Placeholder examples can supplement a label, but should not carry the entire instruction.
For a bilingual form, translate the helper text and error messages as well as the field names. Do not impose a US-only phone pattern on buyers in Costa Rica. Accept reasonable input variations and normalize them where the receiving system requires it.
Design the correction path before the success state
A red border alone does not explain what went wrong. Name the field, describe the problem, and tell the person how to fix it. Preserve valid entries when validation fails.
For longer forms, an error summary can link to affected fields. W3C’s notification tutorial describes this approach and the association of field errors through aria-describedby. Dynamic messages also need an appropriate announcement strategy, tested with assistive technology.
Distinguish invalid input from a delivery failure. “Check your email address” is wrong if the network failed after the address passed validation. That mistake makes people edit correct information and submit again without knowing whether anything was received.
Walk through a hypothetical inquiry
In this hypothetical form review, a Costa Rican maintenance supplier receives inquiries in English and Spanish.
The form asks for contact email, equipment type, and a description. A photo is optional. The visitor omits the equipment type and tries to send. The form keeps the description, displays a specific error, and lets the visitor reach the missing field by keyboard.
After correction, the server accepts the request and creates a reference. Only then does the interface confirm receipt. If delivery fails, it explains that failure and offers a retry without erasing the text. The confirmation promises a response window only if the operations team has approved one.
The example separates four things often collapsed into one button: validation, sending, acceptance, and human follow-up.
Use a small acceptance checklist
Test the complete journey, not just empty-field validation:
- Complete and correct the form using only a keyboard.
- Check that every input has an understandable accessible name.
- Submit an invalid value and verify a useful correction message.
- Simulate a failed request and confirm that entered text remains.
- Verify that success corresponds to server acceptance, not a button click.
- Repeat the checks in the other language and on a narrow screen.
Take your current form and annotate why each required field is necessary. Then review its failure states with 5e Labs UX/UI design before changing the visual styling or adding more qualification questions.
Have a project in mind?
Get in TouchMore Articles
Set Q4 digital priorities from the work people cannot finish
Build a short Q4 roadmap from blocked customer and staff tasks, with evidence, dependencies, acceptance checks, and explicit reasons to defer work.
Read
How to review a web agency portfolio before choosing a partner
Use an agency portfolio to examine relevant work, precise project scope, live user tasks, and evidence limits instead of judging only presentation.
Read
E-commerce product content: useful detail and accessible choices
Make product details and variant choices understandable with specific descriptions, meaningful images, named options, and visible availability states.
Read