How to Write Alt Text That Works for Screen Readers and Search

Alt text is the most-explained and least-done item in image SEO. Everyone knows it matters. Audit almost any mid-sized site and you will still find hundreds of images with the attribute missing, empty by accident, or stuffed with a comma-separated keyword list that reads like a ransom note.

The confusion is usually about audience. Once you fix that, most of the hard cases answer themselves. What follows is the working guidance as of July 2026, anchored to the W3C and WebAIM references rather than to folklore.

Who alt text is for

The alt attribute is a text alternative: what gets presented when the image itself is unavailable. That covers a screen reader user navigating your page, a slow connection where the file never arrives, and a crawler trying to work out what the picture shows.

The first of those is the primary case. The W3C Web Accessibility Initiative frames alt text entirely around it, and WebAIM's guidance is the practitioner's reference most teams end up using. Search benefit is real — Google Search Central names alt text among the things it uses to understand an image — but it is downstream. Write for the person, and the crawler gets a good description for free.

This is why keyword stuffing fails twice over. Search engines have discounted it for years, and it makes the page genuinely worse for the one group the attribute exists to serve.

The one question that decides everything

Before writing, ask: if I deleted this image, what information would the page lose?

The answer determines the treatment:

• No information lost — decorative. Use alt="".
• Some specific fact or impression lost — informative. Describe that.
• A function lost — the image is a button or a link. Describe the action, not the picture.
• A lot of structured information lost — chart, diagram, infographic. Short alt plus a full text equivalent nearby.

The W3C publishes a decision tree that formalises exactly this. When you are stuck on an edge case, that is the thing to open.

Writing informative alt text

Three things, in this order: subject, action, relevant context. Stop there.

A technician programming a transponder key with a diagnostic scanner in a car's driver seat.

Subject (technician), action (programming a transponder key), context (diagnostic scanner, driver seat). Sixteen words. Someone who cannot see it now knows what the page is showing them.

Compare the two failure modes:

Image
car key programming locksmith Arlington TX car key replacement transponder key near me

The first is a wasted attribute. The second is hostile to a screen reader user and ignored by search engines.

Some habits worth adopting:

Skip "image of" and "picture of." Screen readers already announce that it is an image. "Image of a technician…" is heard as "graphic, image of a technician."

Front-load the subject. Alt text is heard linearly and users skim by first words, exactly as with link text.

Match the page's purpose. The same photograph gets different alt text on different pages. On a services page: "Technician rekeying a residential deadbolt." On a page about your van fleet: "Branded service van parked outside a suburban home." Both are accurate; each serves its page.

Do not repeat the caption. If a visible caption already says it, the alt can be empty or can add what the caption leaves out.

When to leave it empty

alt="" is a positive statement: this image carries no information, skip it. Correct for background textures, decorative rules, and icons that sit next to text saying the same thing — a phone icon beside the words "Call us" should be alt="", because "phone icon Call us" is just noise.

The mistake to avoid is omitting the attribute altogether. A missing alt is not the same as an empty one; assistive technology may fall back to reading the filename, which is how users end up hearing "I M G underscore four four seven one dot J P G."

The cases people get wrong

Image type	Common mistake	Better approach
Logo in the header	alt="logo"	alt="SEOpix" — or alt="SEOpix home" if it links home
Image used as a link	Describing the picture	Describe the destination or action
Icon next to matching text	alt="phone icon"	alt="" — the adjacent text already says it
Chart or graph	150-word alt attribute	Short alt + data table or summary in the body
Product photo	alt="product"	Model, colour, angle — what a buyer would want confirmed
Team headshot	alt="team member"	Person's name and role
Stock photo of nothing	Keyword stuffing	Honest short description, or alt="" if truly decorative
Text inside an image	Describing the design	Transcribe the text — that is the information

That last row is worth dwelling on. If your hero image contains the words "50% off this week," the alt text must contain "50% off this week." Anything else withholds the offer from part of your audience.

