Writing useful image alt text
Alt text describes an image to anyone or anything that cannot see it: screen reader users, search engines, and visitors whose images failed to load.
What it is
The alt attribute holds a short text description of an image. A screen reader speaks it aloud in place of the picture.
It is also the main way a search engine understands image content, which is what makes image search work.
Why it matters
In Australia, accessible websites are a legal consideration under the Disability Discrimination Act, and WCAG treats missing alt text as a failure.
For businesses whose work is visual, such as landscapers, builders and hairdressers, image search is a genuine source of enquiries that missing alt text forfeits entirely.
How to fix it
- Describe what the image shows and why it is on the page, in a short phrase.
- Include relevant detail naturally: 'Rebuilt bluestone retaining wall in Sebastopol' rather than 'wall'.
- Leave alt empty for purely decorative images so screen readers skip them. Empty alt is correct here; a missing attribute is not.
- Do not begin with 'image of' or 'photo of'; the screen reader already says so.
What good looks like
<!-- Informative -->
<img src="wall.jpg" alt="Rebuilt bluestone retaining wall in Sebastopol">
<!-- Decorative: intentionally empty -->
<img src="divider.svg" alt="">Common mistakes
- Using the file name, so the description reads 'IMG_4821'.
- Stuffing keywords into alt text, which helps nobody and is easily detected.
- Omitting the attribute on decorative images instead of setting it to empty.
Check your own site. ppclift checks this automatically on every page it audits. Run a free audit and see every check on one page, with no account required.