How to fix: Images missing alt text

Alt text (the alt attribute on an <img> tag) is the text alternative a screen reader reads aloud in place of an image. WCAG Success Criterion 1.1.1 Non-text Content requires that every meaningful image carry a text equivalent so the information it conveys is available to people who cannot see it. This is the single most common accessibility failure on the web.

There are two correct cases. If an image conveys information (a product photo, a chart, a logo that names the brand, an icon that acts as a button), give it descriptive alt text that captures the meaning, not the literal pixels. If an image is purely decorative (a background flourish, a spacer, a photo that repeats text already on the page), give it an empty alt="" so assistive technology skips it instead of announcing a filename.

The mistake is leaving the attribute off entirely. When alt is missing, many screen readers fall back to reading the file path, so a user hears "slash assets slash hero dash 2 dot jpg" with no idea what the image is or whether it matters.

Blind and low-vision users who navigate with screen readers like JAWS, NVDA, or VoiceOver are affected directly. Without alt text, an image is invisible to them. If that image is a call-to-action button, a chart with key data, or a product they want to buy, the page is simply broken for them.

It also affects anyone on a slow or failed connection (the alt text shows when the image does not load) and search engines, which read alt text to understand image content. A missing alt attribute hurts real users and your image SEO at the same time.

Missing alt text is a Level A failure, the most basic conformance tier, and it is the violation plaintiff firms look for first because it is trivial to detect at scale. WCAG 2.1 Level AA is the de-facto benchmark U.S. courts apply to ADA Title III claims, and image text alternatives sit at the foundation of that standard. Web accessibility lawsuits have climbed year over year, and the majority target businesses under $25 million in revenue.

Beyond legal exposure, alt text is a low-effort, high-impact fix. The WebAIM Million report consistently finds missing alternative text on the vast majority of home pages, so closing this gap immediately differentiates your site and removes one of the most cited barriers in demand letters.

1. Find every <img> tag on the page and check whether it has an alt attribute at all.
2. For each meaningful image, write alt text that describes the information or function, not the file. For an icon-button, describe the action (alt="Search"), not the picture.
3. For purely decorative images, add an explicit empty alt="" so screen readers skip them.
4. Keep descriptions concise (usually under ~125 characters) and avoid redundant prefixes like "image of" or "photo of".
5. Re-scan to confirm no <img> is left without an alt attribute.

<img src="/team-photo.jpg">
<a href="/cart"><img src="/cart-icon.svg"></a>

<img src="/team-photo.jpg" alt="The AccessKnight team at the 2026 offsite">
<a href="/cart"><img src="/cart-icon.svg" alt="View cart"></a>
<img src="/divider-flourish.svg" alt="">

AccessKnight parses your rendered HTML and inspects every <img> element. It flags any image where the alt attribute is entirely absent (getAttribute returns null). Note that this specific rule treats a present-but-empty alt="" as a pass, because an explicit empty alt is the correct, intentional marker for a decorative image. A separate check looks for unhelpful alt text and for empty alt on images inside links and buttons, so a blank alt on an icon-only button is caught elsewhere rather than here.