Leave No One Behind

Building Accessible Web Applications

Transcript

1. Leave No One Behind
   Building Accessible Web Applications
   

   View Slide

2. Why?
   • More Users
   • The Law
   • It’s the Right Thing to Do
   

   View Slide

3. Who?
   • Users with cognitive impairments
   • Users with hearing impairments
   • Users with visual impairments
   • Seizures
   • Color Blindness
   • Presbyopia
   • Users with motor impairments
   

   View Slide

4. Let’s Look at Some Code
   

   View Slide

5. Leave No One Behind
   • Users with Cognitive Impairments
   • Check Reading Level for Content
   • Don’t Build Complicated Interfaces
   

   View Slide

6. Leave No One Behind
   • Users with Hearing Impairments
   • Add visual cues to critical audio notifications
   • Add close caption tracks to elements
   

   View Slide

7. 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
   

   View Slide

8. Leave No One Behind
   • Users with Motor Impairments
   • Support Focus Styling
   • Manage Focus
   • Dynamically set TabIndex attributes, or
   • Capture keydown events
   

   View Slide

9. 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
   

   View Slide