Skip to Main Content

Make a splash: In-depth dive into ARIA

taught by: Nicolas Steenhout

Session Summary

In-Depth look at ARIA techniques used to improve accessibility, and how to use them.


By now you probably know the first rule of ARIA: Don't use ARIA, unless you really need to. Because sometimes, we do need to use ARIA. But when should we use ARIA? And how should we use it? These questions can leave us high and dry!

This session is more than a simple overview of what ARIA is. It's an in-depth exploration of common ARIA roles, states, properties, and techniques that we can use to increase the accessibility of our web pages or applications. Don't fret, we're not going to dive head first into cold and murky water!

We'll start by dipping our toes in what are the Accessible Rich Internet Application (ARIA) specifications and a bit of history. We'll then wade into some of the potential problems caused by overuse or incorrect use of ARIA.

Once we're acclimated, we'll go through several examples of how to use ARIA to improve accessibility. We'll talk about input labelling, error message handling, required fields, dynamic content, switches, sliders and progress bars, and more!

This session isn't going to be spectator sports - you'll be expected to participate, ask questions, and share your experiences. Come prepared with ARIA-related pain points you'd like resolved. If you'd really prefer to be a spectator, you may have to hide in the murky depth of the back row!!!

Practical Skills

  • Learn at least 5 ways NOT to use ARIA
  • Understand the "gotchas" of using at least 5 different ARIA attributes (e.g. aria-live="assertive")
  • Know at least 5 different ARIA roles, states, and properties that should be paired (e.g. switch role and aria-pressed state)