Adam Claxon

Accessibility & UX

Are We Giving Everyone the Experience They Deserve?

A Lack of Awareness

For many of us, the ability to not consider blindness, deafness, or mobility issues is a luxury, but when we ignore accessibility, we are ignoring real people. We spend hours working out the right color scheme, considering interactions, interface, and User Experience, but overlook users who interact with our work differently than we do. Given the time and focus we dedicate to UX, this blind spot is simply inexcusable.

Why it Matters

Accessibility is an integral part of designing and developing websites and user interfaces; it allows users with disabilities to understand, navigate, and contribute to online communities, interact with the web, and perform their jobs. As online tools and services continue to intertwine with the ways we work and live, accessibility is now more important than ever.

When we forget the importance of accessibility in our designs and products, we forget the consequences for our users. When a visually impaired user cannot navigate a site or access information, we leave an important part of our audience left to guess what our interfaces require, and what our designs conceal. In many cases, these users may simply move on to an alternative with proper accessibility, but when we fail at accessibility in SaaS or B2B software, that same user may not be able to perform their job (read Marco Zehe’s article on the state of accessibility in Slack for more information). This problem becomes even more apparent when we consider the unemployment rate for the visually impaired (59.8%, as of 2010). While accessibility is only part of the problem, designing and developing interfaces with these users in mind can help increase their opportunities for employment.

Accessibility isn’t just about the visually impaired. Users with auditory impairments are often left behind by our multimedia content. Providing transcripts and captions for video content is trivial enough—many services exist for transcribing video in the correct format for as little one dollar a minute—but this aspect is commonly overlooked, even by major businesses.

The default focus state in Safari
The default focus state in Safari

Users with mobility issues face their own set of challenges when navigating the web: without the benefit of a mouse to easily select and interact with elements in an application or website, these users rely on visual cues to provide a sense of place. Navigating your design using only a keyboard is a good baseline test; if you find navigation difficult, anyone using an assistive device will have the same experience. The most common mistake committed by designers and developers is the removal of focus states on clickable elements. While some research shows default styling to be the best for user experience, these styles should at least be modified or replaced, instead of removed, allowing users to easily navigate the site or application. This sort of navigation also requires the underlying HTML structure to be straightforward and intuitive, with each section cleanly leading to the next logical step.

The Bigger Picture

People with disabilities aren’t the only ones who suffer when we fail to build accessible sites. Semantic HTML helps search engines index and understand our sites, and providing transcripts for videos allows search engines to index their content. Proper hover and focus states allow users with even temporary disabilities–or just a temporarily disabled mouse–to navigate our sites and applications. Following the guidelines of accessibility ensures we are making clear and straightforward choices in our designs. In other words, when we design and develop with accessibility in mind, we are making the experience better for everyone.

While it is easy to see accessibility as the responsibility of developers, this not only overlooks important aspects of accessibility, but often exiles it to the testing phase, instead of including it as an integral aspect of our work. Each step of design offers opportunities to consider all of our users. From wireframes to high fidelity designs, we should be questioning and identifying potential issues: Is each interaction clearly identified? Can users with mild visual impairments or colorblindness easily identify links and error states? What is the semantic layout of this page (or, in what order should the content be read)? These questions not only give us insights for better accessibility, they provide us a more thorough understanding of our work and designs.

Where Do I Start?

It would be unreasonable to include a comprehensive guide to accessibility in a short article, but here are a few steps to get you started:

Design

Development

While the best course of action would be to invest in screen readers and alternative input devices for testing, many of the devices we use already have tools to help us achieve a more accessible design.

For more in-depth information, visit our new Studio Science Accessibility Standards.