The Web Platform
March 7–8, 2016: Training
March 8–10, 2016: Conference
San Francisco, CA

Improving single-page app accessibility

Patrick Fox (Razorfish)
2:15pm–2:45pm Thursday, 03/10/2016
Average rating: *****
(5.00, 3 ratings)

Prerequisite knowledge

Attendees should be familiar with single-page architectures, common frameworks, user-experience design, and accessibility.

Description

Single-page apps are easy to implement and increasingly prevalent, but due to their dynamic nature, they pose a significant accessibility challenge with communicating view changes. Without a page refresh, screen readers do not pick up these important UI changes, leaving visually impaired users unaware or confused.

The solution Patrick Fox proposes is to create a message based on the page title and leverage an ARIA live region to explicitly announce that a new view has loaded. The end result is a helpful message that states the site name, page title, and a “view loaded” message.

Patrick demonstrates the accessibility issue using a screen reader and walks attendees through a couple of working examples that use React and Ember.

Photo of Patrick Fox

Patrick Fox

Razorfish

Patrick Fox is a technology director at Razorfish specializing in frontend technology and modern web accessibility.