Product galleries and e-commerce

Product imagery is where alt text repays the effort fastest, because the queries are specific and the images carry information the copy often omits.

A gallery of eight shots of the same item should not carry eight copies of the product name. Each image is showing something different, and the alt text is where you say what:

• alt="Black leather weekender bag, front view with handles up"
• alt="Interior of the weekender bag showing three zipped compartments"
• alt="Weekender bag worn over the shoulder by a standing model"
• alt="Close-up of the brass zip pull and stitched leather trim"

That set tells a non-sighted shopper what the sighted one gets from clicking through. It also, incidentally, gives search engines four distinct descriptions instead of four duplicates — but the reason to do it is that a shopper cannot buy what they cannot assess.

Two specifics. Colour swatches need the colour name in the alt text, since the swatch itself is meaningless without it. And anything conveyed only by the image — a size chart, a spec table rendered as a graphic, a discount badge — must be transcribed, because otherwise that information simply does not exist for part of your audience.

Testing what you wrote

You do not need to be a screen reader user to sanity-check alt text, and a few minutes with the real thing is more instructive than any checklist.

Turn one on. VoiceOver on macOS (Cmd+F5) and Narrator on Windows (Ctrl+Win+Enter) are both built in. Navigate one of your own pages by image. Listening to your own alt text read aloud is the fastest way to notice that it is too long, starts with "image of," or is a keyword list.

Read it in isolation. Cover the picture and read only the alt text. Does it convey what the image contributed? If it could describe a thousand other images, it is too vague.

Audit programmatically. In the console, document.querySelectorAll('img:not([alt])') finds missing attributes; automated tools like axe or Lighthouse flag the same and more. What no tool can flag is alt text that is present, well-formed and useless — alt="image" passes every automated check ever written.

That last point is why alt text resists full automation. Machines verify the attribute exists; only a human knows whether it says the right thing.

Alt text at volume

One image is a two-minute job. The trouble starts at a hundred images across twenty-five location pages, where alt text is the last step before a deadline. That is when everything collapses to alt="image" or nothing at all.

Two things make volume survivable.

Templates with real variables. For repeated image types, a pattern like {action} on a {subject} in {city} produces accurate, varied alt text as long as the variables are genuinely per-image. The failure mode is a template with no variables, which yields five hundred identical attributes — no better than none.

Generating the alt text with the image. If the description is produced at the same moment as the picture, from the same brief, there is no cleanup pass to skip. This is the approach SEOpix takes: alt text, filename and the EXIF metadata block are all written as the image is generated, using the business context you supply once. It still deserves a human skim — a generator describes pixels, not intent — but skimming a hundred drafts is a different task from writing a hundred from scratch.

The legal dimension, briefly

Alt text is not only a quality question. Under WCAG 2.2 — the standard referenced by accessibility legislation in most jurisdictions — providing text alternatives for non-text content is a Level A criterion, the baseline tier. Missing alt attributes are among the most frequently cited issues in web accessibility complaints, precisely because they are so easy to detect at scale.

None of which changes the practical advice. Write useful descriptions, mark decorative images empty, and you satisfy both the standard and the reader. But if you need to justify the time to someone who is unmoved by the SEO argument, the compliance framing tends to land faster.

A five-minute audit

Open your most important page and run the browser console:

document.querySelectorAll('img:not([alt])').length

Any result above zero is a missing-attribute bug. Then eyeball the ones that do have alt text and ask the deletion question of each. Most sites find three buckets: decorative images that should be alt="", informative images with no alt at all, and one or two attributes stuffed with keywords by a previous owner.

Fixing that page takes twenty minutes and is the highest-value accessibility work available to most marketing sites. Then work it into the pipeline so the next hundred images arrive already described — see the full image SEO checklist for where alt text sits among the other pre-publish items, or the bulk workflow guide if you are running this across clients.

Start free with 10 images a month, or check the FAQ for how the generated descriptions are produced.