Writing Alternative Text
(This page includes general instruction about what alternative text is, and why it is crucial. See the links at the bottom of the page for practical, hands-on advice on how to create alt text in WordPress.)
When to Write Alt Text
All images on our website should have alternative text associated with them, unless they are strictly decorative images. If the image is being used to convey information, even simple/basic information, it should have alt text. However, if the image is strictly decorative, it is best to leave the alt text blank.
How to Write Alt Text
The image below is the masthead image on this site’s homepage. Let us consider the scene and write some alt text together.
Example 1 ❌
“A picture of some trees”
One common mistake people make when writing alt text is to announce that they are describing a picture.
This is not helpful to a screen reader – in fact, screen readers generally announce in some way that they are about to read the text describing an image, so saying “a picture of” or “a photo of” is unnecessary.
Example 2 ❌
“Home page header image”
It is also important to consider the photo separate from the context of the page in which it appears. You should simply describe the relevant parts of the photo.
Example 3 ✅
“On the PC Campus, a statue of St Martin de Porres overlooks a Koi pond, with spring trees and flowers in bloom.”
This language meets all the criteria for properly written alternative text.
How to Leave it Blank (decorative images)
See the link below on How to Add Alternative Text in WordPress for specific instructions on how to treat decorative images.
Text in Images
Unless it is expressly required, do not overlay text on your images. It typically will not scale well between mobile, tablet, laptop, and desktop screen sizes, and the text is not available to screen readers. However, if you absolutely must use text in an image, you are required to make sure that all information in the image is conveyed through the alt text.
Resources for great alt text
- There are many good and interesting guides to writing alt text. One of the most useful is the “alt decision tree” published by the w3.org.
- Moz, an SEO group, has several good examples for what makes a good and bad alt text.
- The Penn State guide is simple, and quickly communicates the important details about writing alt text.
