Images must have alternative text

Critical1.1.1AXE · image-altDocs

Pages 6on W3C BAD Demo

Elements 50

Open 158d 23hsince 24.04.26

First seen 24.04.26

Last seen 08.09.26

Every <img> element must have an alt attribute that describes the image content. Decorative images should use alt="".

Scanner evidence

Engine: axeRule: image-altWCAG: 1.1.1

Ensure <img> elements have alternative text or a role of none or presentation

How to fix

Fix any of the following: Element does not have an alt attribute aria-label attribute does not exist or is empty aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty Element has no title attribute Element's default semantics were not overridden with role="none" or role="presentation"

Affected pages (6)

Affected elements (50)

https://www.w3.org/WAI/demos/bad/before/news.html39

```
<img src="./img/border_left_top.gif" width="10px" height="10px">
```
img[src$="border_left_top.gif"]
on https://www.w3.org/WAI/demos/bad/before/news.html
```
<img src="./img/border_top.gif" height="10px">
```
img[src$="border_top.gif"]
on https://www.w3.org/WAI/demos/bad/before/news.html
```
<img src="./img/border_right_top.gif" width="10px" height="10px">
```
img[src$="border_right_top.gif"]
on https://www.w3.org/WAI/demos/bad/before/news.html

https://www.w3.org/WAI/demos/bad/before/survey.html11

```
<img src="./img/border_left_top.gif" width="10px" height="10px">
```
img[src$="border_left_top.gif"]
on https://www.w3.org/WAI/demos/bad/before/survey.html
```
<img src="./img/border_top.gif" height="10px">
```
img[src$="border_top.gif"]
on https://www.w3.org/WAI/demos/bad/before/survey.html
```
<img src="./img/border_right_top.gif" width="10px" height="10px">
```
img[src$="border_right_top.gif"]
on https://www.w3.org/WAI/demos/bad/before/survey.html

Why this matters

Every <img> must have an alt attribute. Decorative images use alt="".

WCAG Technique H37

AI guidance

Remediation suggestions generated by AI. Review before applying.

Why this matters: Screen reader users cannot perceive decorative images without alt text, and search engines cannot index image content, reducing discoverability and creating barriers for visually impaired users.

Before

<img src="./img/border_left_top.gif" width="10px" height="10px">
<img src="./img/border_top.gif" height="10px">
<img src="./img/border_right_top.gif" width="10px" height="10px">

After

<img src="./img/border_left_top.gif" width="10px" height="10px" alt="">
<img src="./img/border_top.gif" height="10px" alt="">
<img src="./img/border_right_top.gif" width="10px" height="10px" alt="">

Notes: These appear to be purely decorative border images. Use alt="" (empty alt attribute) to hide them from assistive technology, which is the correct semantic approach. If these images convey content or meaning, provide descriptive alt text instead (e.g., alt="border decoration"). WCAG 1.1.1 Level A requires all images have alternative text; empty alt text is valid for decorative images.

Activity (0)

No activity yet.