Do you want to learn how to lazy load images in WordPress? Lazy Loading enables your website to load images while a user scrolls down to a particular image. Even you can see this in several popular websites like Goibibo. In this article, we will show you how to easily lazy load images in WordPress.
Why Lazy Load Images in WordPress?
Nobody likes slow websites. According to research conducted by Strangeloop, it was found that a 1 second delay in page load time can lead to a 7% loss in conversions, 11% fewer page views, and a 16 % drop in client satisfaction.
While a website is loaded, it is the image that takes more time to load than anything else. If you add several images to your articles, then each image increases the loading time of your web page.
One way to counter this case is to optimize images for the web and use a CDN service (Content Delivery Network) like Cloudflare CDN or any other Cloudflare alternatives. This lets users to download more than one images concurrently from servers located near them.
Even if you use CDN, you images will still be loaded and will affect the total page loading speed. To resolve this issue, you can slightly delay the image load by deploying lazy load for images on your site.
How Does Lazy Loading For Images Work?
Rather than loading all of your images at one stretch, lazy loading downloads just the images that will be visible on the user’s screen. It replaces all other images with a placeholder image.
As and when your visitor will scroll down your website, images will be loaded and made visible in the browser’s viewing area.
Having said that, let’s see how to easily setup lazy load for images in WordPress.
Setting Up Lazy Load For Images In WordPress
The first and foremost thing you have to do is install and enable the BJ Lazy Load plugin. For additional details on plugin installation, you can check out our guide on how to install a WordPress plugin.
On activating/ enabling the plugin, you have to navigate to the Settings » BJ Lazy Load page and configure plugin settings.
Lazy load can be applied to content, text widgets, post thumbnails, gravatars, images, and iframes. Even, you can upload a custom image that can be used as a placeholder image.
With the BJ Lazy Load plugin, you can even display a low-resolution image in place of the placeholder image. To utilize this feature, you will have to regenerate the sizes of the image. This way, it can generate a low-resolution image version for all your prior uploads.
Make sure that you click the save changes button so that all your changes are saved.
You can then revisit your site to see if the changes have been saved. Now, you can see lazy loading for images in operation.
Lazy Loading Impact on SEO
It doesn’t matter what plugin you use for WordPress lazy loading, what matters is that the plugin you use shouldn’t harm your SEO. Following are two things that you need to cross-verify:
- Ensure that Google can still crawl your lazy-loaded images. You can easily check whether Google is crawling the lazy-loaded images by using the “Fetch as Google” tool that you can find under the crawl section in Google Search Console. If you can still view your images in the source code then most probably you are good to go.
Conclusion
We hope this article helped you learn how to lazy load images in WordPress. You may also want to check out our comprehensive guide on Optimize Video Loading Speed On Your Website.
ByteNAP is one of the best VPS Hosting Cheap Linux server providers in India with 24/7 active support, free SSL & 100% pure SSD Servers that will offer you a blistering fast website experience.