Photograph of people walking up a staircase with an integrated wheelchair access ramp

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

Prerequisites: Basic HTML

Total time: 5 hours

Core Material

  1. Accessibility iconIntroduction
  2. Accessibility iconAccesskeys For Shortcuts
  3. Accessibility iconSkip nav
  4. Accessibility iconWAI-ARIA Landmark Roles
  5. Making Accessible Tables
  6. WebVTT Video Subtitles
  7. Editing Video Subtitles
  8. Color Contrast Ratios & Font Sizes
  9. Designing For Color Blindness
  10. Create Accessible Passwords
  11. 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.