Robert Jolly
Chop wood, carry water. Dad. Husband. Friend. Product at 18F
Accessibility Training
Robert Jolly
Agenda
- 9:30 - Overview and Intro Exercise
- 10:00 - How People with Disabilities Use Technology
- 10:30 - Accessibility Guidelines Review and What’s Next
- 11:00 - Take a 15-Minute Break
- 11:15 - Site Demos using Assistive Technology + Discussion
- 12:00 - Break for Lunch
- 1:00 - Design Review Sessions
- 2:30 - Take a 15-Minute Break
- 2:45 - Coded Page Review Sessions
- 3:45 - Wrap Up
Three Questions:
- Who are you?
- What do you do?
- What is one thing you want to learn today?
How People with Disabilities Use Technology
General Categories of Disabilities
Note:
Some people may have disabilities from birth or as a result of disease, illness, or accident. Additionally, people may develop impairments with age.
General Categories of Disabilities
- Auditory
- Cognitive, Learning, Neurological
- Physical
- Speech
- Visual
More information:
W3C WAI - Diverse Abilities and Barriers
Accessibility Perspectives
The W3C Web Accessibility Initiative, which Knowbility actively participates in, commissioned these videos to help educate people about the importance of web accessibility.
Did that prompt any questions or ideas?
Accessibility Guidelines
- Review of what we have.
- Preview of what’s new.
Accessibility Guidelines
Existing: WCAG 2.0
- Four main Principles
- Perceivable
- Operable
- Understandable
- Robust
- Guidelines and Success Criteria
- Section 508 aligns with WCAG 2.0 Level AA
Accessibility Guidelines
New/Current: WCAG 2.1
- Compatible with WCAG 2.0
- Adds new Success Criteria (17 total, 12 at AA)
- Covers areas WCAG 2.0 did not address well:
- Low Vision
- Mobile
- Cognitive
- Section 508 does not use WCAG 2.1 (yet).
Accessibility Guidelines
What to watch for:
- Section 508 updates
- California AB 434
- Litigation changes related to guidelines
Break
Site Demos with Assistive Technology
Have a site in mind?
Let’s see how accessible some are.
Lunch Break
Design Review Sessions
Design Review Tips:
- Use good color contrast.
- Don’t use color alone for meaning.
- Provide visible focus (“outlines”).
- Design bypass blocks (“skip navigation”).
- Ensure labels are on all form fields.
- Document and design form error handling.
- Use proximity for related elements.
- Appropriate alt text.
- Think about keyboard controls for interactions.
Ask design teams to:
Design Review Tips:
Want a checklist?
Design Review
Let’s take a look at three sites.
Break
Coded Page Review Sessions
Coded Page Review Tips:
- Use semantic markup—always.
- Keyboard test everything.
- Ensure page titles are descriptive and unique.
- Keep heading levels logical and consistent.
- Use ARIA correctly when needed.
- Test for accessibility at each code commit.
- Assume 3rd-party code libraries are not accessible.
- Keyboard test everything.
Ask development teams to:
Coded Page Review Tips:
Want a checklist?
Coded Page Review
Let’s take a look at three sites.
Wrap Up
Additional Tools & Resources
- Colour Contrast Analyser (Mac, Windows)
- Accessibility Testing Bookmarklets
- Web Developer Toolbar (Chrome, Firefox, Opera)
- WAVE Browser Extension (Chrome, Firefox)
- W3C How to Meet WCAG 2 (Quick Reference)
- W3C An Alt Decision Tree
- NVDA (Windows Screen Reader - Free)
Thank You!
Robert Jolly
Accessibility Training for SCE - 2018
By Robert Jolly
