It’s (hopefully) no secret by now that having a slow website can be really bad for business.

1) People hate slow websites – 40% of people will abandon a website that takes 3 seconds or more to load, and 47% of consumers expect a website to load in 2 seconds or less. [source]

2) Google hates slow websites – there is a plethora of evidence that you’ll be punished in the search engine results for having a slow-loading website.

There are tools available online that you can use to measure your site’s load speed; among the most popular are Pingdom and Google Page Speed Insights (though you may drive yourself crazy trying to get a perfect score with this one). As promised, this article comes with a little case study from one of our client websites. Here are before and after screenshots from Pingdom showing the improvements made to the MKS Accountancy website. 1.83s as a starting point isn’t bad – but who wants just an okay load speed when you can have an awesome one!

Here are the 3 most significant things that I did, along with the tools I used. This process is replicable across most small/simple local business websites. While larger sites and e-commerce stores won’t get quite as fast as this, they’ll definitely see an improvement. So, let’s begin!

Optimise images

This is probably the most significant step in terms of reducing the overall file size of your website. You’ll notice in the above screenshot, that the MKS site is only ~750kb big – that’s the entire site! We regularly come across sites with single images that are 2-3MB+, which has a detrimental effect on load speed as you’d imagine.

The general idea here is to find the balance between compressing the image file size, and retaining as much picture quality as possible. Here’s an example (below) – see the different levels of compression?

There are a number of ways to do this. There are (some free, some paid) plugins that will compress your images such as WP Smush, Ewww Image Optimizer , and plenty of others. I used WP Smush for this site, which was mostly successful. There were a couple of images that I went on to manually compress as I thought the results could be improved. For this I used jpeg optimizer and tingpng (depending on file format, of course) – simply upload your image, select compression (generally start at around 70% compression and go from there), then download the new image.

 

Remove Query Strings From Static Resources

If you went ahead and ran your website through the Pingdom speed test, this is one common thing that crops up, maybe you saw it?

What? Yeah, don’t worry about what that actually means, here’s how to solve it – it’s easier than you think.

  • There’s a plugin for it – literally called ‘Remove Query Strings From Static Resources’. In this case, all I did was install the plugin and activate it – problem solved.
  • If that didn’t work for one reason or another, you can also try editing your functions.php folder (easier than it sounds, bear with me). Find this by going to appearance -> editor, then looking to the right sidebar where your templates are:

Next, simple copy the code below, and paste it at the very bottom of the file. Click update and you’re golden!

function _remove_script_version( $src ){
$parts = explode( ‘?ver’, $src );
return $parts[0];
}
add_filter( ‘script_loader_src’, ‘_remove_script_version’, 15, 1 );
add_filter( ‘style_loader_src’, ‘_remove_script_version’, 15, 1 );

 

Leverage Browser Caching

Another common recommendation based on speed tests. In a nutshell, browser caching is when your browser saves some of the resources on a web page (such as your logo, CSS files, etc.). This means that, after the first time loading, subsequent loading times will be faster. Once again, lucky us – there is a plugin that can help with this.

I used (and recommend) the free version of W3 Total Cache. Get it installed and activated, and I’ll show you the settings I’m using below. A lot of settings can be left to default – if it isn’t mentioned here, there’s a good chance you don’t need to do anything with it.

First, you’ll see a new tab in the left sidebar called Performance. Navigate here then go to general settings, then ensure these sections are as shown:

Next, come back out of General Settings and go to Browser Cache on the left sidebar, then see these settings:

(same page continued)

Once you’ve done all those things, try running your website through a tester again – hopefully you’ll be impressed with the results. Let me know how you get on!

Thanks for reading!