Web Accessibility
Agenda
- Types of Disabilities
- Standards & Guidelines
- Testing Tools & Techniques
Types of Disabilities
- Visual Impairment
- Motor/mobility disorders
- Hearing impairments, deafness
- Cognitive / Intellectual disabilities
Visual Impairment
- Color blindness - affects 4.5% entire global population
- Low Vision - 246M people, 4% of global population
- Blindness - 39M people
Cognitive / Intellectual disabilities
- Dyslexia
- Memory disorders
- Motion sickness
Standars & Guidelines
tl;dr
- label form elements
- provide alternative text for non-text content
- ensure color contrast meets minimum threshold
- make link text descriptive
- do not use color as the only indication of meaning
- add captions to audio content
Content should be presented in more than one format
Image based content should always have textual alternative
If you have a video make sure it has caption or transcripts
Accessible button labels - confluence page
Testing Tools & Techniques
Testing workflow?
- automated tests
- keyboard navigation
- Voiceover / Screenreader tests
- Loop11 remote usability test
aXe tool
aXe-cli - confluence page
Tool - AccessLint
Automated and continuous web accessibility testing - (CircleCI integration so far)
Tool - Tenon.io
Ability to integrate its automated accessibility testing API into your development processes.
Using tab to navigate
In-Accessible buttons and events - confluence page
Check cnn.com mobile menu
Voiceover / Screenreaders
on Windows - NVDA - confluence page
on OSX - Voiceover
The Message
Catch Accessibility issues early.
At the core, accessibility testing will improve your applicaition and protect you from being compromising your User Experience