All About Alt Text

TL; DR: Alt text should be added to every image because it helps improve accessibility. When a picture is not informative, you should use the null set in the alt text field or check "decorative" to avoid irritating blind users with banal, unhelpful descriptions.

What is Alt Text?

The purpose of alt text is to represent the content and function of the image for visually impaired users. Accessibility software reads the alt text aloud since users can't see the image. When you don't enter alt text, the screen reader reads the image title, which is frequently unhelpful to a visually impaired person. 

When to Skip the Alt Text

If the image can be safely ignored by a screen reader without losing any content, as is the case with most stock photography, the alt text can be set to null (alt=""). Some CMS systems have a checkbox for "decorative" images, which functions exactly the same way. This designation tells the screen reader to skip over the image rather than reading aloud the file name—often an incoherent jumble of numbers and letters, like img0000000043532.jpg.

In most Cyberwoven sites, we apply the null set automatically on the back end to any alt text field that is likely to be decorative, so you can leave it blank in those cases. 

The following is an example from Web AIM’s excellent tutorial on alt text. Since the photo of the handshake does not represent important content, they recommend telling the screen reader to skip it, by using a null alt attribute (alt="") or marking it "decorative."

In current practice on the web, many such images are given descriptive alt text (ie: businessmen shaking hands) even though the image doesn’t provide useful content to the visually impaired reader.

When you should use Alt Text

• Any graphic with words on the image can use the words as alt text if those words aren't duplicated in the on-page copy—for example "October is Let's Talk Month"
•  Headshots of people can use the person's name as alt text
• Proper nouns of places can be used as alt text
• Product images can use the product name as alt text

Tips for Creating Great Alt Text

If you decide that the image does provide relevant content, use the following guidelines to craft the alt text:

• Make your alt text meaningful to your readers.
• Keep your alt text short—10 words or less.
• Avoid redundancy (don’t use adjacent body text as alt text).
• Don’t use “image of…” or “graphic of…” as alt text.
• If the image includes text, be sure to repeat it in your alt text.

SEO and Alt Text

In the past, some people thought that search engines used alt text in their page-ranking algorithms, which resulted in a lot of black-hat keyword stuffing. But none of the major search engines use alt text as a metric for scoring pages today.  

Search engines DO, however, use the information that alt text provides to determine the best images to return for a search query. Therefore, alt attributes are a great place to utilize keywords (if they are appropriate to the image) to help increase your chances of showing up in image searches.

For more specifics about choosing appropriate alt text, please check out Web AIM’s tutorial.