Accessibility
Building sites everyone can use.
Accessibility is taught here in 14 lessons, running from WCAG in plain language through to Auditing, remediation and compliance reporting. Each lesson takes one topic, shows the working code, and links onward to the next, so the course can be read straight through in order.
| Track | Building a Website |
| Lessons | 14 |
| Level | Beginner to intermediate |
| Reading time | about 3 hours |
| Prerequisites | Helpful, but not required: CDNs & Caching |
Lessons
- WCAG in plain languageThe four principles behind the guidelines, what the conformance levels mean, and the failures that account for most real-world barriers.
- Semantic HTML and keyboard accessWhy the right element is most of accessibility, how tab order really works, and the fixes that come free with native controls.
- Focus management, ARIA and testingMoving focus deliberately in dynamic interfaces, using ARIA only when needed, and a testing routine that finds real barriers.
- How people use assistive technologyScreen reader navigation modes, magnifiers and zoom, voice control, switch and keyboard-only use, captioning, and how to test with real users.
- Colour, contrast and accessible visual designContrast ratios for text and non-text content, not relying on colour alone, focus indicator visibility, dark mode, and a palette approach that passes by construction.
- Images, media and alternative textWriting useful alt text, marking decorative images, complex figures, inline SVG accessibility, captions and transcripts, and controlling autoplaying media.
- Forms, labels and accessible validationProgrammatic labels and grouping, required and error states, validation that does not hijack focus, help text, and accessible authentication under WCAG 2.2.
- Accessible components: modals, menus, tabs and comboboxesDialog focus trapping and returning focus, disclosure and menu patterns, tab and accordion semantics, combobox keyboard behaviour, and why a tested library beats hand-rolling.
- Live regions and dynamic content announcementsPoliteness levels, status and alert roles, announcing async results and validation, route changes in single-page apps, and avoiding announcement spam.
- Data tables, charts and data visualisationHeader cells and captions, complex table headers, accessible sort controls, text alternatives for charts, and colourblind-safe encodings.
- Motion, zoom, reflow and vestibular safetyReduced motion, pausing and stopping animation, 400 percent zoom and reflow, text spacing, orientation, and target size requirements.
- Cognitive accessibility: plain language and error recoveryPlain-language writing, consistent navigation and help placement, reducing memory and redundant entry, timeouts, and forgiving error recovery.
- Accessibility in design systems and SPA frameworksComponent contracts that encode accessibility, testing components in isolation with React, Vue and Angular, and preventing regressions across a design system.
- Auditing, remediation and compliance reportingChoosing automated scanners, structuring a manual audit, prioritising fixes by user impact, VPAT and EN 301 549 evidence, and building accessibility into CI.
More in Building a Website
SEO Basics Domains & DNS Web Hosting CDNs & Caching
FAQ
How long does the Accessibility course take?
It has 14 lessons, about 3 hours of reading. Expect roughly twice that if you type out and run every example.
Do I need prior experience for Accessibility?
Not strictly. It helps to have read CDNs & Caching first, because some lessons build on it, but every lesson explains its own assumptions.
What should I read after Accessibility?
This is the last course in Building a Website right now. Browse the other tracks from the courses index to go sideways.