Alt text is what the image says when the image isn’t there:
Alt text is a short text description attached to an image in HTML, written into the alt attribute of the <img> tag. It does a specific job. When a screen reader encounters an image, it reads the alt text out loud. When an image fails to load, the alt text appears in its place. When a search engine indexes the page, the alt text is part of what it reads to understand the image.
That triple function — accessibility, fallback, machine readability — gives alt text its weight. The same string of words serves three audiences who experience the page differently and need the same piece of information.
The mistake is treating alt text as an SEO field to fill in. It isn’t. It’s a writing task. The page is making a claim about what an image contributes, and the alt text is how that claim survives when the image doesn’t.
Imagine the page without the picture — what’s missing?:
The clearest way to write good alt text is to imagine the page with the image removed. What information just disappeared? That’s what the alt text needs to put back.
A product page shows a photograph of a black running shoe with white stripes. Image removed, the reader knows there’s a running shoe for sale, but the visual specificity is gone. Alt text should restore the specificity: “Nike Air Zoom Pegasus 40 in black with white stripes” puts back what the photo was contributing. “Running shoe” doesn’t.
A blog post about productivity includes a stock photo of a person at a laptop drinking coffee. Image removed, nothing important is missing — the photo was decorative. Alt text here doesn’t need to describe the photo at all. An empty alt attribute (which the next section covers) tells the screen reader to skip it.
This is the substitutability test. Read the surrounding text without the image. If something essential is missing, the alt text restores it. If nothing is missing, the alt text doesn’t need to describe what the eye sees — it needs to acknowledge that the image is decorative.
Google’s technical writing guidance frames this as context dependency. The same photograph might warrant different alt text on different pages, because the page context changes what the image is doing. A picture of a chickadee on a snowy branch on a birdwatching page might be described as “a black-capped chickadee perched on a snowy branch.” On a page about mixed-species bird flocks, the same image might be described as “a chickadee, the typical leader of a mixed-species winter flock.” Same picture. Different page context. Different alt text.
Write what the image means in context, not what it depicts in isolation:
A common failure mode is writing alt text that describes the picture as if the description had to stand alone. Color, composition, every visual detail. That’s what an art catalog does. A web page isn’t an art catalog.
Take the chickadee example from above. A description like “a small bird with a black cap, white cheeks, and gray wings, perched on a snowy branch, with another snowy branch in the background” is overlong. The accuracy is fine, but the length isn’t doing useful work. The alt text isn’t replacing the visual experience for a sighted reader. It’s restoring the information loss for a reader who can’t see the image at all.
Two before-and-afters:
A picture of a chart showing quarterly revenue growth.
Too descriptive: “A bar chart with four blue vertical bars of increasing height labeled Q1, Q2, Q3, Q4. Revenue figures on the vertical axis range from zero to ten million.”
Better: “Quarterly revenue grew from $4M in Q1 to $9M in Q4.”
A photograph of a person using a Google Cardboard VR viewer.
Too descriptive: “Person wearing gray and white striped shirt with orange cuffs, holding Google Cardboard viewer in front of eyes, with teeth exposed.”
Better: “Person looking into Google Cardboard viewer and smiling.”
The second versions are shorter, but the point isn’t length. The point is purpose. A description sized to the role the image plays on the page.
One sentence, declarative, no setup, end with a period:
The writing mechanics of alt text are tighter than most prose. Five rules cover the practical guidance.
Keep it short. WCAG itself doesn’t set a character limit — the standard is that the text serves as an equivalent for the image’s purpose. In practice, most accessibility guides converge on roughly 125 characters as a working upper bound. The reason is rooted in older JAWS behavior, which divided alt text into 125-character chunks. Modern screen readers handle longer alt text differently across versions and platforms. The 125-character convention persists anyway. It produces alt text that stays coherent across the widest range of assistive technology. For complex images that need more, the right answer isn’t longer alt text — it’s a short alt with detail provided elsewhere on the page.
Skip the setup. Don’t start with “Image of,” “Picture of,” or “Photo of.” Screen readers already announce “image” or “graphic” before reading the alt text. Starting with “Image of a chickadee” makes the screen reader say “graphic, image of a chickadee” — a redundant double announcement. Start with the subject directly.
Be specific. “Dog” is weaker than “black Labrador retriever puppy.” “Chart” is weaker than “Revenue grew 40% year over year.” The specificity isn’t padding — it’s the information the alt text exists to provide.
Skip duplicate text. If a caption or adjacent paragraph already describes the image fully, don’t restate it in alt text. The page would otherwise read the same content twice. Either reduce the alt text to a brief identifier or use an empty alt attribute when the surrounding text covers the image completely.
End with a period. Screen readers pause at periods. The period creates a small auditory break between the alt text and the body text that follows. It isn’t technically required by HTML, but it improves how the page sounds when read aloud.
A note on tone. Alt text reads better when it’s declarative — stating what is — rather than narrative. “A chickadee perches on a snowy branch” is alt text. “We can see a chickadee that is perching on a snowy branch” is prose. The first sounds right when a screen reader speaks it. The second sounds like the page is narrating itself.
Different jobs, different alt strategies:
Not every image does the same job on a page. The right alt text depends on which kind of image is being described.
| Image type | What it does | Alt text approach |
|---|---|---|
| Informational | Adds meaning the surrounding text doesn't fully cover | Describe the information the image contributes |
| Decorative | Adds visual texture without information | Empty alt attribute (<!–INLINECODE2–>) |
| Functional | Acts as a link or button | Describe the action or destination, not the image |
| Complex (chart, infographic, diagram) | Carries data the text doesn't restate | Summarize the takeaway; provide detail in body text or a longer description |
| Text-in-image | Reproduces text that appears inside the image | Transcribe the text exactly |
For functional images, the rule shifts. When an image is the link, Google uses the alt text as the link’s anchor text. A magnifying glass icon that opens a search box shouldn’t have alt text reading “Magnifying glass” — it should read “Search,” which is what the link does. This is the connection back to the anchor text discipline: the alt text on a linked image plays the same role descriptive anchor text plays on a text link.
For complex images, alt text alone isn’t enough. A chart with twelve data points and three trend lines can’t be summarized in 125 characters. The accepted pattern is short alt text that names the takeaway (“Revenue grew sharply after Q2, then plateaued”). The granular data lives in the body text or a linked data table. The alt text handles the headline. The detail lives elsewhere on the page where it can be read in full.
When an image is purely text-in-image — a logo with a brand name, a button that says “Submit,” a diagram with text labels — the alt text reproduces the text. The screen reader user needs the same words the sighted reader sees.
Decorative images and the empty alt attribute:
Not every image needs descriptive alt text. Some images are purely decorative. Visual texture, mood, page rhythm. They add no information that a sighted reader extracts. For these images, alt text isn’t supposed to describe them — it’s supposed to mark them as skippable.
The mechanism is the empty alt attribute:
<img src="decorative-flourish.jpg" alt="">Two important details about that markup. First, the alt attribute is present — the image isn’t missing the attribute, it has an empty value. Second, there’s nothing between the quotes, not even a space. An assistive technology that encounters alt="" knows the image is decorative and skips announcing it entirely.
This matters because the wrong move would be to describe a decorative image anyway. A stock photo of a person at a laptop on a productivity blog post adds nothing the article doesn’t already say. Reading “person sitting at a laptop drinking coffee” out loud to a screen reader user interrupts their reading. The actual article continues underneath a description of an image that wasn’t contributing anything. The empty alt is what respects the reader’s attention.
Decorative is a narrower category than the visual sense of the word suggests. The test isn’t “is the image just a picture” — it’s “does the image carry information the page needs.” Some stock images are decorative (the laptop-and-coffee photo on a productivity post). Others are informational, even when generic (a stock photo of a workflow diagram on a process post). The substitutability test settles it. Imagine the page without the image. If no information is lost, the image is decorative. If something is missing, the image is informational and needs alt text describing what it contributes.
ARIA labels are a separate accessibility layer that overrides alt text in specific cases (interactive widgets, custom components). For most images on a typical page, the alt attribute is the right control.
Screen readers don’t see images — they read alt out loud:
For the visual experience, an image is immediate. The reader sees it and processes it without separating the seeing from the understanding. For a screen reader user, the image is mediated entirely through the alt text. The reader hears the alt text, and that’s the image.
This changes what alt text needs to do. A sighted reader’s eye can take in a picture and decide whether to look more carefully or move past. A screen reader user gets one pass — the alt text reads at the reading speed they’ve set, and then the page continues. There’s no “looking more carefully.” The alt text is the complete experience of the image.
This also affects pacing. Screen reader users navigating long pages often skip from heading to heading or from link to link, using shortcuts to scan structure. Within those navigation modes, alt text appears when the reader’s cursor lands on an image. If the page has dozens of decorative images with descriptive alt text, the reader hears each one announced. That’s a stream of descriptions interrupting the flow of the actual content. This is why the empty alt attribute matters operationally, not just theoretically.
There’s a related point about link lists. Screen readers can pull up a list of all the links on a page for quick navigation. When an image is a link, the alt text appears in that list. A page with five image links labeled “Image” gives the reader a list of five identical, useless entries. The same page with alt text like “Search,” “Account,” “Cart,” “Help,” “Sign out” gives the reader a usable index. The same care that goes into descriptive text-link anchors applies to image-link alt text — they sit in the same screen reader output.
Three labels, three audiences, one image:
An image on a web page often has more than one piece of text associated with it. Alt text is the primary control. It works alongside captions and filenames. Longer descriptions enter the picture when an image is complex enough to need them. Each element does a different job.
| Element | Where it lives | Who reads it |
|---|---|---|
| Alt attribute | Inside the <!–INLINECODE5–> tag, not displayed visually | Screen readers, search engines, fallback when image fails |
| Caption | Visible text below or beside the image | All readers — sighted and screen reader users |
| Filename | The actual file path (e.g., <!–INLINECODE6–>) | Search engines, used as a weak signal |
| Title attribute | Tooltip on hover in some browsers | Sighted mouse users only — not reliable for accessibility |
| Long description | Linked detailed description for complex images | Users who need granular data |
The captions and alt text shouldn’t repeat each other. If the caption already says “Quarterly revenue grew from $4M to $9M,” the alt text doesn’t need to say the same thing again. A screen reader user would hear the same line twice. The accepted pattern is brief alt text identifying the image type (“Revenue chart”) with the caption carrying the descriptive content visible to all readers.
Filenames are a smaller signal. Google’s documentation notes that filenames contribute to image understanding, though far less than alt text and surrounding page content. A filename like nike-pegasus-40-black.jpg is better than IMG_4729.jpg for the same reasons a clean URL is better than a query string — readability, descriptive content, machine parseability. But filenames aren’t a substitute for alt text. They’re a small addition to it.
Alt text is how Google reads pictures:
For search engines, alt text serves as one of several inputs that explain what an image is about. Google’s Search Central documentation states it directly: alt text is the primary metadata signal for image content, used alongside computer vision algorithms and the surrounding page content.
The practical SEO effect comes in two places. Image search is the first. Google Images surfaces results based partly on alt text. A site with descriptive, accurate alt text on its product images can show up in image search results when someone searches for the products. A site with empty or generic alt text doesn’t.
The second effect is on-page relevance. Alt text counts as part of the page’s text content for ranking purposes. Mueller has confirmed alt text is indexed as on-page text. This doesn’t make alt text a major ranking lever — it isn’t. But it contributes to the page’s overall topical signal in the same lightweight way URL words and anchor text contribute.
The mistake here is the same mistake the rest of SEO writing makes: treating alt text as a keyword field. Stuffing alt text with keywords (“puppy dog baby dog pup pups puppies doggies pups litter”) was the canonical example Google used in its documentation of what not to do. Modern Google’s computer vision can identify a puppy in an image without help. What it can’t do — and what alt text is for — is know what the image means in the context of the page.
Multimodal AI systems add another layer to this. AI Overviews and answer-generation systems extract image meaning from a combination of alt text and surrounding content. Computer vision contributes too. How much weight each signal carries inside these systems isn’t publicly documented, and the effect of alt text on AI citation behavior is hard to measure directly. The plausible mechanism is that alt text gives AI systems a verified textual handle on what an image contains, which is one input among several. Worth doing carefully. Hard to attribute to specific outcomes.
Seven alt text anti-patterns:
Most alt text problems on real sites cluster into a small set of patterns. Each has a clean fix.
- Empty alt on informational images. A product photo with
alt=""because someone wanted to “fix” an accessibility warning by stripping the value. Fix: distinguish decorative from informational. If the image carries information, describe it. Empty alt is for purely visual elements.
- “Image of” or “Picture of” prefix. Screen readers already announce the image as a graphic. Adding “Image of” makes the announcement redundant. Fix: start with the subject directly. “Image of a black-capped chickadee” becomes “Black-capped chickadee perched on a snowy branch.”
- Filename as alt text.
alt="IMG_4729"oralt="puppy-dog-final-v2.jpg". The CMS auto-populated the field from the filename and no one rewrote it. Fix: rewrite every auto-generated alt text. The filename and the alt text are different fields with different jobs.
- Keyword stuffing.
alt="puppy puppies dog dogs cute dog photos best dog breeds". Google’s documentation calls this out specifically. Fix: describe the image once, accurately, in normal language. Keywords appearing naturally in a description are fine. Strings of keyword variations are not.
- Alt text identical to caption. A chart with the caption “Quarterly revenue grew from $4M to $9M” and alt text “Quarterly revenue grew from $4M to $9M.” Screen reader users hear the same line twice. Fix: use brief alt text that identifies the image. Let the caption carry the descriptive content.
- Generic alt for product images. An e-commerce site with hundreds of product photos all labeled
alt="product". Fix: write product-specific alt text — brand, model, color, key feature. The alt text is the difference between a screen reader user being able to navigate the store and not being able to.
- Missing alt attribute entirely. No
alt=""even, just<img src="...">. Some screen readers fall back to reading the filename or skipping the image with no warning. Fix: every<img>tag gets an alt attribute. Decorative images getalt="". Informational images get a description.
An eighth worth flagging: alt text that describes the wrong meaning. A photograph of two people shaking hands on a page about contract negotiations doesn’t need alt text reading “two people shaking hands.” It needs alt text reading “executives signing partnership agreement” or whatever the image actually communicates in context. The literal description is accurate. The contextual description is correct.
Alt text is a writing job, not a checkbox:
A site with thoughtful alt text on its images is a site that takes its readers seriously — all of them. The screen reader user who needs the description. The sighted reader on a slow connection who sees the fallback text load before the image does. The search engine indexing the page. The AI system extracting structured meaning. The accessibility audit that compliance requires.
The work is mostly editorial. Look at the image. Decide if it’s informational, decorative, or functional. Write what the image contributes — in context, in one sentence, without “image of,” ending with a period. For decorative images, use the empty alt attribute. For complex images, write a short summary and let the body text or a linked description carry the detail.
None of this requires unusual tooling. Most CMS platforms expose the alt attribute in the image upload field. Most accessibility auditing tools flag missing alt text automatically. The work is recognizing that the alt text field is a writing task — not a checkbox to silence a warning, not a keyword bucket to optimize. It’s the words the page says when the picture isn’t there. That’s the whole job.