The word “everybody” with HTML-style angle brackets on both sides and an end-tag slash through the middle.

Accessibility-first Design

Goodmaker Team
Jun 17 · 5 min read

Written by Laurel Hechanova and Patrick DiMichele

“All technology is assistive technology.” — Sara Hendren, design researcher, Olin College of Engineering

The handle on your cabinets. The brightness slider on your phone. A zipper pull. The tear notch on a bag of chips. Stairs. Most things are designed with some kind of assistive measures to help people do stuff more easily. We as designers and builders of such things just tend to stop at helping a select group of people—usually the people most similar to us in terms of capabilities and needs.

For example, if we don’t typically have to haul a bike up stairs, we might not design stairs like this:

Person carrying a bag, ascending a flight of stairs while rolling a bicycle up an adjacent ramp. Photo credit Steve Vance (CC BY-NC-SA 2.0)

For this article, we’d initially set out to talk about how maybe “accessibility-first” design could be the next “mobile-first” design. How thinking more rigorously about constraints, and focusing on a wider array of constraints, might lead to better-designed products.

We still believe that’s likely the case.

Amazon, for example says this on its accessibility help page: “Some of our customers using access technology may find it convenient to visit our mobile site. It can be found at http://www.amazon.com/access.”

Compare the typical Amazon desktop experience…

The Amazon.com homepage in desktop view displays multiple navigation menus, a full-screen background ad carousel, four recommendation sections (including another carousel) displaying a total of 15.5 images, another ad, and an option to sign in.

…with their recommended “accessible” experience:

Amazon’s “accessible” homepage shows fewer navigation menus, two ads, a large option to sign in and one “Deal of the Day” product.

Clearly, accessible design has the potential to give everyone a more pleasant interactive experience. But before we can get to that place, my god, we should all at least meet basic compliance standards, so that’s what we’re going to focus on here.

Accessibility is a decidedly low bar, and we’re still side-stepping it.

We spoke with a few people with disabilities for this post, and we were gutted to find that designers, developers, and many content platforms are failing to do very basic things like using form labels as form labels (not placeholder text as form labels) or using alt-text to caption images for screen readers.

In fact, Medium, the website you are currently using to read this article, doesn’t allow authors to include alt-text for images. (If you’re an astute reader of this blog, you may have noticed that we’ve gone back to add descriptive captions to our blog post illustrations. This is why.) Interestingly, Instagram does.

Why are small things like this so important? From one of the folks we spoke to: “Fun experiment: every time you move your arms or wiggle your fingers, you get a painful electric shock. Try doing anything for more than an hour. For me that isn’t an experiment, it’s my real hecking life.”

So, let’s start with some empathy. Here’s a fantastic introduction to how technology opened up the world for Austin Seraphin, who has been blind since birth. (Laurel here. For what it’s worth, I almost always skip recommended videos, but this one’s powerful and Seraphin’s hilarious, so I highly recommend you check it out.)

Video: How the blind use technology to see the world | Austin Seraphin

So, let’s try starting with accessibility when we design and code things. Here are a few easy ways to get started:

  1. Make things legible. You know what’s cool now, designers? BIG, BOLD TEXT. That’s right: high contrast colors and large font sizes. Let’s lean in to that and make our copy easier to read.
  2. Make forms as easy as possible to fill out. For starters, avoid using placeholder text as labels. It adds to visitors’ cognitive load and makes your form difficult for screen readers to parse. More here.
  3. Use header tags meaningfully. Nearly 70% of respondents to a 2017 WebAIM survey said they preferred to use headings to find information on lengthy webpages.
  4. Avoid pop ups or at least make them accessible. Pop ups are annoying even to those of us who can find the tiny “x” buttons that makes them go away. Can you imagine listening to a screen reader walk through navigation items and then suddenly repeating “LINK back to school S A L E img24077757 dot png” because someone created a sticky footer banner ad that is now the primary focus of the entire screen with no clear way to dismiss it?
  5. Use alt-text and aria-label to give images and icons context. Not every visual will need it, but lots definitely do. Here are some great guides on when to use alt-text and how to write it. And here’s one for aria-labels.

If you want to dive deeper, consider hiring people with disabilities to test your site or app for usability. AccessWorks is a recruitment channel specifically for people with disabilities, and We Are Capable is a remote work job board for people with chronic illness. Independent recruitment is always another option.

Of course, you can always roll up your sleeves and learn more. Designers, here are some great guidelines to start with. Developers, the Accessibility Developers Guide is a fantastic resource.

Lastly, if we missed anything, please let us know. If researching this article taught us anything, it’s that there’s a lot to learn.


Don’t let the fun stop here!

If you’d like to receive a bi-weekly email of interesting articles we write and recommend about the business of design, sign up for our newsletter.

Make Good

Articles About the Business of Design

Goodmaker Team

Written by

We design workshops, trainings and tools that help teams work better together. Visit us at www.Goodmaker.co.

Make Good

Make Good

Articles About the Business of Design

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade