Lazy loading, also called deferred loading, is an optimization technique for online content, above all for images and videos on web pages. The point of lazy loading is to improve the loading time of a page: resources that sit outside the current browser window are only loaded once the visitor scrolls them into view. Instead of loading every element of a page at the same time, only the objects that are visible to the visitor right now get loaded.
This cuts the amount of data loaded at one time, which shortens loading times and lowers bandwidth use.
How do I enable lazy loading in HTML?
To switch lazy loading on by hand in HTML, you use the loading attribute in your <img> and <iframe> tags. Here is a simple example of how lazy loading is implemented for an image:
<img src="/image-url.jpg" loading="lazy" alt="Description of the image">
In this example the loading="lazy" attribute is added to enable deferred loading of the image. The same works for videos and iframes:
By using the loading="lazy" attribute the developer tells the browser that the element should be loaded later. Worth knowing: every current browser supports this technique.
Why does lazy loading matter for SEO?
Lazy loading matters for search engine optimization for several reasons. One of the biggest benefits is the gain in page loading speed. Because search engines such as Google treat page speed as one of their ranking factors, lazy loading can directly help the position of your website in the search results.
A faster website also gives visitors a better experience, which is a critical factor for SEO in its own right. Deferring content that sits outside the visible area lets server resources be used more efficiently and lifts the overall performance of the page. Lazy loading also brings the bounce rate down, because visitors are less likely to leave a slow page early.
Whether lazy loading is set up correctly on your own pages, and where it still costs you loading time, is one of the points we look at in an SEO audit. More terms around speed and page experience are collected in the SEO glossary.