axessia.eu

The most common mistake with alt text: what goes wrong and how to prevent it

The biggest pitfall with alt text is not that it's missing, but that it exists and adds nothing. This article shows where things go wrong and how to recognize it.

The most common mistake with alt text is not that it's missing. That happens too, but it's the visible error that gets noticed quickly. The more stubborn mistake is that the alt text is there, but adds nothing: the filename of the photo, the word "image", an elaborate description of a decorative border, or nothing at all on a button that consists only of an icon. For a screen reader user, that creates noise instead of information, and sometimes it means a function on the page becomes unusable.

WCAG 2.1, the standard on which EN 301 549 is based, requires that non-text content receives a text alternative that serves the same purpose. That sounds simple, but in practice this requirement is often formally checked off without the text being functional. Something sits in the alt attribute, the checklist is complete, but the user who has the text read aloud gets nothing out of it.

What exactly goes wrong

A few patterns keep recurring. The filename as alt text, such as "IMG_2044.jpg" or "product-photo-3.png", because an editorial system fills it in automatically and nobody corrects it. Alt text that is filled with search keywords instead of a description, which may be intended for search engines but sounds like a meaningless list to a screen reader. A decorative image, such as an atmospheric photo next to a heading, that still gets an elaborate description and thereby unnecessarily slows down the reading order. And perhaps the most common: functional icons, such as a shopping cart, a magnifying glass or an X to close something, that work as a button but have no text label at all. A screen reader then reads only "button", without making clear what that button does.

With product images, things often go the other way: the alt text describes the photo instead of the product. "Woman in blue sweater on beach" says nothing about the garment being sold, whereas that is precisely the information a user is looking for when they cannot see the photo.

Why an automated scan cannot fully catch this

A scan can reliably determine whether an image has an alt attribute and whether it is empty. That is useful and catches the gross errors. What a scan cannot reliably assess is whether the content of that text is correct: whether "photo" really describes what is visible, or whether an icon button has been given a meaningful name that matches its function. That requires human judgment, and that is precisely why every report states which part of the testing is automated and which part is not. If you want to quickly see where the obvious cases are on your own site, that is visible in a few minutes with the free quick-scan.

How to prevent it

The most practical question when writing alt text is: what would I say aloud to describe this image to someone who cannot see it, in the context of this page? With a product photo, that is the garment, the colour or the feature that the photo shows. With a button, that is the action the button performs, not the icon itself. With a purely decorative image, such as a background pattern, an empty alt text (alt="") is actually the right choice, so that a screen reader skips the image instead of reading something aloud that adds nothing.

It is also one of the places where a previously good situation can deteriorate without anyone noticing: an editor adds a new product photo, the system automatically fills in the filename, and the text that was there before disappears. That is not a one-time task but something that recurs with every change, which is also why this topic belongs with the broader requirements around non-text content that are worked out knowledge base by situation.

What this delivers

Good alternative text is not a matter of more text, but of the right text in the right place: short and functional for buttons and icons, meaningful for product photos, and absent where an image is purely decorative. Making that distinction takes little time once the pattern is clear, and it saves a lot of research work later. How we reflect that distinction in a report into concrete, prioritized points is described on the page about how the assessment is conducted, and for the questions that come up most often there is an overview with answers.

Would you like to know if this kind of error also occurs on your own site? The free quick-scan gives you a first, non-binding picture of that, without needing an account.

This article is general information and not legal advice.