Alt text for people who won't see the image

Alt text exists for one situation: the image isn't visible. Screen reader, broken link, text-only browser, slow connection — doesn't matter why. If the image isn't there, your alt text is.

That changes what you write.

Describe function, not appearance

If the image is a button, the alt text says what happens when you click it. "Submit form" not "green checkmark icon." If it's a chart, the alt text states the conclusion: "Sales increased 23% in Q3" not "bar chart with blue and orange bars."

Decorative images get empty alt attributes (alt=""). No description needed because the image adds nothing semantic. Patterns, dividers, purely visual embellishments — silent in a screen reader.

Context determines detail

Product photo on a catalog page: "Black leather messenger bag with brass hardware." Same photo on the product detail page where that information already appears in text: "Messenger bag shown from front."

The page content around the image tells you what's already covered. Don't duplicate. Fill gaps.

Test by hiding the image

Turn off images in your browser. Read the page. If the alt text makes you guess what was supposed to be there, rewrite it. If it duplicates adjacent text word-for-word, trim it. If removing a decorative image creates a gap in meaning, it wasn't decorative.

Handle complex images separately

Diagrams, infographics, detailed charts — these need more than alt text. Short alt: "Workflow diagram for content approval process." Then provide the actual information in surrounding text or a linked text alternative. Alt text has practical length limits. Work within them.

Don't write alt text like captions

Captions assume the image is visible and add context. Alt text assumes it isn't and replaces it. Captions are part of the image decision, but they serve different readers in different situations.

"Photo of the team at the 2024 conference" is a caption. "ContentMine team: Ada, three colleagues" is alt text.

Check your CMS defaults

Some systems auto-fill alt text from file names. "IMG_4847.jpg" becomes alt="IMG 4847" — useless. Others use the image title field, which might be fine or might be SEO-stuffed garbage. Know what your CMS does when you leave alt text blank versus empty.

Empty (alt="") is semantic. Blank (missing attribute) is an error.

Write it when you upload

Not later. Not in bulk. When you choose the image, you know why it's there. That's when you know what to write. Retrofitting alt text means re-learning context you already had.

Same principle as naming files before upload: decide once, at the right time, with full context.

Avoid "image of" and "picture of"

Screen readers announce images. You don't need to. "Black leather messenger bag" not "Image of a black leather messenger bag." Save the characters for information.

Remember this is structure work

Alt text isn't polish. It's not something you add if you have time. It's baseline accessibility and semantic HTML. Skipping it means some users get less content than others.

You're not writing for search engines or compliance checkboxes. You're writing for people who won't see the image, so they get the same information as people who will.