Fix Guide

How to Add Alt Text to Images

Describe images with alt text for screen-reader users and image SEO.

Easy Medium Impact 15 min

Why It Matters

Alt text is read aloud by screen readers, shown when an image fails to load, and helps your images rank in Google Images. Informative images need a concise description; purely decorative images should have an empty alt="" so screen readers skip them.

How to Fix

Describe informative images

Write what the image conveys in context — concise and specific, no "image of…".

Empty-alt the decorative ones

Use alt="" (not a missing attribute) for purely decorative images so assistive tech ignores them.

Code Fix

html

Before (broken)

<img src="chart.png">  <!-- no alt -->

After (fixed)

<img src="chart.png" alt="Organic traffic grew from 1k to 8k visits over 6 months">
<img src="divider.svg" alt="">  <!-- decorative -->

Platform-Specific Instructions

WordPress

The Media Library has an "Alt text" field per image; fill it in before inserting. Bulk-edit older images with a plugin.

Next.js

next/image requires an alt prop — pass a real description or "" for decorative.

Want to find all issues at once?

Run a free audit and get a prioritized fix list with auto-generated code.

Run a free audit

How to Add Alt Text to Images — Fix Guide | SlapMyWeb