Leave No One Behind
Building Accessible Web Applications
Slide 2
Slide 2 text
Why?
• More Users
• The Law
• It’s the Right Thing to Do
Slide 3
Slide 3 text
Who?
• Users with cognitive impairments
• Users with hearing impairments
• Users with visual impairments
• Seizures
• Color Blindness
• Presbyopia
• Users with motor impairments
Slide 4
Slide 4 text
Let’s Look at Some Code
Slide 5
Slide 5 text
Leave No One Behind
• Users with Cognitive Impairments
• Check Reading Level for Content
• Don’t Build Complicated Interfaces
Slide 6
Slide 6 text
Leave No One Behind
• Users with Hearing Impairments
• Add visual cues to critical audio notifications
• Add close caption tracks to elements
Slide 7
Slide 7 text
Leave No One Behind
• Users with Visual Impairments
• Give Users a way to Disable Animations
• Don’t Rely Solely on Color
• Watch Contrast Ratio
• Responsive Design
• Use HTML5 Elements for Page Layout
• Correct Use of Buttons and Links
Slide 8
Slide 8 text
Leave No One Behind
• Users with Motor Impairments
• Support Focus Styling
• Manage Focus
• Dynamically set TabIndex attributes, or
• Capture keydown events
Slide 9
Slide 9 text
Some Key Resources
• Checklist
• http://webaim.org/standards/wcag/checklist
• Tools
• http://khan.github.io/tota11y/
• http://howlowck.github.io/Akbar/
• Learn More
• https://www.udacity.com/course/web-accessibility--ud891