Skip to main content
WCAGrules
Quick navigation

Do not leave decorative images announced

F38 is a documented failure under the non-text content rule, and its current wording carries a second route through it that most summaries, our own old one included, do not. A decorative image has to be ignorable by assistive technology, and there are two ways to make it so. An empty alt attribute does it. So does a presentation role. The failure needs both to be absent, which is why a missing alt attribute on its own is not automatically F38. That matters for how you read a scanner report. Every tool flags the missing attribute, and the tool is not wrong about the attribute. It is just not the same as being right about the failure. The other repair is to stop shipping the image in markup at all, because pure decoration belongs in CSS, where nothing has to decide whether to announce it.

How we find it in an audit

Automated scans list every img with no alt attribute, quickly and reliably, and that list is the start rather than the finding. A reviewer sorts it by purpose, because the same missing attribute is a serious defect on an informative image and a smaller one on a flourish. We read the role attribute at the same time, since an image already carrying a presentation role is ignorable and belongs in neither bucket.

How affected users experience it

Decorative images with no alt attribute get announced by their filename, so the reader hears "corner flourish v 2 dot p n g, graphic" in the middle of a sentence. One is a distraction. On a template using eight of them per page it becomes the page, and finding the actual content means listening past a list of asset names. Someone reading with a braille display pays for it in space, because every one of those filenames takes up the line they were reading.

Passes vs. fails

Passes: alt text names the product. Fails: the file name is all there is.

Passes

<img src="corner-flourish-v2.png" alt="">
<img src="corner-flourish-v2.png" role="presentation">
<!-- Either one works. Better still, move pure decoration into CSS. -->

Fails

<img src="corner-flourish-v2.png">
<!-- No alt attribute and no role. Nothing tells anyone to ignore it. -->

How this gets tested

The W3C publishes test rules that define what a checker looks for here.

The other techniques filed under this rule

39 guides on this site are filed under 1.1.1 Non-text Content. W3C documents this one as a failure of that rule, so it describes a way the rule gets broken rather than a way to pass it.

This guide is our interpretation of W3C technique F38: Failure of Success Criterion 1.1.1 due to not marking up decorative images in HTML in a way that allows assistive technology to ignore them. W3C publishes its techniques as guidance rather than as the standard, and says so on every one of them. The success criterion is what conformance is measured against, and a technique is one documented way to meet it.

Go somewhere useful

Find tools, resources and your workspace.

29 destinations