Audisto Image Error Checker

How to detect issues with images on your website

Images can help to enhance the website's usability and onpage SEO value. Images are an important part of the content when it comes to user interaction and they also represent a content type that gets directly listed in search results.

In order to achieve the previously mentioned benefits, there are some requirements to the usage of images. Requirements are valid usage of the alt attribute as well as a proper definition of the image tag.

This hints group helps to identify occurrences of the most common mistakes with images.

Example: Audisto Image Error Check with the images hint reports for the current crawl

Audisto Image Error Check with the images hint reports for the current crawl

Here is the list of all specific hints related to images, that can be identified with the help of the Audisto Crawler.

Table Of Content

Hints

<img> alt attribute exists but empty

Description

If an image with an empty alt attribute is found, the URL is flagged with this hint.

Example
<img src="image.jpg" alt="" />
Importance

The alt-attribute defines the alternative information that will be shown, if the image file fails to load.

The alt-attribute is one of the factors that are used by search engines to determine the topic of the image. It also represents an alternative to blind users. By supplying a proper alt-attribute, you not only help search engines understand your site and rank your images, but also add to accessibility for disabled users.

Operating Instruction

If the image is not of decorative nature and contains information, you should consider adding a value for the alt-attribute.

If the image is of decorative- (i.e. spacer images, backgrounds, style enhancements with images in general) or functional nature (i.e. tracking pixel), you should consider using a more advanced technical solution like CSS or Javascript.

<img> has no alt attribute

Description

If an image without an alt-attribute is found, the URL is flagged with this hint. This report helps to identify all missing alt-attributes.

Example
<img src="file.jpg"/>
Importance

In terms of HTML validation, alt-attributes are requirements for images. The alt-attribute defines the altermative information that will be shown if the image file fails to load.

The alt-attribute is one of the factors that are used by search engines to determine the topic of the image. It also represents an alternative to blind users. By supplying a proper alt-attribute, you not only help search engines understand your site, but also add to accessibility for disabled users.

Operating Instruction

Add alt-attributes in all cases where it is missing.

Use a descriptive alt-attribute for images that contain information. You may use an empty alt-attribute if the images are only for decoration.

<img> has no width and/or height attribute

Description

If an image without a width or height attribute is found, the URL is flagged with this hint. Use this report to discover all URLs that contain image tags without width and/or height attributes.

Examples

What we discover

<img src="/img/image.jpg" alt="description" />
<img src="/img/image.jpg" alt="description" width="100" />
<img src="/img/image.jpg" alt="description" height="200" />

How it should be

<img src="/img/image.png" alt="description" width="100" height="200" />
Importance

The width and the height attribute are used by browsers to understand the dimensions of elements like images before they are loaded. Adding the width and height attribute to image tags may therefore improve the rendering speed and user experience in the given document.

Operating Instruction

You might want to add the width and the height attribute to image tags whenever possible.