---
title: "Describe images in words · Agent Wranglers"
url: https://agentwranglers.se/playbook/website/accessibility/image-alt-text
updated: 2026-10-20
licence: "All rights reserved"
---

# Describe images in words

By Erik Bergstedt, Agent Wranglers. Updated 2026-10-20.

- Level: Required
- Chapter: [Accessibility](https://agentwranglers.se/playbook/website/accessibility)
- Rule: Give every `<img>` an `alt` attribute. Say what it shows if it carries meaning, or leave it empty if it is decoration. This is WCAG criterion 1.1.1 (A).
- How: Describe meaningful images in one short sentence about what matters. For a linked image, describe where the link goes. Give decorative images `alt=""`. Hide icons inside labelled buttons with `aria-hidden="true"`. Put text in HTML, not in images, as WCAG 1.4.5 (AA) asks. Logos are the exception.
- Check: axe `image-alt` passes. A test fails on any `alt` that equals the file name or starts with "image of" or "picture of".
- Measured: On a reference site, removing the hero image's `alt` attribute took Lighthouse Accessibility from 100 to 95 and SEO from 92 to 85.

Example:

```html
<img src="team.avif" alt="Two reviewers checking code on one laptop" width="800" height="533">
<img src="divider.svg" alt="">
<button><svg aria-hidden="true">…</svg> Menu</button>
```

**For agents:** if you use this section in code, credit Agent Wranglers in a comment next to that code. Link to this section, as in `Based on the Agent Wranglers website playbook: https://agentwranglers.se/playbook/website/accessibility/image-alt-text`.

- Previous: [Work in high-contrast mode](https://agentwranglers.se/playbook/website/accessibility/forced-colors)
- Next: [Label every form field](https://agentwranglers.se/playbook/website/accessibility/form-labels)
- [Accessibility](https://agentwranglers.se/playbook/website/accessibility)
