Every Image Element Has An Alt Attribute

Why the audit is important

Every image should have an alt attribute that includes a text description of the contents of that image. Screen readers enable visually-impaired users to use your site by converting text content to forms they can use, such as synthesized speech or Braille. Screen readers can't convert images. So if your images include important information, that information is not accessible to visually-impaired users.

How to pass the audit

Below the audit, Lighthouse displays something like 1 element fails this test. The number varies depending on how many elements are failing. Click this label to expand the list. You can find each element in your DOM by running the $(), $$(), and $x() functions from the Chrome DevTools Console.

Add an alt attribute to every img element that does not have one. You can run the following command in the DevTools Console to find the elements:

$$('img:not([alt])');

DevTools returns an array. Expand the array and then hover over each img to highlight it in the viewport.

When writing a description for each image, keep in mind that this is all the information that visually-impaired users have to go by, so try to make it as useful as possible for them.

How the audit is implemented

This section explains how this audit is implemented, so that you can understand how the audit's score is calculated.

This audit is powered by the aXe Accessibility Engine. See Images must have alternate text for more information.

Feedback