⚠️This is currently a work in progress. More topics are continually being added.

Web accessibility is a vast and multi-faceted topic, so it can be easy to feel overwhelmed when you’re trying to learn how to build accessible websites. With that in mind, I've created this cheatsheet as a way to share what I've learned over years of studying accessibility and building accessible websites and web apps.

I'll do my best to explain things in plain English, since anyone who's looked at the Web Content Accessibility Guidelines (WCAG) knows that parsing the documentation can sometimes be difficult.

I'll also include some full code examples that will hopefully be helpful, and will be as framework-agnostic as possible (although, some of the examples will intentionally be specific to frameworks like Vue or React).

If you're completely new to web accessibility, feel free to follow the suggested reading order. Otherwise, you can peruse the list of topics.

1. Web accessibility foundations
2. Semantics
3. Headings and landmarks
4. Inclusive design
5. Interactivity
6. Animation and motion