Author: Melanie Mudge
If you’ve spent any time on the internet, chances are good that you’ve heard of or encountered some form of digital accessibility. Ever watched a TikTok or Reel with no sound, only captions? That’s digital accessibility. Ever seen a social media post that includes an image description in the caption? Digital accessibility. Ever had Siri or Alexa read aloud from a webpage to you? That’s possible because of digital accessibility.
Despite most of us not knowing the technical terms associated with digital accessibility, we all benefit from it in one way or another. And as we become more and more reliant on the internet for all aspects of our lives, digital accessibility is only going to become more ingrained in the cultural zeitgeist with each passing day.
So what is digital accessibility? And how does it help? In this three-part deep dive, we’ll be focusing specifically on image accessibility, and we’ll cover everything from what alt text is to mastering the art of writing it. So whether you’re here to learn the basics or you’re looking to expand your knowledge and skills, you’ve come to the right place! Let’s get started.
What Is Digital Accessibility?
In general, accessibility refers to making products, devices, and places accessible to everyone, including people with disabilities. Digital accessibility, then, refers to making digital information and products—like apps and websites—accessible to everyone. This includes but is not limited to things like captions on videos, descriptive audio for movies, alt text for images, and keyboard navigation options.
What Is Alt Text?
Short for Alternative Text and AKA alt tag or alt description, it is exactly that: an alternate way of experiencing an image through text when it cannot be seen. This is accomplished through a brief description that captures what the image looks like, as well as the purpose and meaning of the image.
Photo by Loren & Loki on UnsplashAlt Text: Adult dalmatian dog with a blue eye and a brown eye pants and leans its head out of a partially open window of a dark silver vehicle.
Why Is Alt Text Important?
1. Alt Text Improves Digital Accessibility
As a global society in the 21st century, we’re extremely dependent on the internet, and the COVID-19 pandemic only increased that dependency. Think of how much of your personal and work life is currently accomplished or experienced through the internet on your smartphone, tablet, and/or computer. Now imagine being excluded from most, if not all, of it because it is not visually accessible to you.
Visually impaired folks can’t utilize the full potential of the internet unless those who create spaces on the internet (developers, designers) and those who create content for the internet (writers, influencers, producers, filmmakers) incorporate digital accessibility measures into their work. Just as an architect creates a building with ramps and elevators so everyone can enter, so must web architects craft content and spaces with built-in accessibility features so that everyone has access. Thus, similar to ramps removing physical barriers, alt text helps remove visual barriers to make the internet more equitable.
2. Alt Text is Legally Required
Because of the reality above, many countries now have laws requiring digital accessibility measures, and several international disability rights laws, including the Americans with Disabilities Act (ADA), the Accessible Canada Act, and the European Accessibility Act, have incorporated web accessibility into their requirements. In fact, the U.S. Department of Justice released updated guidelines in March of 2022 about which websites the ADA applies to and what it means to be compliant, citing our reliance on the internet for everyday life as the impetus for better guidelines.
And these laws aren’t to be ignored. According to Usablenet’s annual report, U.S. web accessibility lawsuits increased 27% year over year in 2020 and 15% year over year in 2021. Interestingly enough, according to Essential Accessibility, alt text is one of the top five most common errors mentioned in such lawsuits, despite being included in the Web Content Accessibility Guidelines (WCAG)—which are used around the world and have become the basis for many disability rights laws—since their creation over 20 years ago.
3. Alt Text Can Improve Image SEO
As of this writing, nearly 30% of Google SERPs (Search Engine Results Pages) feature image results at the top. Despite vast improvements in object recognition technology, search engines cannot “see” those images like we do. These programs and AIs can only read code, so they rely on alt text descriptions to understand what an image contains. Without alt text, we leave interpretation up to the bots, and if they don’t understand, a website or page could end up ranking for unintended keywords or not rank altogether.
For example, an AI might recognize that this meme contains a cat and populate it in search results for “cat.” But that completely misses the entire point of this image: a pun of State Farm Insurance’s slogan that plays off of Grumpy Cat’s famously angry face. Without a proper alt text description, this image might either make your page rank for “cat”—probably not what you were going for—or you might completely miss the chance to rank for something like “Grumpy Cat memes.”
Photo by @RealGrumpyCatNot having alt text means that despite your best efforts, you could be missing out on a huge source of organic traffic: your website’s images. Thus, websites that utilize alt text have better image SEO than those that don’t. Check out this article from Ahrefs for a more in-depth breakdown of how alt text can improve SEO.
Alt Text: Meme. A closeup of Grumpy Cat perched up on a garden fence, piercing blue eyes staring you down with an intimidating expression. Caption. Like a good neighbor, stay over there.
4. Alt Text Improves User Experience…For Everyone
As you might imagine, all of these features combined lead to a better UX for disabled and non-disabled users alike, which in turn is good for businesses and brands.
Who Uses Alt Text?
People who are visually impaired or blind often rely on alt text to access visual content. This is not a small number of people. According to the World Health Organization, 2.2 billion people have a near or distance vision impairment, 285 million people are blind or have low vision, 39 million are legally blind, and, according to the World Federation of the Deafblind, 15 million are deafblind. And because our chances of developing new vision impairments only increase as we age, many millions more will be added to these numbers over the years to come.
But they’re not the only ones who utilize alt text. Anyone who uses a search engine or has a slow internet connection also benefits. As we just saw, search engines rely on alt text to be able to crawl and index images for search results. And whenever someone has a slow connection, alt text descriptions are displayed in place of an image when it can’t load.
But there’s one surprising user of alt text that often gets overlooked: voice assistants like Apple’s Siri, Amazon Alexa, Google Assistant, and Microsoft Cortana. Voice shopping—that is, shopping via the use of a voice assistant or smart speaker—is on the rise, and according to Microsoft’s 2019 Voice Report, 42% of those surveyed believed that voice assistants are able to find products based on images or photos. But just like the search engines they rely on, voice assistants cannot actually see photos, so they use alt text to understand what an image contains and populate relevant products in search results.
How Does Alt Text Work? How Do People Access It?
Let’s break the process down without getting too technical. First, the person who creates or publishes an image writes an alt text description and puts it into the dedicated HTML attribute field, <alt>. And as of 2021 they can also add their alt text to the image’s metadata so that no matter where the image goes, the alt text goes with it. (Learn more about how photo metadata works in this article.)
Then, whenever a person using assistive technologies like a screen reader (e.g. Apple’s VoiceOver) navigates to the page, instead of skipping over the image as if it doesn’t exist, the screen reader finds the <alt> field and uses text-to-speech to read what’s there aloud to the user, allowing them to have a more complete understanding of that webpage.
Conclusion
Now that you’ve got a good understanding of what alt text is, what purpose it serves, and how it can benefit your audience and business, you’re ready to learn how to write descriptions for your images! Continue honing your alt text writing skills in Part 2 of the Alt Text Masterclass. Begin honing your alt text writing skills in Alt Text Masterclass Part 2.
