DevTools Tips

Find all images without alternative text

Categories: Supported by:

With HTML, you can add alternative text to images using the alt attribute. It can be used to add a text description to images, which is extremely useful for accessibility as some people may not be able to see the images. With alt, screen readers can announce the alternative text to the user.

Using DevTools, you can quickly check which images on a page do not have an alt text, here is how:

Execute this in the Console panel: console.table($$('img').filter(i => !i.alt), ['src']) and that's it! You'll have the list of image URLs that don't have an alternative text.

The output of the console.table command from above shown in the Firefox DevTools console

Here's what this command does: