Skip to main content Accessibility Feedback

How to build interactive JavaScript components that work for everyone who uses your site

I just launched a brand new course and book: Accessible Components with Vanilla JS.

This course covers the ins-and-outs of building accessible, interactive UI components in about an hour. You’ll learn…

  • What assistive technology is
  • How to enable and use a screen reader
  • The basics of navigating the web with a keyboard
  • The dangers of CSS-only interactive components
  • The importance of HTML semantics
  • Focus management essentials
  • How to hide content, and accessibility considerations when doing so
  • How to announce dynamic changes to the UI
  • How to indicate button state
  • How to build four of the most common interactive components

If you already own my complete set of pocket guides or the expert bundle, this is a free upgrade (and if you buy one of them, the course is included at a steep discount).

Curious what the course is like? Here’s a sample lesson.

How to announce dynamic content changes with the [aria-live] attribute.

As part of the course, we’ll build a collection of accessible UI components, including a show/hide disclosure, accordion, tabs, and a notification component.

Many thanks to Léonie Watson from TetraLogical for providing a technical edit of the course to ensure the recommendations in it are actually, well… good!

Click here to learn more about the course.