Writing Alt Text

Alt Text

Contact Carter Sargent for questions or comments. For more examples, click here.

What is Alt Text?

Alt text is the written alternative to visual information used by screen readers. It is not simply a description of the image, it is a description of what the image conveys. All images must have descriptive alt text. Keep it short and straight to the point. When you write alt text think of the following:

• Why did you include this image? What does the image convey or enhance?

  • If the image is decorative, like a sparkle or a pretty layout design, the alt text should be an empty string (“). There still needs to be an alt attribute set to a value (“”).

• Who is present in this image? Is race, gender, disability, or religion a component?

  • Do not only describe the ethnicity or gender of non-white and non-male individuals. If this is a relevant part, it should be relevant to all parties equally.

• How short can you make the description?

  • A screen reader gives out a lot of information, and it can be overwhelming. Is it important to tell the user the sky is blue? Or that the woman is wearing a yellow shirt? Keep the description relevant to the important information the image conveys.

• Is context given? What does the image represent?

  • If something is a logo, call it a logo and give the company name. The logo components (font, color, etc) are irrelevant to the alt text. Do not say “red x” when it represents an exit or “magnifying glass” when it represents a search function.

• Do not use phrases like “image of” or “in the image”. The screen reader makes it clear that the content is from an image, and therefore this is redundant.

  • Because screen readers give so much auditory information, reducing redundancies is incredibly important to maintain meaning.