Coding Accessible Interactions & Mechanics with JavaScript

Coding Accessibile Interactions & Mechanics - May 10, 2022

Take your skills up a notch as we continue our from-scratch web app building by implementing accessible versions of common components.

Workshop topics include:

The Keyboard as the Most Essential Tool

In this section we'll explore how to ensure your site can be used without a mouse or trackpad. You'll learn various CSS visibility techniques and how they impact keyboard and screen readers users. You’ll also implement skip links to save users from unnecessary tabbing.

How Screen Readers Overlap with Keyboard Access

Screen readers allow users to navigate our pages beyond just the Tab key. In this part of the workshop, you'll learn the different interaction modes for screen readers, and how to enable & test them in an application. We will also discuss the importance (and limitations) of analytics and WebAIM user surveys for prioritizing user flows.

Focus Management with JavaScript

Modals, drop downs, removing or reordering items...these are all scenarios where focus management with JavaScript is key to a good user experience. In this section we'll examine the best approaches to intuitive key event handling and navigation. You'll also gain experience with implementing roving tabindex and writing automated tests for a date picker component.

Announcements with Assistive Technology

There are many situations where new information is presented in our applications that needs to be announced in screen readers: chat boxes, alerts and errors, toast notifications, and more. Learn how to add ARIA Live Regions to an application, when to make announcements, and how much to say. You'll also learn about client-side routing techniques that tie focus management and announcements together.

Advanced Scripting with ARIA

When using ARIA and JavaScript together, it’s important to learn about some of the cross-platform intricacies. The workshop wraps up with some advanced ARIA techniques related to using screen readers with a date picker, including screen reader modes and the effects of role=”application”.

Tickets Prices in USD

Additional Information

This event will occur from 9 am - 2 pm Pacific (click here for timezones), with a 30 minute lunch break. Tickets are non-refundable. No recording of this live event will be provided. Tickets are transferrable. Event details will be provided in advance of the workshop via email.