Medium This Hint is worth investigating further, and may warrant further attention depending on the type and quantity of URLs affected. Issue This Hint represents an error or problem that needs to be fixed.

Loads hidden images

This means that the URL in question contains images which are not visible (their style 'display' property is set to 'none', or one of their parents is).

Why is this important?

Browsers will load in images, even if they are not displayed. This will increase page load time and potentially waste additional bandwidth if the user does not end up seeing them.

What does the Hint check?

This Hint will trigger for any internal URL with images that are hidden, where such images have a height and width greater than 1px (in order to exclude tracking pixels from triggering the Hint).

Examples that trigger this Hint:

The Hint would trigger for any internal URL which has at least one image with the display property set to 'none':

<img style="display: none;" src="/images/matilda.png" width="300" height="300" />

How do you resolve this issue?

The first question to answer is: what is the purpose of the hidden images? Perhaps they are there as part of an interactive design, where they are not supposed to be visible initially.

Assuming they are not there intentionally, hidden images do not add anything to the user experience, and have the negative effect of increasing load time, so they should simply be removed.

Ready to try Sitebulb?
Start your free 14 day trial now

Start Free Trial