How you can Speed up your Site’s Load Speed by 40%

Site Speed Optimization Lazy Load

There is a really easy way to increase your site’s load speed by an amazing amount. I took one of my longest pages in my God and You site – which is my proposal video to my fiancee – and ran a speed test on it before I applied this performance increase plugin. Here are the results.

Webmaster’s Note: This tutorial is part of the tutorial series “Ultimate Guide to Site Speed Optimization“. The previous lessons consists of as follows:

  1. Must-Have Site Speed Plugin for WordPress
  2. Optimizing Site Speed: Asynchronous and Deferred Javascript
  3. How to Implement Self-Hosted CDN for Site Speed

Disclaimer: I used my God and You site because SEO Hacker blog (this site) is already optimized in terms of performance. You can check out our speed and performance optimization using Pingdom and GTmetrix.

Sluggish

The page loaded really slowly – a whopping 7.29 seconds! Pingdom considerately told me that my site loads slower than 81% of all their tested websites. That’s horrible!
God and You Pingdom Speed Test before

Next thing I did was to look at my GTMetrix report. The page size is pretty consistent with Pingdom. I figured I have to reduce this number. And what better way to reduce a page size than to take away chunks of kilobytes of images?

God and You GTMetrix Speed Test before

So I did a little research and I stumbled upon a term called “Lazy Load” – it’s a method of delaying the initialization of an object (images, videos, scripts, etc.) until it is needed. Sounds very efficient doesn’t it? So I went ahead and sought out a plugin that can effectively “Lazy Load” my images. I tried a handful of them. Some were not too cooperative and some lacked the smoothness I was looking for. So when I found out the perfect plugin, I figured I have to go ahead and share it with you. So without further ado:

Drumroll please!

Introducing…

Advanced Lazy Load! (Clap Clap Clap Clap….*)

Advanced Lazy Load

Now while I don’t know what’s so “Advanced” about this plugin, I do know that it does lazy load pretty well. Let me run you through the options.

Advanced Lazy Load OptionsWell would you look at that! It only has 2 simple options for you to tinker with. The first one is Pixel. Set it as high as you want for the image below the fold to load. Meaning, if your user scrolls down, the next images 1,000 pixels below the visible screen of your user will already load ahead. This is so your users will not wait for the images to load with every down scroll they do.

The second option is ‘Fading in duration‘. I set it as low as possible because I’m not that fond of the images ‘fading in’ anyway. And I think my visitors share my fondness. I want the images to load as fast as possible so as not to waste time.

Here are the results of the speed test after I applied Lazy Load:

God and You Pingdom Speed Test after

The load time was reduced by a whopping 40%! That’s pretty huge – even if I’m still slower than 71% of all tested websites. I’ll have to work on that some more.

God and You GTMetrix Speed Test afterPage size was significantly reduced on initial load. Although we all know that the entire page is still around 2.2mb when all the images in the page are completely loaded. Lazy load just helps save time in the initial loading. It’s a way to cheat your speed and to signal to your visitors that your site loads fast – even if it’s still loading the images during their visit.

Tips for Keeps

I’ll keep this post short and sweet. Download the Advanced Lazy Load plugin. Activate it. Set the options to how I set it. Run it and check your speed using Pingdom and GTmetrix.

Coming Soon on Ultimate Site Speed Optimization Guide: Database Optimization.

From Zero to a Thriving SEO Company, We're sharing everything on our Journey to success!

You'll want to get in. Promise.

We guarantee 100% privacy. Your information will not be shared.

Comments

    • h3sean says

      W3 Total Cache does not have Lazy Load capabilities :) It’s 2 different plugins with 2 totally different performance optimization functions.

        • h3sean says

          I can’t really directly compare them since they are 2 very different plugins. But if you’re looking for overall increase in speed, go with W3TC. An overall decrease in initial page size loading, go with Advanced Lazy Load.

  1. shubhangi srivastava says

    hi sean ,
    Great post about Lazy Load and really i like this but i feel i need more exploration about plugin Lazy Load.

    Thanks for sharing sean

  2. Akash Agarwal says

    I also never used this plugin before. I will definitely try it, hope its help me. Thanks for sharing such great things.

  3. Spook SEO says

    You really shared with us us step by step on how to speed up our site’s load speed by 40%. I will surely use this plug-in in the future. Thanks Sean.

  4. Thomas says

    This is a really important thing to work for, because you know that the audience that remain unsatisfied with the slow speed of a site will not open your site and it gives really a bad image. so take care of this.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title="" target=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>