Designing with an Accessibility-First Approach

Technology is supposedly the grand equalizer, but UX (user experience) is only as good as its accessibility. 

In our ongoing mission to ensure that is accessible to all, here are some of the key components we consider as we improve and refine our product.

But first, it’s worth taking a moment to laud the role that audiobooks play in making reading accessible. Audiobooks enable blind and visually-impaired folks to read, and also prove useful to those with mobility and cognitive disabilities who cannot use print books or ebooks.

Too often, there is online discourse about how “audiobooks don’t count” and that “reading print books is the only way,” but, as author Alicia Elliott puts it, this mindset ultimately gatekeeps reading—and what’s the point of that?

Outside of disabilities, audiobooks allow those who are busy—with work, family, and the myriad of challenges life presents—to incorporate reading into their lives.

But it’s not just enough to say “audiobooks allow visually-impaired people to read, yay!” and call it a day; the tech itself needs to be accessible and usable. Here’s how we are working to meet these standards, and how we aim to improve.

Working with a Consultant

You might recognize the name Robert Kingett, our totally blind accessibility consultant, from our blog—he has previously written about the challenges that Audible Exclusive audiobooks pose to listeners like him. (To learn more about Audible Exclusive audiobooks and their harmful impact, take a quick trip over here.)

Whenever we are developing or a revising a new feature, we will send a test page to him to review. If it’s a more complex feature, we bring him in early to discuss our approach and get his thoughts on anything we should look out for. As an avid audiobook listener himself, Robert also reaches out whenever he notices something that could be improved on our website and app.

The Importance of Alt Text

Alt text, a contraction of alternative text, is a short written description of an image. “It is extremely important because it tells a non-sighted user what an image conveys, giving them a better understanding of the content,” notes Nick Johnson,’s co-founder and Creative Director. “This is especially crucial if the image contains text or a headline. We aim to use alt text on all images in our products.”

Making the Website Accessible

On our website, we use clear, consistent coding practices with proper structure and hierarchy of content. We make sure to utilize accurate alt and ARIA tags, and have consistent behavior across all our products. Another key element is making sure we have proper color contrast and type sizes for readability. That being said, “it’s always a work in progress,” says Nick. “No doubt we have forgot an ARIA or alt tag somewhere, and no doubt we missed other things. The goal is to constantly improve.”

Making the Apps Accessible has both an iOS app and an Android app. Apple products include VoiceOver, a built-in, gesture-based screen reader that gives audible descriptions of what’s on a screen—from battery level to which app your finger is on. This year, our iOS developers Irwin Coleman and Waleed Johnson have added custom router actions, which allow listeners to swipe and access certain shortcuts on pages: playing an audiobook, deleting files, hearing a synopsis, and more. “It’s an ongoing process where we welcome feedback and suggestions,” says Waleed. “We will continue to expand our accessibility support in future releases.”

For our Android app, developers Davin Rothschild and Avery Johnson utilize Android’s haptic feedback, gesture navigation, and TalkBack, another built-in accessibility service. TalkBalk is made more usable by adding content descriptions on all images and icons, and audio hints on input fields. Another thing to consider are design elements like colors and button sizes: “We have been collaborating with our designer to update our color schemes such that they are high contrast and distinguishable for the color blind,” remarks Davin. “For our upcoming update, we transitioned our icons to scalable vector graphics and reviewed our layouts and fonts to make sure all buttons, images, and text display and function well on various screen sizes and zoom settings.”

The Intersection of Aesthetics and Accessibility

While there have been major strides in making content accessible, there are countless websites that opt for slick (and often not screen reader-friendly) designs over usability. “Designing with accessibility impacts every aspect of the look and feel, from the colors chosen and type size to the structure and presentation of content,” says Nick. But this is a welcome challenge: “The best part is that when you make a page easier to use for one audience, it tends to make it easier to use for all audiences.”

“The best part is that when you make a page easier to use for one audience, it tends to make it easier to use for all audiences.”

Nick Johnson, Co-founder and Creative Director

So what tends to not be accessible? Design that is really interactive or heavily dependent on tech. Fortunately, doesn’t have many features like this on our products, but the one place in particular we are looking to improve is our indie partner map—we are currently working on an alternate version that is much more accessible.

The Ongoing Work of Auditing Content

Auditing our content “has been a long and slow process, mainly of trial and error,” says Nick. “Over time, our design and coding practices have evolved to a point where they are fairly accessible right out of the gate. When it comes to new features, the design team always has accessibility in mind when we start the project, and then our dev team makes sure to add the appropriate accessibility functionality while building features. We do not have a good auditing system in place as of yet, but I am currently attending Deque University and will be implementing the axe DevTools software soon.”

Our mission to make as accessible as possible to all is an evolving process, and it is one that we value deeply. If you ever discover something lacking on our website or apps, please do tell as at!

Leave a Reply

Your email address will not be published. Required fields are marked *