On This Page
About ALT Text
ALT Tags are invisible descriptions of images which are read aloud to blind users on a screen reader. Adding ALT text allows authors to include images, but still provide the content in an alternative text based format. See example below for what a screen reader experiences when no ALT Text is used.
Because this page has no image ALT tags, it is unusable when images fail to display.
Note: Nittany Bus Depot is a fictional company.
If no ALT tags are provided, then a screen reader would only be able to say "IMAGE" or perhaps provide a file name.
WCAG 2.0 Guideline 1.1.1—"All non-text content that is presented to the user has a text alternative that serves the equivalent purpose."
This page provides general guidelines on what kinds of text to use in an ALT tag. For specific steps within a specific tool, please select a link within the links in the “ALT Text How To” section.
Accurate, Concise Description
It’s important to not only provide an ALT tag, but also provide one that is useful in the context of the document. You may not need to include every artistic detail, and you may be able to skip over purely decorative images, but those that contain critical information need to have it to spelled out in the ALT text.
Infographic Example
Consider an graphic at an e-commerce which includes two credit card company logos. If you need to know which credit cards are accepted, which would be the better ALT text?
Select Preferred ALT Text for Credit Card Logo
- ALT="Credit Card Logos" (which ones?)
- ALT="Vidi-Visi and Magic Card accepted." (conveys specific cards)
Artistic Example
Consider this painting of George Washington at Valley Forge (Picture from Library of Congress).
When thinking of an ALT tag, the task would be to consider WHY the image is included. Is it within a history course? a course on climatic history? Is the point of the image to show how solidiers were dressed or that LaFayette was at Valley Forge?
The answer could affect how you write the ALT text.
Possible ALT Text for George Washington Painting
- ALT = "George Washington at Valley Forge" (most succinct)
- ALT = "George Washington and Lafayette on horseback talking to soldiers in snow at Valley Forge" (more detailed)
- ALT = "Valley Forge in winter. The landscape is snow covered and soldiers are sitting by the open road with a camp fire.” (emphasizing climate)
Hint on long descriptions: If a description is very technical it may be worth including it in the main text so that all readers can benefit.
Decorative Image Empty ALT Text
A decorative image is one used to enhance the mood of a document, but not to convey actual information. Decorative images can include tool bars, clip art, photographs to add "color" and repetitions of a logo. Even the picture of George Washington above could be considered decorative if it is not directly connected to events at Valley Forge, but part of a more generic page.
Decorative Images do need an ALT Tag, but the ALT tag can be empty (ALT="", best for Web) or a blank space (ALT=" " best for Microsoft Office or a CMS). Both are valid but produce slightly different results across environments.
Caption vs. ALT Text
When creating ALT text, it’s important to remember that it should describe the image. It should NOT include information about copyright or any extra information that would be relevant to a seeing audience.
See example below
Painting is by John Dunsmore ca. 1907 and shows both George Washington an the Marquis de Layfayette on horseback. Note small cabins in the background. Image from Library of Congress
ALT Text = George Washington on horesback in winter Valley Forge
Complex Images and Long Description
ALT tags are generally recommended to be concise (about 125 characters). However, some images are so complex that more information may be needed. Today, most experts recommend including an ALT tag which refers blind users to a text based description elsewhere which is visible to everyone.
See the Images section for different examples.