Alt text, short for alternative text, is a written description of an image that screen readers speak aloud for blind and low-vision users and search engines read to understand what the picture shows. It lives in the alt attribute of the img tag, renders on the page when the image fails to load, and has quietly become a legal matter: US accessibility law now points at a standard whose first requirement is a text alternative for every image that means something. This post covers the jobs the attribute does, the law as it stands in 2026, how to write descriptions that work, when to leave the attribute empty, the edge cases that trip real sites, and how alt text feeds AI search.
The short version
- Alt text describes an image for screen readers, search engines, and AI systems.
- Describe what the image shows and why it is on the page, in 125 characters or less.
- Decorative images get an empty alt attribute. A missing attribute is the only wrong answer.
- WCAG 2.1 AA, now written into US regulation, makes text alternatives its first success criterion.
- Never start with "image of," and never stuff keywords into it.
What the attribute is and where it goes
The syntax is a single attribute on the image element:
<img src="dog-frisbee.jpg" alt="Golden retriever jumping to catch a red frisbee in a park">
<!-- Decorative image: present but empty, so screen readers skip it -->
<img src="divider-flourish.svg" alt="">Every mainstream platform exposes a field for it. WordPress calls it Alternative text in the media library and the image block sidebar, Shopify puts an alt field on every product image, and Wix and Squarespace surface it in image settings. The work is rarely technical. It is editorial, which is why it gets skipped: the WebAIM Million report for 2026 found 16.2% of images on the top million home pages missing alt text entirely, and more than half of those pages carrying at least one such image.
The four jobs one attribute does
Accessibility is the original job and still the most important one. A screen reader reaching an image can only say what the alt attribute gives it; with nothing there, some announce the file name, so a user hears IMG underscore 4532 in the middle of your sales page. The second job is search. Google states that alt text is among the main signals it uses to understand what an image shows, which is the raw material of image search rankings, and the words also add context to the page itself. Third, the text renders in place of the picture whenever a file breaks or a connection stalls, keeping the page readable. The fourth job arrived with AI: models that answer questions about the web ingest alt text as the human-written label attached to your visuals, so a chart with an honest alt line is a chart an AI answer can describe accurately, sourced to you.
The law caught up with alt text
In 2024 the Department of Justice issued a final rule under ADA Title II requiring state and local government websites and apps to conform to WCAG 2.1 Level AA, and after a one-year extension the deadlines now stand at April 2027 for larger public entities and April 2028 for smaller ones. Text alternatives for non-text content are success criterion 1.1.1, the first requirement in the standard. Private businesses are not named by that rule, but lawsuits under Title III have used WCAG as the working benchmark for years, and missing alt text is among the easiest findings for a complaint to cite because automated scanners catch it instantly. Writing honest alt text will not make a site compliant by itself. Skipping it hands any reviewer their first exhibit.
How to write alt text that works
- Describe what the image shows and why it is there. "Dog" is vague. "Golden retriever puppy sleeping on a blue couch" tells the truth in detail. The page context decides which details matter.
- Keep it under 125 characters. Longer usually means padding, and some screen readers chunk long descriptions awkwardly. Be specific, then stop.
- Skip "image of" and "photo of." Screen readers already announce that it is an image, so the phrase wastes the opening words twice over.
- Include a keyword only when the image genuinely shows it. If the photo is your target topic, name it naturally. Forcing one into an unrelated picture reads as spam to Google and as gibberish aloud.
- Give charts their conclusion, not their coordinates. "Organic traffic rising from 2,000 to 5,000 monthly visits over 12 months" beats a recitation of data points. Put the full data in the page text.
- Match the context. The same photo needs different alt text on a product page than in a tutorial, because its job on the page changed.
- Do not repeat the caption. If a visible caption exists, alt text should add information or, when the caption says everything, the image can carry an empty alt.
Before and after across the image types
- Before. alt="shoes". True but useless. It could describe half the store, and it ranks for nothing.
- After. alt="Nike Air Zoom Pegasus 40 men's running shoes in black and white". Brand, model, product type, color. Useful to a shopper who cannot see the photo and to an engine ranking it.
- Before. alt="IMG_4532.jpg". A file name describes nothing. This is what auto-populated alt fields often contain, and it is what gets read aloud.
- Before. alt="nike shoes buy now best running shoes cheap free shipping". Keyword stuffing, spam to Google and noise to a listener.
- After. alt="" on a decorative divider. The empty attribute is a deliberate signal, not an omission: it tells screen readers this image carries no information.
| Image type | What the alt should do | Example |
|---|---|---|
| Product photo | Name brand, model, variant, color | "Herman Miller Aeron chair, size B, graphite" |
| Chart or graph | State the takeaway; data lives in page text | "Bounce rate falling from 68% to 41% after the redesign" |
| Linked image or logo | Describe the destination, since it is the link text | "Egochi homepage" |
| Screenshot in a tutorial | Name the state the reader should see | "Search Console settings menu with the robots.txt report highlighted" |
| Photo with a full caption | Add what the caption omits, or go empty | alt="" under a captioned team photo |
| Decorative flourish | Empty alt so screen readers skip it | alt="" |
| CSS background image | Nothing; backgrounds take no alt attribute | Move meaningful images into img tags |
When to leave the alt empty on purpose
The empty attribute is the most misunderstood part of the system. An image that exists only as decoration, a divider, a background flourish, an icon sitting next to text that already says the same thing, should ship with alt="" so screen readers pass over it silently. Describing it would add noise, not access. The distinction that matters is between empty and absent: alt="" is a decision, while a missing attribute is a defect that leaves each screen reader to improvise, often with the file name. Two neighbors of the rule round it out. Images applied through CSS backgrounds take no alt attribute at all, so anything meaningful belongs in a real img tag. And an element hidden with aria-hidden is skipped wholesale, which suits icon fonts and duplicated visuals. When an image is a link, the opposite rule applies: the alt becomes the link text, so it must never be empty and should describe the destination, not the picture.
How alt text connects to AI search
AI engines answer with what they can read, and for images that is the surrounding text plus the alt attribute. Vision models can caption a picture on their own, but your alt text is the label you authored, and retrieval systems store it with the page content they cite. In practice that means original images, product shots, process diagrams, result charts, only carry weight in AI answers when their text layer says what they show. On this site every image ships with authored alt text through the same review as body copy, and we treat a chart with no alt line as unpublished work. The honest framing: alt text will not put you in AI answers by itself, and skipping it removes your visuals from consideration entirely.
How to find the gaps on your site
-
Crawl for missing and empty attributes
Screaming Frog lists every image with its alt text and filters by missing alt. Review the empties by hand: some should be empty, and the crawl cannot tell you which.
-
Check the templates, not just the content
A theme that omits alt on featured images creates the same defect on every post at once. One template fix outweighs a hundred manual edits.
-
Listen to a page
Run one important page through the free WAVE checker, or turn on the screen reader built into your phone, and experience the image gaps directly. Nothing motivates the cleanup faster.
Where alt text fits in the bigger picture
Alt text is one piece of image SEO, next to descriptive file names, compression, and modern formats, and the family rolls up into on-page SEO. It also shares a principle with your header tags: both serve assistive technology first, and both earn their search value as a byproduct of doing that job honestly. If your pages lean on original photography, diagrams, or product shots, honest alt text plus fast-loading files is traffic other sites are leaving on the table.
Questions people ask about alt text
What is alt text used for?
Three things, and lately a fourth. Screen readers speak it aloud so users who cannot see the image know what it shows. Search engines read it to understand and rank the image. Browsers display it when the file fails to load. And AI systems ingest it as the text label attached to your visuals.
How long should alt text be?
Aim for 125 characters or less. Some screen readers chunk or cut longer descriptions, and past that length you are usually describing more than the image shows. Complex images like charts get a short alt plus a longer description in the page text itself.
Does alt text help SEO?
Yes. Google names alt text as one of the main signals it uses to understand images, which is what image search rankings are built on, and the text adds context to the page the image sits on. It will not rescue a weak page, and stuffing keywords into it hurts both audiences it serves.
Should every image have alt text?
Every image element needs an alt attribute; not every image needs a description. Informative images get real alt text. Purely decorative images get an empty attribute, alt="", which tells screen readers to skip them. An image with no alt attribute at all is the one state with no defense, because screen readers may announce the file name instead.
Is missing alt text an ADA violation?
It is one of the first things accessibility complaints and audits cite. The DOJ rule under ADA Title II requires state and local government sites to meet WCAG 2.1 AA, where text alternatives are the first success criterion, and private-sector suits under Title III routinely use the same standard as the benchmark. Alt text alone is not full compliance, but its absence is an easy finding.
What is the difference between alt text and a caption?
A caption is visible to everyone on the page. Alt text is read by screen readers and search engines, and only renders when the image fails to load. When an image has a caption, the alt text should add to it, not repeat it word for word, because screen reader users would hear the same sentence twice.
