theappbusiness/where-to-learn-about-accessibility

Here are some of the best resources to start learning about accessibility and inclusive design.

Where to learn about accessibility

Here are some of the best resources to start learning about accessibility and inclusive design.

We’ve included a wide range of formats and topics, often covering overlapping content.

Click on whichever piques your curiosity.

Please feel free to ask questions, raise issues and contribute.

Happy learning!

Good general introductions

• Google’s great free course on Udacity

• The Home Office’s ‘Dos and Donts’ posters

• A four part accessible design strategy (Government Digital Service)

• London Accessibility Meetup Youtube channel

• A Web For Everyone (book by Sarah Horton, message @jfhector to borrow a copy)

• Mismatch (book by Kat Holmes, which is the best book I've read on Inclusive Design)

Learning about the Web Content Accessibility Guidelines

• https://www.w3.org/TR/WCAG21/ (W3C official)

The following resources cover the same guidelines (or sometimes more), but are written to be easier to read:

• Kin + Carta's plain-language summary of the Web Content Accessibility Guidelines

• Deque's Accessibility Checklist

• BBC Mobile Accessibility Guidelines

Learning about how people with disabilities use websites and apps

• Web Accessibility Perspectives videos (W3C)

• Personas for Accessible UX (from the book A Web For Everyone)

• Certified Accessibility Professional Core Competencies preparation course (Deque, $45)

Learning about assistive technologies

• Rob Dodson's video demos of macOS VoiceOver, iOS VoiceOver, Android TalkBack and Switch devices

• Deque's Screen Reader Keyboard Shortcuts and Gestures cheat sheets show you how to use all the main screen readers

Guides on how to test accessibility (which is everyone's job)

• Accessibility Insights (Microsoft’s great browser extension guides you through manual web accessiblity testing. It also integrates Axe for the bits that can be tested automatically)

Getting your questions answered

• #topic-accessibility on K+C’s Slack

• #grp-topic-a11y on TAB’s or K+C’s Slack

• Web-a11y.slack.com (Open to everyone. Ask @jfhector or anyone who’s already in to send you an invite)

• #a11y on Twitter

• You can also ask any question and get experts' answers quickly on WebAIM mailing list

Resources that require some knowledge about web development

• Rob Dodson’s A11ycast Youtube Short Videos Series (Google)

• Accessibility | Web Fundamentals (Text version of Google’s video course on Udacity)

• The online web accessibility courses by Deque are very comprehensive and explain things in a lot of details. They are the easiest way to get good at web accessibility. Individual courses cost $45, and there’s a bundle covering everything you need to know for $150.

• https://a11yproject.com/ Use the nav at the top of the page to find Patterns, Checklist and Resources

Resources that require more knowledge about web development

Understanding ARIA and how to use it

• Using ARIA is a great official W3C document that explains in plain, concrete language how ARIA works, and how to use ARIA without messing things up. It’s a much more engaging read than the ARIA specs.

• ARIA in HTML is another short W3C document that explains ARIA semantics are implied by the different HTML elements, and what ARIA roles and attributes you can use on what HTML elements.

• Michael Fairchild's a11ysupport.io is still in its early days but is the best support table available for ARIA roles and attributes

Understanding how to build accessible UI components

• The ARIA Authoring Practices Guide is a great document that tells you how to implement a broad range of very common UI patterns (e.g. tabs, switches, toggles, dialog, feed, etc). Concretely, it tells you:
  • What keyboard support you need to implement to meet users’ expectations (which are largely set by how the same patterns are implemented in operating systems)
  • How to build these components using ARIA. (But be careful to read the document's 'Read me first' section if you intend to reuse these coding patterns as is)

Here are some great guides on how to design and code high-quality UI components

The following component examples are fully supported by browsers and screen readers today. They include more accessibility best practices than covered by the Web Content Accessibility Guidelines:

Guides or tutorials

• Inclusive Components by Heydon Pickering. This book/blog is a great place to start
• Scott O’Hara’s Accessible Components and The Accessibility of Styled Form Controls
• This great talk by Oliver Byford explaining some accessibility considerations and implementation techniques behind the GDS Design System
• Lots of component patterns on Adrian Roselli’s blog

Other components with good code annotations

Here are some other examples of highly accessible components:

• TenonUI (in React)
• The technical guide of the BBC GEL design system
• The GDS Design System