A11y It is not a bug, definitely a feature
A presentation at Mozilla TechSpeaker Meetup in September 2019 in Amsterdam, Netherlands by Ioana Chiorean
A11y It is not a bug, definitely a feature
Who is L̶o̶a̶n̶a̶ Ioana Chiorean? I am a PM (former QA TL) & CL Mozillian for more than 9 years now I volunteer - Mozilla & EU Code Week. I worked on devices for more than 10y. Twitter @ioana_cis # lifeofamozillian 2
“All people over the course of their lives traffic between times of relative independence and dependence” Sarah Hendren
1 billion some form of disability
“It’s possible to fly without motors, but not without knowledge and skill.” Wilbur Wright
What? ➔ Vision Disability - Complete Blindness or Color Blindness or Poor Vision ; Visual problems like visual strobe and flashing effect problems 7
What? ➔ ➔ Vision Disability - Complete Blindness or Color Blindness or Poor Vision ; Visual problems like visual strobe and flashing effect problems Physical Disability - Not able to use the mouse or keyboard with one hand; Poor motor skills like hand movements and muscle slowness 8
What? ➔ ➔ ➔ Vision Disability - Complete Blindness or Color Blindness or Poor Vision ; Visual problems like visual strobe and flashing effect problems Physical Disability - Not able to use the mouse or keyboard with one hand; Poor motor skills like hand movements and muscle slowness Cognitive disability - Learning Difficulties or Poor Memory or not able to understand more complex scenarios 9
What? ➔ ➔ ➔ ➔ Vision Disability - Complete Blindness or Color Blindness or Poor Vision ; Visual problems like visual strobe and flashing effect problems Physical Disability - Not able to use the mouse or keyboard with one hand; Poor motor skills like hand movements and muscle slowness Cognitive disability - Learning Difficulties or Poor Memory or not able to understand more complex scenarios Literacy Disability - Reading Problems 10
What? ➔ ➔ ➔ ➔ ➔ Vision Disability - Complete Blindness or Color Blindness or Poor Vision ; Visual problems like visual strobe and flashing effect problems Physical Disability - Not able to use the mouse or keyboard with one hand; Poor motor skills like hand movements and muscle slowness Cognitive disability - Learning Difficulties or Poor Memory or not able to understand more complex scenarios Literacy Disability - Reading Problems Hearing Disability - Auditory problems like deafness and hearing impairments; Cannot able to hear or not able to hear clearly 11
The web is for all people
Why.. ➔ People ❤ 14
Why.. ➔ People ❤ ➔ Regulations 15
Why.. ➔ People ❤ ➔ Regulations ➔ Users - data sets ◆ You do have them, trust me ◆ New ones 16
Why.. ➔ People ❤ ➔ Regulations ➔ Users - data sets ◆ You do have them, trust me ◆ New ones ➔ No ROI / No money, honey 17
Why.. ➔ People ❤ ➔ Regulations ➔ Users - data sets ◆ You do have them, trust me ◆ New ones ➔ No ROI / No money, honey ➔ Doing favors vs doing your job 18
Accessibility audits
How ➔ ➔ ➔ ➔ ➔ ➔ ➔ DevTools Audits Color Contrast Patterns & Colors Typography Animations Semantic - elements in order/a11y tree/ Page structure/ Menu nav & list Alt input - links, images, etc 20
Tools ➔ ➔ ➔ ➔ ➔ ➔ ➔ Close your eyes and try to navigate DevTools ◆ Color Checks /Typograpgy JAWS, Orca, Voice Over. Lighthouse Wave Tota11y My ex: ◆ 3 different OS + mobile => 4 ◆ 2 browsers + mobile => 3 ◆ Different Machines / Monitors 24
Don’t be the sheep! Be the wolf fox! Photo credit.
🐦 @ioana_cis ● ioana@mozilla.ro ● http://bit.ly/A11yMTSAms “The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.” Tim Berners-Lee, W3C Director and inventor of the World Wide Web
