Add text alternatives to images (WCAG 1.1.1)

Every <img> needs an alt attribute. Meaningful images get a description; purely decorative images get an empty alt="".

Why it matters

Screen-reader users hear the alt text in place of the image. A missing alt makes the reader announce the file name — useless noise — while an empty alt on decoration keeps it out of the way.

How to fix it

Describe the image's purpose, not its appearance. If the image is a link, the alt should describe the destination. Decorative images take alt="" (not a missing attribute).

<!-- Informative -->
<img src="chart.png" alt="Sales up 24% in Q4">

<!-- Decorative -->
<img src="divider.svg" alt="">

Related guides

• Fix low colour contrast (WCAG 1.4.3) 1.4.3 Contrast (Minimum)
• Give links a discernible name (WCAG 2.4.4) 2.4.4 Link Purpose / 4.1.2 Name, Role, Value
• Give buttons a discernible name (WCAG 4.1.2) 4.1.2 Name, Role, Value
• Label every form field (WCAG 1.3.1 / 4.1.2) 1.3.1 Info and Relationships / 4.1.2 Name, Role, Value

These guides cover automated checks (~30–40% of WCAG criteria). A full audit also needs manual review.