Do it yourself: websites

How to write alt text, with examples

Alt text (alternative text) is the description a screen reader reads in place of an image. It’s also what search engines read, and what appears when an image fails to load. Missing alt text is one of the most common accessibility failures on the web — and one of the most commonly cited in lawsuits.

The one question to ask

If I replaced this image with text, what would I write so the reader doesn’t miss anything?

Alt text describes the image’s purpose in context, not every visual detail. The same photo can need different alt text on different pages.

Examples by type

Informative images

The image adds information to the content.

  • Weak: alt="dog"
  • Better: alt="Golden retriever wearing a guide-dog harness, leading its owner across a crosswalk"

Product photos

Describe what a shopper would want to know that the product name doesn’t already say.

  • Weak: alt="shoe" or alt="IMG_2231.jpg"
  • Better: alt="Trail runner in navy with orange laces, side view showing the lugged sole"

Describe the action, not the picture.

  • A magnifying-glass search button: alt="Search" (not “magnifying glass”)
  • A logo that links home: alt="xsibility home"
  • A printer icon: alt="Print this page"

Decorative images

Purely visual flourishes — dividers, background textures, stock photos that add nothing — should be silent:

<img src="divider.svg" alt="">

Use an empty alt attribute. Never omit it entirely: without alt, many screen readers read the file name instead.

Images of text

Avoid them — real text scales, reflows and can be translated. If you must use one (a logo, a quote graphic), the alt text must contain the same words.

Charts, graphs and infographics

Give a short alt that states the takeaway, and put the data in a table or text nearby.

  • Alt: alt="Bar chart: federal website accessibility lawsuits rose to 3,117 in 2025, up 27% from 2024. Full data in the table below."
  • Then provide the numbers in an accessible table.

Logos

alt="Company name" — or “Company name home” if it’s a link. Not “logo.”

Images that are also described in the text

If the caption or adjacent text already says everything, keep alt text short or use empty alt to avoid repetition.

Alt text in PDFs and documents

The same rules apply in Word and PDFs. In Word, right-click the image → View Alt Text, or tick Mark as decorative. In Acrobat Pro, use Accessibility → Set Alternate Text, or set it on the <Figure> tag. See how to make an accessible PDF.

A quick review routine

  1. Use the WAVE browser extension or turn off images to see your alt text in place.
  2. Read each alt out loud with the surrounding text. Does it make sense? Is anything missing or repeated?
  3. Check icon buttons in particular — they’re the most commonly missed.

Frequently asked questions

How long should alt text be?

As short as possible while conveying what matters — often under 125 characters. Complex images like charts need a short alt plus a longer description elsewhere on the page.

Should alt text start with 'image of'?

No. Screen readers already announce that it’s an image. Mention the medium only when it matters, like ‘Painting of…’ or ‘Screenshot of the login error.’

Can AI write our alt text?

AI tools can draft descriptions, but they don’t know why an image is on your page. A person should review every one: the right alt text depends on context, not just what’s in the picture.

Find out where you stand, in writing.

Send us a few URLs or sample PDFs. Within two business days you get a free, plain-English snapshot of your biggest accessibility risks and what it takes to fix them.