Why load images that your visitors aren’t viewing? If you’re a photographer who posts images and galleries online, the vast majority of your website’s page load time is probably taken up by loading images.
In this tip, I’ll show you how you can avoid loading images unless the user is viewing them, saving a lot of bandwidth and speeding up page load times. No coding required! We’ll be using the Lazy Load plugin for WordPress.
But first, lets cover some best practices for posting images online:
- Only upload the largest image that you are willing to let others download, save and copy from your site. If you upload the original image into WordPress, everyone can download it.
- Don’t insert the original, high-resolution image into your post. Insert the medium or large version when in the WordPress uploader.
- WordPress compresses your images during the upload/save process. Don’t compress your JPG images below 10 when saving images for the web.
- Name your image files something descriptive. This helps with SEO and file recognition down the road.
Lazy Load Images
The more images you post on your site, the longer it will take visitors to load your website. Lazy loading images improves page load times by loading only those images that are visible to the user. Here’s how to get it:
-
Back ‘Er up.
Hold up! Before making any changes to your site, remember to back up your site. We know it’s a pain. Go on, do it anyway. Try using one of these handy plugins to automate the process.
-
Get, Install, and Activate the Lazy Load Plugin.
- Option 1. Navigate to Plugins > Add New from your WordPress dashboard sidebar. Search for “Lazy Load” (without quotes) in the search box. The first plugin to pop up in the search results should be by Dave Artz. Find that plugin and click “Install Now.” Once the plugin has been installed, click “Activate Plugin.”
- Option 2. Follow this link for the Lazy Load plugin for WordPress and click on the Download button. Do not unzip the file! Navigate to Plugins > Add New > Upload and upload the saved .zip file from your computer and click “Install Now.” Once the plugin has been installed, click “Activate Plugin.”
-
That’s It!
The Lazy Load plugin will improve page load times and decrease overall server bandwidth. Your site visitors will thank you.
I am also using this plugin in my WordPress blog that is very good to use and saved a lot of time to load all the images while users see the browser’s view port via this lazy load image plugin,/a>.
Tell me, did the LazyLoad images is bad for indexing images in search engines? Since the SRC attribute does not get the true picture, eg.
It would be helpful to use to put the picture with the SRC attribute to help index the images correctly?
thanks thad!
Absolutely Rakesh!
I am not getting the images while activating lazy loader pluign. Please help me.
You could also use a method without loading the Jquery file, which should be even faster: http://www.giftofspeed.com/lazy-load-images/ Hope it helps!
Can’t get this to work Thad. Nothing happening.
That’s because your a self absorbed cretin