Alt text
Also called: alternative text, alt attribute, image description
Definition
Alt text is a short written description of an image. Screen readers read it aloud, and browsers show it when the image can't load – so people who can't see the image still get its meaning.
Why alt text matters
Without alt text, a screen reader has nothing to say about an image – or worse, it reads out the file name: "IMG underscore 4031 dot jpg". Visitors who can't see the image miss what it shows, and links made of images lose their meaning.
Alt text also helps when images don't load, and it tells search engines what an image is about.
Good and bad examples
alt="Woman in a navy dress smiling against a bright wall"
Describes what matters in this context.
alt="image123.jpg"
A file name tells the visitor nothing.
Which alt text for which image
| Image type | What to write | Example |
|---|---|---|
| Informative | What the image shows that matters here | alt="Bar chart: sales doubled in 2025" |
| Link or button | Where it goes or what it does | alt="allyWay home" |
| Decorative | Nothing – leave it empty | alt="" |
| Chart or map | A short summary, details in the text | alt="Map of our 3 stores in Vienna" |
| Text in an image | The same text | alt="Summer sale – 20% off" |
How to write good alt text
Ask what the image does
Is it information, a link, or decoration? The answer decides what you write.
Describe the purpose, not the pixels
Write what a visitor needs to know here – not every detail you can see.
Keep it short
One clear sentence is usually enough. Many guides suggest staying under about 125 characters.
Skip "image of"
Screen readers already say it is an image.
Leave decorative images empty
Use
alt=""so screen readers skip them – don't leave the attribute out.
How to check your alt text
- Right-click an image and choose Inspect – look for the
altattribute. - Run a free accessibility check to find every image without alt text.
- Listen to the page with VoiceOver or NVDA.
<img src="dress.jpg"
alt="Woman in a navy dress smiling against a bright wall">Related WCAG criteria
| Criterion | Level | In short |
|---|---|---|
| 1.1.1 Non-text Content | A | Every non-text element has a text alternative |
| 1.4.5 Images of Text | AA | Use real text instead of text in images |
| 2.4.4 Link Purpose (In Context) | A | Image links say where they go |
| 4.1.2 Name, Role, Value | A | Controls have an accessible name |
FAQ
How long should alt text be?
Short – usually one sentence. Put longer explanations, such as chart data, in the text next to the image.
Do decorative images need alt text?
They need an empty alt attribute (alt=""), so screen readers skip them.
Is the title attribute the same as alt text?
No. Many screen readers ignore title, and it only shows on mouse hover. Always use alt.