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.
Patrick Fox is a technology director at Razorfish specializing in frontend technology and modern web accessibility.
©2016, O'Reilly Media, Inc. • (800) 889-8969 or (707) 827-7019 • Monday-Friday 7:30am-5pm PT • All trademarks and registered trademarks appearing on oreilly.com are the property of their respective owners. • firstname.lastname@example.org