Mike Smick UX Sketch Sub Page Image

Web Accessibility Resources

In most of the places I’ve worked I’ve tried to be at least an advocate if not an implementer of accessible page design. I’m not perfect of course and neither are projects we’re often assigned. But what we want to do is take steps to make our work accessible to the most people possible. We already do that through design and categorization right? We want clarity and enjoyment and accessibility is no exception to that even when requirements are unfamiliar, redundant or complex.

I wanted to share here a baseline of resources you can use to help make your websites more accessible. I’m focusing on the web here because the tools require the page to be available to the inspection software.

WAVE – Web Accessibility Evaluation Tool – This tool is great for its visual output with clickable icon indicators and it’s report summary sidebar. Almost everything is given descriptive definitions under a reference tab. For example, one check I did revealed redundant title text. The reference tab shows what the alert means, why it matters and what to do. That’s is really fantastic. You’ll love the tooltips and links off to the standards and implementation.

FAE – Functional Accessibility Evaluator, which is published by the University of Illinois is a great tool to run a single page through or if you create an account, you can scrub an entire site. I don’t necessarily think it’s always good to scrub an entire site, at least at first. One of the reasons good work in accessibility isn’t done is because of the perception that it will delay the project considerably. Doing a little bit at a time allows you to locate and fix errors, warnings etc based on page priority and available time.

AChecker – Web Accessibility Checker – While maybe not as thorough in some ways as FAE, it does have other validator tools you can enable with a checkbox and gets you on the right track towards finding issues. For example, AChecker did not warn me of my headline structure problems (headlines out of hierarchy). And where that is important is when you see a screenreader in action, you get an idea of the importance of section headlines navigation. With that said, AChecker is made for you to run it multiple times. This application is based in Canada and if you are in the U.S. for example, it’s a good idea to get familiar with some regulations and recommendations outside your home country. The way the report on AChecker runs, you can sort by guideline or line number. And you are given the line numbers in order to help you locate any problems. It’s extremely helpful.

Accessibility.gov – This is the official U.S. government website for accessibility which covers websites, software and electronic documents. Unfortunately while this site does a good job linking to official documentation, it’s a bit light on its own. With that said, from there you’ll learn about the ANDI bookmarklet. The Color Contrast Analyzer tutorials are useful, though a bit hard to watch.

Access-Board.gov – This is the U.S. government accessibility website that covers more of the physical world like bathrooms, vehicles, buildings, roads etc. Worth knowing about and investigating in case some of your work is involved. As you know kiosks and other digital concierge services are showing up everywhere so it’s good to be aware.

NVDA – Non-Visual Desktop Access Tool – For Windows, this screen reader is free, developed by two friends who met at a music camp for the blind. Lots of screen tools and equipment are prohibitively expensive and difficult to install. You will get a feel for the screenreading experience of your website by going this route. As a developer or experience designer a great exercise would be to write up a few tasks and then experiment with screen readers to see how hard it is to complete those tasks. Granted you won’t be as efficient as somebody who lives with the readers every day, even better you’ll realize the struggle.

Accessibility videos on Youtube – I promise I’m not trying to be lazy here, but it’s merely a reminder that once you get past the high level, low content accessibility videos there are is a lot to learn from watching people with impairments live. They explain things they need and it’s very enlightening as well as action oriented. One of my favorite examples.

I’ll leave it there for now since this gives you a lot of action you can take. Just remember, it’s very likely the only one who will follow through on this part of your project is you. If it’s helpful, just think of the people counting on you. If you’re overwhelmed again, start with a page. Or start by searching for your content system and accessibility tools or recommendations. That way at least you are working within constraints and you’ll learn a ton while you do it.

Every designer knows how important it is to delight people. Do that. And if you are motivated in other ways, consider the way your content is written for products. Let’s say you have the most comfortable furniture or other products that a person with some impairment would love to have, design and write and produce media with the sound and caption and give it more visceral weight for everyone to discover it.