Google has released a new document to assist developers and SEOs in ensuring that lazy-loaded webpage content, such as images or videos, can be easily crawled, efficiently indexed, and served in the search engine result pages (SERPs) for the benefit of users. The full guide can be accessed via the Google developer guides.

What is lazy loading? 

Lazy loading is a technique that postpones the loading of non-priority content on a webpage while the page is loading, whereby the content is only loaded when the user or search engine need it. This means that when a user visits a page and scrolls down to read the content, the lazy load configuration will serve a placeholder image in the viewport which will be replaced with the final image when it’s needed. Google’s Lighthouse tool highlights some key lazy loading opportunities, which are categorised as ‘offscreen’ (aka non-critical) images.

Why is lazy loading your images important? 

Many webmasters want to improve their site speed performance, especially since the Mobile Page Speed update became an official ranking factor in July this year, but many aren’t willing to compromise the number of visual assets on their website.

Lazy loading loads only what the user needs to see, maximising the use of data, reducing initial page loading times and page weight, and reducing the overall system resource usage – all of which will lead to improved performance.

While webmasters are looking for ways to defer the loading of non-priority content to speed up loading times, the SEO community wants to ensure that the new techniques follow best practice guidelines, so the content is still crawlable and contributes to ranking signals.

Make sure Google can see lazy loaded content

Current best practice says that content should be loaded within the viewport to ensure Google bots find your content when crawling the site. For websites that offer infinite scrolling or paginated loading, Google suggests providing a unique link to each section that users can share and load directly.

Ultimately, applying the lazy loading technique following Google’s guidelines will lower page load time and payloads, meaning users will only see the assets they need to while cutting down on unnecessary downloads.

Read more about lazy loading images and videos here, and find out more about Google’s new dynamic rendering documents here.