Accessible Forms
summary
Shows that wrapping fields in a real <form> restores Enter-to-submit and that required vs aria-required behave differently (required blocks submission; aria-required only exposes semantics). Demonstrates VoiceOver rotor and landmarks, recommends aria-labelledby/aria-label to disambiguate multiple search forms, and aria-describedby for instructions instead of placeholders. Covers WCAG 2.1 contrast ratios (AA 4.5:1 normal, 3:1 large), keyboard expectations for checkboxes/radios/selects, image inputs as buttons, autocomplete tokens like given-name, and warns against split phone fields and automatic focus.
AI-written summary · about
chapters (13)
- 0:00Intro
- 0:36What is Web Accessibility?
- 1:09Types of Disabilities
- 2:31Form Structure
- 4:49Content Structure
- 10:16Color Contrast
- 11:03Contrast Checker
- 11:36Labeling content with ARIA attributes
- 16:17Instructions
- 19:02HTML Input Types
- 23:40Mobile Input Types
- 24:41Autocomplete
- 28:02Resources
related talks
31mAccessible Forms: It's Not as Difficult as You Think
52mConsidering Accessible HTML Forms, JavaScript & WAI-ARIA
50mStructuring Accessible Forms
33mAccessibility Done Right
47mBuilding Accessible Web Components
18mInput Accessibility Deep Dive
01h 07mInclusive Design Series: How to stop worrying and love accessible forms
38mHow To Make Your Website More Accessible with WAI-ARIA