Accessibility Testing for Offline First Applications
Resources for making accessibility part of your PWA design
Earlier this year I attended Offline Camp Berlin and was delighted to participate in an unconference session and subsequent conversations on “Accessibility/A11y.” Daniela Matos de Carvalho recapped this session really well, but the gist is that as we focus on moving to an Offline First approach to application development, it is imperative that we don’t leave accessibility behind. The one thing that jumped out at me about this session is that it takes commitment from the entire development team to ensure we prioritize accessibility when building/deploying/testing our apps.
Rob Dodson, a Senior Developer Advocate at Google, gave a great talk at Google’s Progressive Web App Dev Summit in 2016 about how to make sure as you build PWA’s that all of your users can access the content within those apps.
One great guideline mentioned in this talk is the WCAG Checklist. WCAG stands for Web Content Accessibility Guidelines. This is a great place to go if you want to know everything the W3 is doing to standardize accessibility guidelines for the web. But admittedly, this list is exhaustive and might be a hard sell when trying to convince your team to adopt these practices into your development cycle.
There is a feature in Chrome’s default Developer Tools which can help you review various PWA features which tests for a lot of great things, including offline handling and accessibility (spoiler: it’s Lighthouse, by Google). Lighthouse has a whole section specifically dedicated to accessibility testing, which tests to ensure that your app is accessible to people with impairments.
Lighthouse has many extensive categories for accessibility. It measures color contrast on the page for people with visual impairments to ensure that background and foreground colors have sufficient contrast ratio. It ensures pages contain proper meta tags for people who require assistive technologies like screen readers. The meta tag looks at things like screen refresh and zoom. For example, disabling zooming is problematic for users with low vision who rely on screen magnification to properly see the webpage. The tool also checks to ensure various ARIA Attributes are following best practices. Try running Lighthouse on your favorite website to see the rest of the accessibility features that it can help you test for when building your progressive web apps.
One of the main principles of #OfflineFirst is that we must always start the build process by handling the most constrained environment first. While ensuring that your users who are experiencing variable connectivity are still able to access your app, you must not forget your users who also live with impairments that require special care to ensure they can fully utilize your app’s features.
Jesse Beach gave a great passion talk at Offline Camp in California last fall where she guided the group in a discussion about what accessibility IS at the basic level. And if you want to hear directly from people with disabilities about their biggest issues with using the web, Safia Abdalla has a well curated Twitter thread where she asked people to remind us where they are most often left behind.
In fact, the next Offline Camp event is happening November 10–13 in Grants Pass, Oregon. Be sure to check the Offline Camp Medium publication in the coming weeks for more videos and articles from the latest sessions at camp!
