Product photos
- Bad:
shoe - Bad:
best waterproof trail running shoes cheap sale - Good:
Blue Trail Runner 2 waterproof shoe, side view showing the lugged rubber sole
Mention the product name, colour and the detail the photo shows. On a gallery, describe what's different in each shot: "back view", "sole close-up", "worn on a muddy trail".
People
- Bad:
image of a woman - Good:
Dr. Priya Shah smiling at a patient during a check-up
Name the person when it matters to the page. Describe what they're doing if that's the point of the photo.
Charts and graphs
- Bad:
chart - Good:
Line chart showing organic clicks rising from 2,000 to 6,500 a month between January and June
Give the key takeaway, not every data point. If the chart is complex, summarise it in the alt text and explain it fully in the page text.
Logos
- Linked logo in the header:
Example Co home - Logo in a list of clients:
Acme Corporation - Bad:
logo.png or logo
For a linked image, describe where the link goes.
Screenshots
- Bad:
screenshot - Good:
Google Search Console Pages report showing 42 pages excluded by noindex tag
Say what the screenshot is meant to show the reader.
Infographics
- Good:
Infographic: five steps to an SEO audit, from scanning the site to writing a fix list
Keep alt text short and put the full content in the page text, where everyone can read it.
Icons and decorative images
- Icon next to the word "Email":
alt="" (the text already says it) - Background shapes, dividers, flourishes:
alt="" - An icon button with no text, such as a magnifying glass for search:
Search
An empty alt tells screen readers to skip the image. A missing alt attribute makes some read the file name instead.
Images of text
- Good: alt text that repeats the text in the image, such as
Autumn sale: 30% off all trail shoes until November 30
Better still, use real text instead of an image of text.
Quick reference
| Image | Good alt text approach |
|---|
| Product | Name, colour, angle or detail shown |
| Person | Who, and what they're doing if it matters |
| Chart | The main takeaway |
| Linked logo | Where the link goes |
| Screenshot | What it's meant to show |
| Decorative | Empty: alt="" |
| Icon with a text label | Empty: alt="" |
| Icon-only button | The action: "Search", "Close menu" |
Checklist
- Does it describe what matters about the image here?
- Is it under about 125 characters?
- Does it avoid "image of" and "picture of"?
- Would it make sense read aloud?
- If you added a keyword, is it genuinely what's in the image?
To find images that are missing alt text, use the alt text checker.