The image that failed the accessibility audit

Beginner

🎫 Client ticket

An accessibility audit failed the homepage. The reviewer wrote: 'the main photo has no text alternative for screen-reader users.' The image itself displays fine on screen.

🔧 Your fix

HTML CSS

👁 Live preview

Hint: Every content image needs one specific attribute that describes what it shows — read aloud by screen readers and shown if the image fails to load.

The fix:

<img src="team-photo.jpg" width="320" alt="Our team hard at work in the office">
<p>Our team hard at work.</p>

·The image now has an alt attribute

✅ Fixed! Case closed.

You found the faulty line and corrected it — exactly what real debugging feels like.

Why it broke: Content images must carry an alt attribute describing what they show, e.g. alt="Our team in the office". It's read aloud to screen-reader users, indexed by search engines, and shown if the image can't load. A purely decorative image would use an empty alt="".

← Previous case

The heading that won't turn orange

Next case →

The badge that won't centre