Alternative text (alt text): what it is and how to write it

What is alternative text (alt text)

Alternative text, or alt text, is a short text description attached to an image through the alt attribute of the HTML <img> tag. When an image can't be seen the alt text stands in for it and carries the same information to someone who would otherwise miss it entirely.

The point most people get wrong is that alt text doesn't describe what an image looks like, it describes what the image means in context: what it communicates, what function it serves, why it's there at all.

Alt text has existed since 1999, in the very first version of WCAG, and yet it remains one of the most neglected elements in modern web development despite how technically simple it is to add.

How alternative text works for screen readers

The text lives in the alt attribute, which normally isn't visible on the page itself.

A screen reader reads it aloud when it reaches the image in the page's reading order, so someone who can't see the image still learns what it shows or does, at exactly the point a sighted reader would encounter it.

If the image is also a link or a button, the alt text needs to describe the resulting action, not the visual appearance: a magnifying-glass icon used to search a site needs alt text like "Search the site," not "Magnifying glass icon."

Screen readers already announce on their own that an element is a link or a button, so repeating "link" or "click here" inside the alt text is redundant and should be avoided.

When the alt attribute is missing entirely — not empty, simply absent — many screen readers fall back to reading the file name instead, often an unhelpful string like IMG_4021.jpg or a long auto-generated upload path. That's bad UX because it adds noise without giving the listener any useful information.

How to write good alt text: best practices

Writing good alt text means picturing someone who will never see the image while the page is read aloud to them.

Here are some best practices:

• Describe the image's purpose in context: for an image illustrating a concept, describe the concept, not the framing or colors.

• Keep it short: usually one sentence, often within 125 characters, since some screen readers cut off longer text and an overly detailed alt text slows down listening.

• Skip phrases like "image of" or "picture of": the tag itself already tells assistive tech this is an image, so restating it wastes useful space.

• Don't repeat information already given in the surrounding text or caption: if a product photo already sits next to the product name in a paragraph, the alt text can focus on a different, complementary detail instead.

• If the image contains text — a promotional banner, a logo with wording — repeat that text verbatim in the alt attribute so a listener gets the same information a reader gets.

• End the alt text with a period: most screen readers pause briefly at punctuation, naturally separating the description from whatever content follows.

Alt text for specific cases

Not every image behaves the same way, and a few recurring categories call for handling that goes beyond the general rules above.

Alt text for decorative images

When an image adds no information to the content, the correct attribute isn't to omit alt, but to set it explicitly empty: alt="". Screen readers recognize this pattern and skip the image silently, while a missing attribute often forces them to read the file name instead, information with no value to the listener.

Alt text for charts and infographics

For complex visuals like charts, maps, or infographics, a one-sentence alt text rarely captures everything relevant. The standard approach is a brief alt summarizing the main takeaway — the chart type and the general trend in the data, for instance — paired with a fuller description in the surrounding text or an equivalent HTML data table, so someone who can't see the image gets the same data.

Alt text for logos and buttons

Logos are never purely decorative: they should always be described, spelling out any meaningful text or symbol they contain, such as "[Company] logo with the tagline [tagline]." For buttons and controls represented by an icon, the alt text should describe the action the button performs when activated, not the icon itself: "Print the document," not "Printer icon."

Alt text and image SEO

Beyond its accessibility role, alt text is also a signal search engines use to understand what an image shows because despite advances in automated image recognition, they still rely heavily on text and metadata to classify and index images in dedicated search (Google Images).

Well-written alt text can therefore support ranking for both the image and the page that contains it, giving crawlers extra context about the topic at hand.

That benefit doesn't justify keyword stuffing, though: cramming alt text with repeated keywords ("dog puppy labrador retriever cheap dog food") adds no real accessibility value and is treated by Google's algorithms as a spam signal, working against the ranking it's meant to help. The right approach stays a concise, accurate description that naturally includes one or two relevant keywords only when they genuinely describe the image.

How many sites still have missing alt text: the WebAIM Million 2026 data

Missing alt text remains one of the most common accessibility failures on the web, despite how technically simple it is to fix.

According to the WebAIM Million 2026 report, which analyzes the home pages of the top one million sites worldwide, 53.1% of home pages have at least one image missing alt text, and 16.2% of all sampled images lack it entirely out of an average of 66.6 images per home page, up 13.6% in a single year.

Among images that do have alt text, 10.8% contain questionable or repetitive descriptions, such as "image," "graphic," or a raw file name.

That places missing alt text among the six most common accessibility failures the report tracks, a ranking that has stayed essentially unchanged for seven consecutive years: a sign this is a well-known problem.

Alt text under WCAG and the EAA

Alt text is the very first success criterion in the Web Content Accessibility Guidelines (WCAG): Success Criterion 1.1.1, "Non-text Content," requires that every piece of non-text content have an equivalent text alternative. Precisely because it's one of the easiest requirements to check automatically, it's also one of the most frequently cited issues in US web accessibility litigation.

In Europe, alt text falls under the obligations set out in the European Accessibility Act (EAA), enforceable since 28 June 2025 for a wide range of digital products and services, which explicitly points to WCAG conformance as its reference standard.

FAQ about alternative text

Does every image need alt text?

No, purely decorative images can carry an empty alt="" attribute. It's required for informative images, buttons, image-based links, and anything that conveys meaning.

How long should alt text be?

Usually one sentence, often within 125 characters, since some screen readers cut off longer text. For complex images like charts, a short alt plus a fuller description elsewhere works better than one long alt attribute.

Does alt text help with SEO too?

Yes, alongside accessibility, alt text helps search engines understand what an image shows, which supports ranking in image search. It should be written for people, not stuffed with keywords.