Contact

What is Alt Text?

Definition

Alt text is the short text placed in an HTML image's alt attribute that stands in for the image when someone cannot see it. It is written first for screen reader users and for cases where the image fails to load; search engines also use it to understand what an image shows. Purely decorative images get an empty alt attribute (alt="") so assistive technology skips them.

Also known as: alt attribute, image alt attribute, alt tag, alternative text, alt description

Diagram showing an img alt attribute serving screen readers, image search and fallback text when the image fails to load

Accessibility comes first

The primary audience for alt text is someone listening to the page through a screen reader. When the reader reaches an <img>, it announces the alt attribute, not the picture. That is why WCAG success criterion 1.1.1, Non-text Content (Level A), requires that all non-text content presented to the user has a text alternative serving the equivalent purpose, with defined exceptions for decoration, CAPTCHAs, controls and a few other cases. Browsers also show alt text when an image fails to load, on a poor connection or with images turned off.

Treat alt text as part of web accessibility rather than as an SEO field. The search benefit follows naturally from a description that genuinely helps a person.

Describe the job the image does on this page

The right alt text depends on context. The same photo might illustrate a product on one page and a news event on another. A useful test: if you had to describe this image to someone over the phone so they could follow the page, what would you say?

ContextWeakBetter
Product photoshirtNavy linen shirt with button-down collar, front view
Logo that links homelogo.pngCompany name – home
Process diagramdiagramShipping process in three steps: order, packing, delivery
Team photoimageProject team in a planning meeting at the office

Skip openers such as "image of" or "picture of": screen readers already announce that it is an image. Do not copy the caption underneath word for word, or the same sentence is read twice. For complex charts, keep the alt text to a short summary and put the actual numbers in the surrounding text or a data table.

Decorative images: empty is not the same as missing

Divider lines, background flourishes and icons that repeat adjacent text carry no information. They still get an alt attribute, but an empty one, so assistive technology ignores them entirely. Leaving the attribute out has a different effect: as the W3C decorative images tutorial notes, some screen readers will then announce the file name instead.

<!-- Informative image -->
<img src="shipping-process.png" alt="Shipping process in three steps: order, packing, delivery">

<!-- Decorative divider: alt present but empty -->
<img src="wave.svg" alt="">

<!-- Wrong: no alt attribute at all -->
<img src="wave.svg">

Purely decorative graphics can also be applied as CSS backgrounds, in which case no <img> element exists in the markup at all.

What search engines do with it

Google's image SEO documentation says it uses alt text together with computer vision and the page's content to understand what an image is about. When an image is a link, its alt text plays the role that anchor text plays for a text link, describing the destination. The same document warns that filling alt attributes with keywords creates a poor experience and may cause a site to be seen as spam, which is simply keyword stuffing applied to images. File names, dimensions, formats and nearby text are covered under image SEO.

What to look for in an audit

  • Missing alt on images that carry content.
  • File names or camera counters such as IMG_1234.jpg, which tell nobody anything.
  • Identical text on every image: ten gallery shots all labelled with the product name lose what makes each one different.
  • Library defaults out of context: alt text saved once in a CMS media library may not fit every page the image is reused on.
  • Untranslated alt text on multilingual sites, where images are shared but descriptions should exist per language.

The SEO Checker lists images with missing, empty or file-name alt text per page. Whether an empty alt really belongs to a decorative image is still a judgement a person has to make.

Related terms

← Back to the glossary