Accessibility is the intersection of design and empathy. Rather than building pages for people “just like us”, accessibility allows everyone to share in the wealth your site provides.
All too often accessibility tends to be treated as an afterthought: many developers are unaware of web accessibility standards; companies are unwilling to bill extra hours for integration, testing, and validation, and designers are often reluctant to adapt new techniques, or fearful of getting something wrong.
The reality is that we are all need accessibility. If your eyes need corrective lenses to see, that’s a technological accommodation to a physical disability. If you experience twinges of RSI due to too much typing, that’s an accessibility issue.
Accessibility is not difficult if it is integrated naturally with your site development process. Treating accessibility as an “add on” will inevitably leave it neglected due to lack of time. But by making accessibility part of the HTML that you do, you can make an site that works better for everyone.
The HTML reading lists in this series have taken this integrative approach; this section reinforces those lessons, while focusing on some specialist applications of accessibility principles.
Goals: integrate accessibility into a site development process; add subtitles to a HTML5 video.
Prerequisites: Basic HTML
Total time: 5 hours
Core Material
Introduction
Accesskeys For Shortcuts
Skip nav
WAI-ARIA Landmark Roles
Making Accessible Tables
WebVTT Video Subtitles
Editing Video Subtitles
Color Contrast Ratios & Font Sizes
Designing For Color Blindness
Create Accessible Passwords
Make SVG Accessible
Further Reading
I would strongly recommend reading Bryan Garaventa’s excellent accessibility training guide together with The Accessibility Project for more information, followed by Anne Gibson’s An Alphabet of Accessibility Issues.
Marco Zehe also has an excellent primer on the basics of web accessibility
Accessibility icon based on work by Triange Inc, licensed under Creative Commons.
Enjoy this piece? I invite you to follow me at twitter.com/dudleystorey to learn more.