Accessibility Checklist: Forms

Bobby Bailey

Bobby Bailey

How to Make Forms Accessible for Everyone

Forms are a critical part of websites, but if not designed correctly, they can create barriers for people using assistive technology. Proper labeling, error handling, and keyboard navigation are key. Use this checklist to ensure your forms are accessible.

10-Point Accessible Forms Checklist

Number one: Every form field has a visible label
Labels describe the purpose of the input field. Use the <label> element instead of placeholder text alone.

Number two: Labels are correctly associated with inputs
Use the for attribute in <label> to match the input’s id. Screen readers should announce the label when focusing on the field.

Number three: Placeholders do not replace labels
Placeholders disappear when typing, making them unreliable as labels. Labels should always be present to guide input.

Number four: Error messages are clear and accessible
Errors should be descriptive and placed near the affected field. Use aria-describedby to associate error messages with inputs.

Number five: Required fields are clearly indicated
Use the required attribute or include "Required" in the label. Avoid using only color to mark required fields.

Number six: Forms are fully navigable by keyboard
The Tab key moves through fields in a logical order. The Enter key submits the form where expected.

Number seven: Radio buttons and checkboxes have clear group labels
Use <fieldset> and <legend> to group related choices. Ensure all options are fully keyboard and screen reader accessible.

Number eight: Error prevention and validation are user-friendly
Provide real-time validation without disrupting form completion. Allow people to review and confirm before submitting.

Number nine: Buttons are correctly labeled
Buttons should have clear, action-based text like "Submit" or "Sign Up." Avoid vague text like "Click Here" or "Go."

Number ten: Test with assistive technologies
Use screen readers like NVDA, JAWS, or VoiceOver to navigate the form. Ensure all error messages and labels are announced correctly.