Field Notes
All posts

Alt text that actually helps

Describing an image well is a writing skill. A few rules make it much easier.

What alt text is for

Alternative text is read aloud by screen readers in place of an image, shown when an image fails to load, and used by search engines to understand what an image contains. Its job is to convey whatever the image contributes to the page, in words.

That last part is the key. Alt text is not a description of the image in isolation. It is a description of what the image means in this context.

Context changes the answer

The same photograph of a woman at a desk might need entirely different alt text depending on where it appears:

  • On a team page: "Priya Shah, head of design."
  • In an article about ergonomic setups: "A desk with the monitor at eye level and a keyboard tray below the desk surface."
  • As a decorative header on a blog post about productivity: nothing at all.

Decorative images

Images that add no information should have an empty alt attribute, alt="". This tells screen readers to skip them. Omitting the attribute entirely is different and worse: many screen readers will read out the file name instead.

Decorative includes background textures, flourishes, and photos that merely illustrate a mood already conveyed by the text.

Informative images

For images that carry meaning, a few guidelines help:

  1. Be concise. A sentence or two is usually enough.
  2. Skip "image of". Screen readers already announce that it is an image.
  3. Front-load the important part. Listeners may move on before the end.
  4. Include text that appears in the image, such as a sign or a headline in a graphic.

Functional images

When an image is a link or a button, the alt text should describe the action, not the picture. A magnifying glass icon that submits a search should have alt text of "Search", not "Magnifying glass".

Complex images

Charts, diagrams and infographics carry more information than a short alt attribute can hold. Give them a brief alt text that states the main takeaway, and provide the full data nearby in text or a table.

Make it part of publishing

The best place to write alt text is at the moment of uploading, by the person who chose the image and knows why it is there. A content system that prompts for it, and lets authors mark an image as decorative explicitly, produces far better results than a later audit.