Screen readers skip images with empty alt attributes

The alt attribute on <img>, the HTML image element, is used to define an alternative, textual representation of that image. Including this attribute is an important aspect of making content more accessible to visually impaired users, who may be relying on screen readers to consume the content on your page.

If an image isn’t relevant to the content, for example because it’s purely decorative, then set an empty alt text (alt="") to indicate it’s irrelevance to understanding the content itself. This will cause (most) screen readers and other non-visual browsers to skip that image.

From the MDM Web Docs:

Omitting alt altogether indicates that the image is a key part of the content and no textual equivalent is available. Setting this attribute to an empty string (alt="") indicates that this image is not a key part of the content (it’s decoration or a tracking pixel), and that non-visual browsers may omit it from rendering. Visual browsers will also hide the broken image icon if the alt is empty and the image failed to display.

See also

• https://webaim.org/techniques/alttext/
• https://digitalaccess.ucsf.edu/guidelines/make-images-accessible
• Alt text decision tree by the W3C Web Accessibility Initiative