What are Broken Images in Web Testing?

What are Broken Images in Web Testing?

Hi Matthew,

Broken Image is a link or image that does not work as it should. It may result in a 404 error, broken links or improper file extensions.

From an end-user perspective, broken images have a just as large of a negative impact as broken links on websites. Selenium WebDriver can be used to find broken images on websites, which can then be replaced or fixed.

4 Likes

Thanks Shahzebh,

Can you highlight on the ways in which images are read from the server?

Would love to answer this!

There are two ways in which images are read from the server:

1. Absolute Path

The website uses the actual path (rather than relative path) in the ‘src’ attribute that specifies where to get the image file from. Where the img tag creates a place to store an image, it is needed if you want to show that photo on your screen.

2. Relative Path

Relative paths are used to position an image on a website in the correct location based on a relative rather than an absolute path.

For example, in <img src=”assets/img/image.jpg” alt=”some text”>; the path of image.jpg is relative to the root. If the website URL is https://www.someexample.com, the relative path of the image (image.jpg) will equate to https://www.someexample.com/assets/img/image.jpg

Hope this helps!

4 Likes

That was really quick and helpful!

Can you site major reasons for Broken images on a webpage?

1 Like

Some of the prominent reasons that can lead to broken images include:

  • Incorrect Image Format
  • Incorrect Image URL
  • Deleted Image File
  • Site relocation
  • 301 redirection
  • Unavailability of the server

Check How To Find Broken Images Using Selenium WebDriver?

4 Likes