Approximately 10% of US citizens are blind or have some degree of vision loss. At TransitScreen we are exploring ways to make our digital signage more accessible to blind and low vision (BLV) users. Our work on this project has just begun, but we already learned some important lessons that we wanted to share.
Good code = accessible
Too often accessibility is thought of as extra work to be done after a site is finished. But in reality well-written HTML is already accessible by default, so the majority of the “work” simply involves knowing how to use it correctly and complying with standards.
- Use semantic markup appropriately by choosing the tag that best describes the content it contains.
- Avoid tricky hacks, and workarounds (like icon fonts). Chances are, if another developer will have a hard time understanding your code, a screen reader will too.
- Maintain a clean separation of concerns: Use HTML to organize content. Use CSS to define presentation. Use javascript for interactivity.
- And don’t skip alt attributes on images.
These are all best practices of modern web design that you should be doing anyway. When a site is built correctly in this way, it will be highly accessible to screen reader users right from the start.
Good design = accessible
Most of the same universal characteristics of good design are even more applicable to BLV users. A cornerstone of quality web design is putting things in logical places.
BLV people use patterns and common sense to help navigate the physical world. If a chair is in an intuitive, predictable place it will be easier to find, especially if you cannot see. Similarly, if a website’s primary navigation is in an intuitive, predictable place it will be easier to find, especially if you cannot see. No one wants to hunt for what they want on a page, and it is even more cumbersome with a screen reader because it can only read one section at a time. This can be highly effective when things are in an expected place, and highly frustrating when they are not. This makes consistent, thoughtful layouts especially important to these users. But if the visual language of your site is inconsistent you will frustrate sighted users as well.
Lazy UX patterns will also tend to hinder BLV users disproportionately. Any time you make a sighted user work unnecessarily hard, you are likely making a blind user work even harder. For example, do not force users to re-enter all the fields on a form when only one of them is invalid. Do not make users answer questions that can be answered programmatically, such as credit card types that can be deduced from the prefix of the card number. If you reference a related resource, provide a link so that the user can click through to it instead of searching. These anti-patterns are universally irritating, and even more inconvenient for screen reader users.
Resist assumptions
Resisting assumptions is an essential skill for any type of usability work. We must always stay curious and not jump to “logical” conclusions before we have input from actual users. More often than not, testing reveals that users are behaving in a way that was unexpected (this is why we test!). Accessibility for BLV users is no different.
Blind and low vision users represent a diverse category, with wide-ranging forms of vision loss. A color-blind user may struggle when color is the only indicator of important information, while a blind person using a screen reader is completely unaffected. Similarly, the ability to zoom may be crucial to someone with blurred vision, but useless to a screen reader user. It is important to keep this diversity in mind so that testing efforts remain holistic and inclusive.
Prior to a recent user testing session, TransitScreen considered a handful of usability enhancements that we thought might prove to be useful for BLV users. Eventually we decided not to pursue most of them before getting feedback from the users they were meant to serve. This turned out to be the right approach. Some of the ideas we considered were on the right track. Some of them were not. And some needed to be rethought completely after learning more specific details about the ways these users were interacting with the site. This approach saved us time we would have spent making changes that were unnecessary, and allowed us to execute the good ideas even more effectively, guided by a more informed understanding of the issues being addressed.
Powerful accessibility testing is within reach
Like the rest of the world, most blind users also access the internet with a mobile device. This means that you do not need to buy expensive screen reader software or set up an elaborate device lab to conduct highly relevant accessibility testing for blind users.
Both iOS and Android have built-in screen readers that are easy to enable and disable for the purposes of testing. This is an easy way to identify usability problems, as well as familiarize yourself with the tools that roughly one in ten people are using to surf the web. Powerful accessibility testing tools are literally only as far as your pocket.