With a graphical UI, you need to add alt text to important graphics. Or you build Voice First, skip the GUI, and dismiss alt text altogether.

What is Alt Text?

Alt Text is short for alternative text, and is added to images in digital content. It’s used by screen readers – for people who are blind or have low vision – to describe the contents of an image. Here’s an example:

 

Comic of two robots chatting, one says "I just started work on my second novel."

The alt text on the image is Comic of two robots chatting, one says “I just started work on my second novel.” Note that this alt text is not visible if you’re sighted.

Some platforms like Twitter support adding alt text when posting content. Engineers may also add alt text when writing frontend code, or later on as a fix.

Alt Text is a Requirement

You need to include text alternatives for important visual content in your applications. It’s a baseline requirement for accessibility.

Accessibility is a must for digital applications.

There are laws in the US and abroad that require digital content to be accessible to people with disabilities. Content needs to meet guidelines about text alternatives (amongst other things). Target settled a class action lawsuit that focused on missing alt text. The requirement was again highlighted by a recent lawsuit against Winn-Dixie, where the plaintiff won.

Screen Readers Support is Niche

People can’t read alt text without screen reader software or looking at the HTML source code. In our example image above, the alt text is missing for non-screenreader users. This is true of other types of screen reader support, including form labels added with ARIA.

Building for accessibility includes building features specific to people who are blind or have low vision, features that are hidden from sighted users.

A lot of the work you do for screen reader accessibility is hidden for most of your customers.

I’ll reiterate, if you’re building graphical UIs you must provide screen reader accessibility. However, you might avoid the added complexity by building Voice First.

Voice First Beats Accessibility

Voice UI breaks the visual-first model, and “screen reader accessibility” becomes a misnomer.

Right now most web and mobile applications assume you have sight. It’s not surprising then that alt text is often missing or worse, incorrect. When it is used, alt text is often tacked on, or an afterthought.

Voice First is about moving past the GUI and rethinking your application in terms of text and speech. If you follow this approach of thinking Voice First, the idea of alternative text and screen reader support becomes irrelevant. That means that people with visual impairments get a first-class experience, as good as everyone else, instead of a sometimes distorted copy of a visual experience.

This focus on text can also apply for the Deaf and hard-of-hearing: check out Bespoken’s Silent Echo and Siri’s text input as examples of text inputs, and be sure to add captions to video content on Echo Show.

Build Voice First and focus on building a better product for everyone.

Category: Research

Cameron Cundiff

Senior Software Engineer at Sayspring.

Start Designing Voice Apps for Free

Prototyping voice-powered user experiences with Sayspring is fast and easy.