Lazy Loading – What Is It and How Does It Affect SEO?

Lazy Loading – What Is It and How Does It Affect SEO?

The slow page loading speed is a real nightmare for everyone who above all appreciates the quick access to the site. In modern world, also this online world, speed counts – fast information delivery, quick reactions and fast page loading. In the era of the Internet, the well-known saying that time is money takes on a whole new meaning. According to the data provided by Google, a website that loads longer than 5 seconds is exposed to as much as 40% decrease in conversion rate.

Latest on our blog: Delante Recognized as an SEO Leader in Poland on Clutch

Lazy loading – what is it?

Lazy loading is simply a script entered into the code of the page which causes that images and video files don’t load as soon as the users open the page, but only when they’re in this part of the website where the images or videos are located.

Lazy Loading

Therefore, thanks to lazy loading you can profit from the transfer and the efficiency of your website which loads significantly faster and at the same time contributes to the customer satisfaction. This, in turn, makes it more probable that the users will stay on the website and as a result increase your conversion rate by, for example, buying something from the offer, signing up for a newsletter or filling in a contact form. You’ve probably noticed that the name of the script is slightly peculiar and might be misleading, as many can think that the tool is intended not to speed up but to slow down the page loading. However, this isn’t the case. We could define lazy loading simply as loading images on demand which significantly speeds up the initial page loading. How does it work? Well, many users don’t even get to the place where your image is located, so it’s pointless to load it right away along with the whole content. Eager loading is the exact opposite of lazy loading, here the whole site including images and other objects is loaded at the very moment of entering the page.

Lazy Loading - jak wygląda?
Source: https://searchengineland.com/google-makes-lazy-loading-seo-help-documents-available-307697

Currently, people pay more and more attention to the speed at which website is loaded both on the computer and on the phone or tablet. Users and enthusiasts of social media, especially those in the form of mobile apps, may have come across lazy loading already two years ago while they were using Tumblr for Android and iOS.

CO to jest lazy loading
Source: https://www.xda-developers.com/google-chrome-image-lazy-loading-speed-up-page-loading-mobile/

Slower means faster

In its official guidelines, Google states that the loading speed of the website is a ranking factor affecting its positioning. Maybe it’s high time to think about it carefully and prioritize your online work so that you can improve your search results and customer satisfaction. We can distinguish several factors that influence the loading speed of the website. As you’re only a website owner, you don’t have control over such aspects as the quality of the user’s Internet connection. The only thing that you can bear in mind in this situation is that not everyone has a fast Internet connection and not every telephone network provides satisfactory bandwidth in every corner of the world. But, on the other hand, there are numerous factors that you can easily influence. If the website loads slowly, then the hosting server is first to be blamed. It must have sufficient performance so that the slowdown of the website isn’t noticeable for the users, especially when the website traffic increases. And the last factor is entirely dependent on you as the person managing the site because even the fastest server won’t be able to improve loading speed of a heavy website.

It’s a good idea to start working on speeding up the website by reducing its size, number of scripts or unnecessary codes. The latter issue in the case of lazy loading is a bit problematic, but this will be discussed and explained a little later. Now let’s focus on how to reduce your page weight. First of all, take care of the size of image files and their optimization, so that the image doesn’t download for too long at the time of the request. Then, get rid of those scripts and plugins that aren’t needed and essential for the proper functioning of the website. And finally you can also move JavaScript code to the bottom of the page. For more information go to the guidelines for webmasters: https://developers.google.com/web/tools/lighthouse/audits/blocking-resources

The technique of lazy loading was applied among others by NY Studio+107, which increased their page loading speed from 107.8 to only 2.8 seconds. Impressive, isn’t it?

How does lazy loading affect SEO?

A fast website definitely allows you to increase the effectiveness of various SEO activities. Additionally, it doesn’t require investing any money and will help you to win users from both organic and paid search results.

Here is a sample code using lazy loading technique:

Kod lazy loading
Source: https://zahidaramai.com/blog/seo-lazy-loading-images

As soon as the user reaches the point on the page where the graphic is located, it’s loaded and displayed. Everything seems perfect, but there is one more very basic question – what about Google robots?

Unfortunately, search engine bots prefer such websites that can be easily scanned using only HTML code. Nowadays Googlebot can properly crawl and render Javascript based on Chrome41 – but it often causes difficulties and challenges when it comes to indexing your website correctly. So while there will be no negative effects for the users, as the graphics will be displayed in the original size exactly when it’s needed, it may be a bit problematic for the robots as they may not notice it. However, there is a way to achieve a win-win situation.

We fully recommend you to see the video prepared for webmasters by Google: https://www.youtube.com/watch?v=PFwUbgvpdaQ&feature=youtu.be&t=33m

How to deploy the lazy loading script?

As we’ve already mentioned, lazy loading is implemented through making changes in the code of the website. The code can be written by the programmer, nevertheless using ready-made CMS plugins like WordPress or Javascript is definitely an easier solution.

Lazy loading for mobile devices

According to Google, more than 50% of searches come from mobile devices so you can easily notice how much potential lies in this form of technology. However, the greatest risk of limited bandwidth concerns exactly mobile devices. Here, there is also no need to display images in high definition right after entering a website so it’s a good idea to also take this aspect into consideration during mobile optimization.

  0 / 5 ( 0 )
Author
Junior SEO Specialist - Ola

Junior SEO Specialist

A graduate of philology who loves Polish language and writes texts so that not only Google robots have fun reading them. In Delante since May 2018, in the SEO industry since less than a year. He juggles with words and races against the competition for higher and higher positions in search results. Lover of memes, word games, live music (from Bach to Beyonce), veggie cuisine, interjections in parentheses and raccoons.

Recently on our blog

Are you curious about SEO of online stores or maybe you want to enter the Swiss market and wonder SEO abroad looks like? You will find answers to these questions and many other tips important for the development of your business on our blog.