Tutorials Accessibility

Alt Text That Actually Helps

Beginner · ~15 min

Overview

Alt text is a short description read aloud in place of an image by a screen reader. Most alt text in the wild is either missing, autogenerated and wrong, or a keyword-stuffed repetition of the filename, all of which are worse than a single honest sentence. The skill is deciding what the image is doing on the page and describing that, rather than cataloguing what is visible. This guide covers how to make that decision quickly and the specific patterns that make descriptions useful.

What You Need

Somewhere alt text can actually be entered: most CMSs, social platforms, and editors support it
Knowledge of why each image is on the page
A screen reader to hear the result, even briefly. Every OS includes one
Willingness to write plainly rather than descriptively
A decision about which images are decorative
Nothing else. This is a writing skill, not a technical one

Steps

Ask what the image is doing, not what it shows

The same photograph needs different alt text depending on its job. On a gear review, a photograph of a microphone might need "Shure SM7B on a boom arm, showing the yoke mount". In an article about home studios, the same image might only need "A microphone on a boom arm above a desk". Describe the information the image contributes at this point in the page.

Lead with the most important thing

Screen reader users hear alt text linearly and may move on before the end. Put the essential content first rather than building to it. "Waveform showing clipping at the chorus" is more useful than "A screenshot of a digital audio workstation timeline in which a waveform can be seen to be clipping".

Keep it short, and stop when the job is done

One clear sentence handles the large majority of images. Long descriptions are tiring to listen to and usually contain detail that serves no purpose. If an image genuinely needs a paragraph, a complex chart or diagram, put that description in the visible page text where everyone benefits, and keep the alt text short.

Mark decorative images as decorative

Purely ornamental images (dividers, background textures, a stock photo that adds no information) should carry empty alt text so a screen reader skips them silently. This is not laziness. Announcing "decorative swirl graphic" on every section break is actively worse than saying nothing.

Transcribe text that appears in images

If an image contains words (a quote card, a screenshot of a message, a chart with labels, a meme) those words are content and must be in the alt text. Text inside an image is invisible to screen readers, to search, and to anyone using text scaling, which is why important information should rarely live only in a graphic.

Listen to it once

Turn on your operating system's screen reader and let it read a page you wrote. This takes a few minutes and changes how you write alt text permanently, because hearing "image IMG_4471 dot jpeg" or a thirty-second description of a decorative border makes the problem concrete in a way guidance does not.

Pro Tips

Never start with "image of" or "picture of", screen readers already announce that it is an image.
Do not stuff keywords. It does not help search meaningfully and it makes the page hostile to listen to.
If you cannot think what to write, ask why the image is there. If there is no answer, it is decorative.
Charts and graphs almost always need their conclusion in the surrounding text, not just in alt text.
Autogenerated alt text is a draft at best. Check it, because confidently wrong descriptions are worse than none.

Knowledge Base

What You'll Learn

Alt text is short-form technical writing, and the difficulty is editorial rather than technical. Below: how context changes the right description, and the failure modes that make alt text worse than useless.

The Same Image Needs Different Alt Text in Different Places

This is the idea that makes alt text click, and it is why generic image-description tools cannot fully solve the problem.

Consider a photograph of a person speaking at a lectern. On a page about the event, the useful description is who they are and that they are speaking. On a page about stage lighting, it might be the lighting setup visible behind them. On a page about accessibility, it might be the sign language interpreter at the edge of the frame.

An automatic describer sees the pixels and produces the same output every time, because it has no access to why the image is on that page. You do.

The practical version of this is a single question: if this image failed to load, what would the reader need to know so the page still made sense? That answer is the alt text, and it is usually shorter and more specific than a description of everything visible.

The Failure Modes Worth Avoiding

Missing alt text means screen readers fall back to reading the filename, which produces "D S C underscore zero four four seven dot J P G", actively unpleasant and completely uninformative.

Redundant alt text repeats a caption that is already on the page, so the listener hears the same sentence twice with no added value.

Over-description catalogues everything visible (clothing, background, weather) when only one element mattered. It buries the point and takes far longer to hear than to read.

Keyword stuffing treats alt text as a search field. It degrades the experience for the people the attribute exists for, and search engines have long since stopped rewarding it.

Text trapped in images is the most consequential. A quote card or an infographic whose content exists only as pixels is invisible to screen readers, to translation tools, to search, and to anyone who needs larger text.

Where This Fits

This guide covers one specific part of accessibility. The wider picture, conformance levels, the difference between captions, subtitles, and audio description, and building access into the workflow rather than retrofitting it, is in Publishing Accessible Video: A Practical Compliance-Era Checklist, which frames the discipline as a whole and links out to the detailed guides underneath it, including this one. If you are starting from scratch rather than solving a specific problem, read that first and come back here.

FAQ

Q: How long should alt text be?
A: Usually one sentence. If a description genuinely needs more (a complex chart, a diagram, a data visualisation) put the full explanation in the visible page text where every reader benefits, and keep the alt text to a short identification of what the image is.

Q: What about purely decorative images?
A: Give them empty alt text so screen readers skip them. Announcing every divider, texture, and ornamental flourish adds noise without information and makes a page tedious to listen to. Marking something decorative is a real decision, not a shortcut.

Q: Should I use AI to generate alt text?
A: As a first draft, checked before publishing. Automatic description is genuinely good at identifying objects and genuinely bad at knowing why the image is on your page, which is the part that determines what the description should say. Confidently wrong alt text is worse than none.

Q: Does alt text help SEO?
A: Slightly, as one signal among many, and that is not a reason to write it badly. Keyword-stuffed alt text is not rewarded and makes pages unpleasant for the people the attribute exists to serve. Write it accurately and any search benefit follows on its own.