Ensure ATs Ignore Images that are Purely Decorative and Repetitive

When it comes to image accessibility, we are taught that images need text alternatives so that those who are blind or visually impaired can access the visual information. However, there are some types of images that should be ignored by assistive technologies. Images that do not convey information and are used purely for decorative purposes should be assigned empty, or null, alt attribute values. In addition, images used in conjunction with text that communicates the same information should also be given empty, or null, alt attribute values. Assigning an empty alt attribute ensures that an image will be ignored by assistive technologies.

Example 1:

A decorative green square:

<img src="green-square.jpg" alt="">

Example 2:

A home page icon:

Home Page

<p>
<a href="index.html">
<img src="images/home-icon.png" alt="" width="24" height="25"> Home Page
</a>
</p>

It is important to note that an empty alt attribute is not the same as having no alt attribute at all. If alt="" is not present, assistive technology like a screen reader will read the image's file name instead of ignoring the image completely. Decorative images can also be implemented using CSS since assistive technologies ignore background images.