How can you convert 40 percent of your visitors to buyers? According to data gathered by Google, 40 percent of people will leave a website if it hasn’t loaded in 3 seconds. This means if your website is taking longer than 3 seconds to load, about 40 percent of your visitors are leaving your site before they ever see what you have to offer.

Page speed is also one of the benchmarks taken into account in regards to SEO and ranking well in search engines. The faster your website is, also means your site is delivering a better experience for the user.

So, if you make your site faster, you win with Google, you win with your visitors, and if you’re selling something, you also win for yourself: WIN-WIN-WIN scenario.

I wanted to make sure my site was part of the triple win situation. So, my first step was to get a benchmark of where my site currently ranked in page speed.

Get Your Starting Point

There are several tools you can use to get a starting point, but I used Google PageSpeed Insights and GTMetrix.

My starting point:

  • Mobile Speed Ranking According to Google’s PageSpeed Insights: 63%
  • Desktop Speed Ranking According to Google’s PageSpeed Insights: 79%
  • Overall Speed Ranking According to GTMetrix – 84%
  • Average Speed: 75%

mobile pagespeed beforepagespeed desktop beforegtmetrix before

Implement the Changes

Both GTMetrix and Google’s PageSpeed Insights give you suggestions and tips about how to go about fixing the issues causing your site to be slow.

Example Recommendation from GTMetrix:

optimize images recommendation gtmetrix

I suggest start out fixing the Google PageSpeed Insights suggestions first. Then, start fixing the GTMetrix suggestions because if you fix a majority of the issues from the PageSpeed Insights, these issues will be fixed on GTMetrix as well.

WordPress Plugins I Recommend

The biggest issue I had was needing to eliminate render-blocking JavaScript and CSS. To keep this simple, this means there are JavaScript and CSS files being loaded first aka before the content on your site. So, you need to stop it from loading first, either by having load simultaneously (async) as the content on your site or have it load after the content is loaded (defer).

First, I tried the W3 Total Cache plugin, because I’ve used it in the past on other sites and I like that is has a lot of features in one plugin without the need for multiple.  but it also caused some unexpected results on my site. Mainly, it was causing my SSL certificate to not serve to visitors and taking my site down completely. So, I had to search for another solution.

It helped speed my site up, but it also caused some unexpected results on my site. Mainly, it was causing my SSL certificate to not serve to visitors and taking my site down completely. So, I had to search for another solution because having my site randomly offline at unexpected intervals was not going to work in the long run.

With some help from an article about render-blocking content from Kinsta, I ended up using the Async JavaScript and Autoptimize combination.

These two plugins solved my JavaScript issues, but they didn’t resolve my CSS issues. I also needed a plugin that was going to help me with caching pages aka browser caching. I ended up using the following three plugins for a triple threat attack:

The last major issue I had was image optimization, which you can see from the GTMetrix screenshot from earlier. To resolve this issue, I used the WP Smush plugin.

Disclaimer: These plugins won’t resolve all of your issues and not all of them work out-of-the-box. Some will require you to enable or disable features in the settings for you to get the best page speed score and best experience for your users.

I highly recommend you do one fix recommended by Google PageSpeed Insights, and then re-run the test to see if the plugin is helping your score or making it worse. Once you find the setting that works for you, move to the next recommendation to fix and keep doing the same system. Fix one, re-run the test, check results and tweak settings until satisified, and repeat until you can fix a majority of the issues.

Speed isn’t the end-all-be all. Always remember, users first.

End Results

My site can be improved more, but at this point, I’m satisfied with the speed and I’m also not sacrificing user experience or site usability just for speed. You need to be careful of this. Make sure the changes being made to the JavaScript and CSS on your site aren’t breaking the design.

For example, I ran into a issue where I was able to get a score of 98% for my homepage, but my blog wasn’t loading any posts because of a CSS setting I had enabled in the Above the Fold plugin.

After I resolved the issue of getting my blog posts to load and still have a site loading under three seconds, these are my final results as of 01.15.17:

  • Mobile Speed Ranking According to Google’s PageSpeed Insights: 84%
  • Desktop Speed Ranking According to Google’s PageSpeed Insights: 94%
  • Overall Speed Ranking According to GTMetrix – 97%
  • Average Speed: 92%

pagespeed mobile final resultspagespeed final results desktop

gtmetrix final results

You can see based on my average speed of the starting point and the end result, I was able to increase my site speed by 17 percent.

Is your site running as fast as you’d like it to? – Tweet This to Share

Discussion

comments