Alt text

Alt text — short for “alternative text” — is the textual description of a non-text image embedded via HTML’s alt attribute. It’s the single most-discussed accessibility feature on the web, and the one with the most consistent failure pattern: developers either omit it entirely or generate generic placeholders that convey nothing.

What it actually does

Three audiences consume alt text:

1. Screen-reader users. The screen reader announces the alt text in place of the image. If the image conveys information (“the chart shows lawsuits doubled between 2022 and 2025”), that information has to be in the alt or in an adjacent caption.
2. Sighted users on broken images. When an image fails to load, the alt text appears in its place — a small but real fallback.
3. Search engines. Alt text is one of the few rank-relevant signals for what an image actually contains.

The decision tree

Every image you ship needs an explicit answer to “what kind of image is this?”:

• Functional image — an icon used as the only visual cue for a button or link. Alt describes the action, not the icon: alt="Open menu", not alt="hamburger icon". The user doesn’t care that it looks like a hamburger; they care what tapping it does.
• Informative image — a photo, chart, screenshot, or illustration that conveys content. Alt describes the conveyed information at the right level of detail. A staff photo on an “About us” page: alt = “Dr Jane Doe, Director of Research.” A statistics chart: alt = the takeaway, with the underlying data either in a caption or in a nearby table.
• Decorative image — patterns, dividers, abstract photos used as background flourish. alt="" (empty, but the attribute must be present) tells screen readers to skip it.
• Complex image — diagrams, infographics, dense charts. Short alt for the headline takeaway, plus a longer description nearby (aria-describedby to a paragraph, or an adjacent expandable “Full description” disclosure).

What goes wrong in production

Three failure modes account for most alt-text bugs:

• Missing entirely. <img src="..."> with no alt at all. Screen readers announce the image’s filename, which is almost always garbage.
• Filename or junk — alt="DSC_0042.jpg" or alt="image". Less bad than missing, more confusing than helpful.
• Over-described decorative content. A purely-aesthetic divider with alt="Abstract orange and red flourish across the top of the section" forces the screen reader to read it and gives the user nothing.

AI-generated alt text

Most modern image-upload pipelines now auto-suggest alt text via a vision model. This is genuinely helpful as a first draft, but two cautions:

1. The model can be confidently wrong, especially on charts, diagrams, and culturally-specific content. Hand review every suggestion before shipping.
2. Generated alt should not silently overwrite an existing hand-written alt. Many accessibility overlay products fail badly on this — they replace careful editorial alt with bland generic descriptions.