Forms and Validation
- No matter the design, basic semantic structure is absolutely necessary
- Client-side validation and styling can easily be tied to aria attributes
- Do not rely on placeholder text. Use visible labels or alternative offscreen text
- Error Messaging should not be an afterthought
Use the "for" attribute. (so, very simple)
Use aria-required and aria-invalid for validation (build accessibility into your process!)
<label for="firstName">First Name</label>
<input id="firstName" aria-required="true" aria-invalid="false" placeholder="Enter a First Name">