How to Fix Missing Alt Text on Images

Why this matters

About 7.6 million Americans have a visual disability. Alt text is how they understand your images. It is also used by Google to index your images, which helps your SEO. Missing alt text is one of the top 5 most common WCAG violations.

Code examples

<img src="team-photo.jpg">
<img src="logo.png">
<img src="btn-submit.png">

<img src="team-photo.jpg" alt="The WebPossum team at our Memphis office">
<img src="logo.png" alt="WebPossum — WCAG Accessibility Scanner">
<img src="btn-submit.png" alt="Submit form">
<!-- Decorative image: use empty alt -->
<img src="divider.png" alt="">

How to fix it — step by step

1. 1
   Add an alt attribute to every img element on your page
2. 2
   For informative images: describe what the image shows in plain language
3. 3
   For functional images (buttons, icons): describe what they do, not what they look like
4. 4
   For decorative images: use alt='' (empty) — this tells screen readers to skip it
5. 5
   Never use the filename as alt text (e.g. alt='photo_2024_final_v2.jpg')
6. 6
   Keep alt text under 125 characters — be concise and descriptive
7. 7
   Don't start with 'image of' or 'photo of' — screen readers already announce it's an image

Test it for free

Use WebPossum to automatically detect this violation and every other WCAG 2.2 issue on your site. Free, instant, no signup required.