How can I extract images from website?

How can I extract the images URL for products from the website HTML I am scraping? Basically the SRC from an IMG tag. In this tutorial, we will know how to scrape images from html.

Scraping images from a website is same as any other attribute from HTML:

You need to define your CSS selector by clicking on the html elements or by manually typing the CSS class, element id or tag name. Then just select the extract type as ATTR and value as “src” as in the screenshot below.

And if you want to download the images see this page

Lazy Loading

Some websites use the lazy loading technique and the “src” value is changed with some data-attribute while scrolling or loading the page using JavaScript/Jquery.

Be sure to inspect the page HTML to view which attribute hold the actual image URL, because some websites use lazy loading technique and the image is swapped between src attribute to data-src or with data-img attributed, when the pages is loaded on browser or while scrolling the page.

For example this lazy load page - Fade-in

Here, if you see the HTML, the data-src attribute is the one which holds the actual image. So, to extract the image from this page - We need to use the data-src attribute instead the src attribute

Signup now to get 100 pages credit free

14 days free trial, no credit card required!