Many organizations know that it’s important to add Alt-text to images to make them accessible to people with a visual disability. But they don’t necessarily know how to write Alt-text or what the best practices are. Find out 10 tips for how to write image Alt-text the right way.
What Alt-text Is
With all of the much-needed attention about website accessibility over the past few years, you’ve probably heard the term “Alt-text.” In case you don’t know what that is, Alt-text is short for “alternative text.” It provides a text description of an image.
A lot of people mistakenly call Alt-text “alt tags,” but the proper term is “Alt-text.”
Why You Should Use Alt-text
People with a visual disability
Adding Alt-text to images helps people with low vision or blindness understand the content of an image, which they cannot see well or at all. The assistive technology they use, such as a screen reader, will voice the Alt-text.
But Alt-text isn’t just for users with a visual disability. There are other benefits.
Images not loading
Someone might disable images in their browser because they have slow internet or because they want to save data. When they visit your website, they will see the Alt-text in place of the images.
Search engine optimization (SEO)
Alt-text also benefits your nonprofit organization by helping search engines find your website content. That’s because search engines can read text, but they cannot see images. They cannot tell what an image contains.
When you add Alt-text to an image, you’re telling search engines what the image is about. Those images will also show up in Google images search results, which increases the chance of someone coming across your organization in an online search.
Which Images Need Alt-text
Just because there are good reasons to use Alt-text doesn’t mean you should add it to all images. In fact, doing so can make for a poor user experience.
You should only add Alt-text to images that convey information or meaning, as opposed to images that are for decoration only.
Some examples of images that convey meaning are:
- logos,
- images of text,
- simple data graphics and
- images being used as hyperlinks or buttons.
How to Write Good Alt-text
Alt-Text Best Practices
Following are 10 best practices for Alt-text.
1. Understand the context of the image.
When writing Alt-text, you want to describe what is shown in the image. Writing good Alt-text requires understanding why the image is being included in the layout in the first place.
If it’s an image of text, such as a logo, that’s simple. You just include the text that appears in the image and may also want to include that it’s a logo.
If it’s a photograph though, it’s much more subjective. You want to describe what’s in the photo. But context is key.
Plus, Alt-text for the same image could be different between documents or web pages, depending on how it’s being used and what its purpose is.
So you have to ask yourself what you’re trying to convey with the image.
2. Don’t describe the image artistically.
In general, don’t describe the image in an artistic way. Take, for example, a bar chart. It would not be appropriate for Alt-text to say, “The blue bar in the chart shows 1,500. The green bar piece shows 5,000.”
The data, not the color, is important.
Not only that but someone who has had blindness or color blindness their entire life won’t know what the colors are.
Having said that, in some cases, such as describing an artist’s painting, it may make sense to describe the image artistically.
3. Keep it concise.
There is no set length for Alt-text.
You should understand that someone using a screen reader cannot pause the voicing of Alt-text. So if an image has extremely long Alt-text, it may be hard to understand. It may be overwhelming. That is the case, especially for complex infographics or data charts.
Limit the Alt-text to a few sentences. If that cannot be done, then other, more accessible and user-friendly means may be needed to adequately convey the information.
4. Avoid redundancy.
Don’t include the words “graphic” or “image.” A screen reader will already announce that it is an image.
But it may be important to say that the image is a logo, illustration, chart, etc. It depends on how the image is being used.
5. Don’t repeat the caption.
If the image has a caption, don’t repeat that same information in the Alt-text.
6. Give all users the same information.
Don’t put information that all users should get inside Alt-text. For example, don’t put an image credit line in Alt-text.
That limits who will get that information. That information should be shown to sighted users too.
7. Don’t include hyperlinks.
As a general rule of thumb, don’t include hyperlinks in Alt-text, especially long URLs. It can be OK to include short, easy-to-remember URLs.
This is because hyperlinks in Alt-text are not clickable.
8. Add a period.
Adding a period at the end of Alt-text is good practice because it will cause screen readers to pause, which makes it more user friendly.
9. Avoid keyword stuffing.
Yes, Alt-text can help your content’s SEO, but you don’t want to stuff the Alt-text with keywords just for that reason.
That can actually hurt your SEO, and it might sound silly to people using a screen reader.
10. Spell check the Alt-text.
When you add Alt-text, it’s not spell checked automatically. You may want to write it in another document and spell check it before copying and pasting it in to the image.
Free Alt-Text Guide
Want to find out more best practices for Alt-text, how to add Alt-text to images in InDesign and Word and on a WordPress website, and who should write Alt-text?
Thanks for the clarification, Colleen! I have had clients request keyword stuffing practices with their alt text. It’s good to know that technique is not appropriate and article to back up my position.
Hi, Kathy! Thanks for the comment. Sorry for the delay in responding.
I am glad you found this helpful. I appreciate you letting me know.