Last updated: 16 February 2024
Creating accessible forms is the science of constructing form fields that provide the correct name, role, and state through the data entry experience. In this talk we examine how to:
- Create and label form fields of different types
- Group related form fields, like radio buttons
- Mark form fields as required
- Handle input errors
- Verify data integrity
Through code examples and testing with a screen reader, you’ll learn how to create form fields that work for all your users.
Resources
- Presentation slides – PowerPoint (922 kb)
- Presentation slides – PDF (957 kb)
- Blog article: Structuring accessible forms
- Demo: Register Your Cat form
- HTML5 input types
- HTML autocomplete attribute
- RegEx Generator
- Video: axe-con 2023 recording (15 March 2023)
- Video: Webinar recording (14 December 2021)
- Video: Live coding demo (28 September 2021)
Code
See the Pen Accessible Forms by Rachele (@racheleditullio) on CodePen.