Web Accessibility

Make your corner of the web better!

If you're making a website, you should try to make it as accessible as possible. Here are some resources on how to do that.

Development

• HTML Living Standard

  This is a fantastic resource for learning what modern HTML can offer you. I always have it open in another tab whenever I'm authoring HTML to make sure I use the right element for the right purpose. You can always learn something new by poking around the enormous table of contents!

• W3C Web Accessibility Initiative (WAI)

  When it comes to web accessibility, this should be your first starting point. The WAI website hosts a wealth of information about authoring accessible experiences on the web. Here are some of their most helpful references:

  • How to Meet WCAG (Quick Reference)

    Learn in plain terms how a website should behave without digging into the implementation details. If you're looking for a checklist of things to verify, this is it.

  • Web Accessibility Tutorials

    An easy-to-browse set of simple examples for common patterns in web interface design, including page structure, tables, and forms. A great resource for refreshing what the best practices are when starting out on a new design.

  • ARIA Authoring Practices Guide

    If you liked that previous resource but want even more details about how you can apply good web accessibility practices, this is the resource for you. It includes design patterns for dozens of different widgets, with details like how keyboard navigation should be implemented and what ARIA roles belong where. It's an absolutely invaluable reference once you start making more complex interactive components.

• Browser developer tools

  • Firefox: Accessibility Inspector

    Firefox's Accessibility Inspector is invaluable for being able to quickly browse through the accessability DOM more easily than any other browser I've used. Try it out on your site to get a feel for how things are labeled and what relationships they have.

  • Google Chrome: Accessibility Tree

    Similar to Firefox's inspector, but still in preview and less fully-featured as of this writing.

Screen reader guides

Here are the reference pages for the screen readers on the major operating systems:

• Windows:
  • Windows Narrator (built-in)
  • NVDA (third-party)
  • JAWS (PDF) (third-party)
• macOS: VoiceOver (built-in)
• Linux: Orca (third-party, GNOME)
• iOS: VoiceOver (built-in)
• Android: TalkBack (built-in)