Alternative text, or alt text, is the descriptive word or phrase read by screen readers in the place of an image, allowing its content and function to be conveyed to those with visual impairments. It also replaces an image when a browser doesn’t load, and it can help search engines identify an image’s content. In other words, alt text makes images accessible across devices and abilities.
When it comes to writing good alt text, context is everything. In certain cases, you will need more description than others, and some images won’t need alt text at all.
Take this photo of Clark Hall, for example:
On a page about the College of Arts & Sciences, you might use the ALT text “Clark Hall” or “Clark Hall, home of the College of Arts & Sciences,” depending on the image’s function and whether that information was already conveyed in your main text.
If the page describes the building’s architecture, you might include additional details: “Cathedral glass in Clark Hall.”
In general, alt text should be concise, capturing the image’s purpose and most important details.
Decorative images like logos, lines, or photos that do not actual convey information do not require alt text.
Caption versus ALT Text
The caption field should be used for information about copyright or the photo (e.g., source, location, photographer, etc.).
When to use a description
Some images, like charts or graphs, are more complex and may require detailed descriptions. In this case, the ALT text should be brief, describing only the most salient details, and a longer description would be provided in the description field. The screen reader will inform the user the description exists, and the user will decide whether he wants to hear the information.