The truth is, in today’s world, people won’t wait for slow site speed to load. They will go somewhere else and a potential visitor has gone, possibly for good.
Site speed is often overlooked or worked on when the site is launched and assumed all is good moving forward. However, site speed is now a Google ranking factor. That means there is a very real risk of mobile visits not seeing your site in the search results if Google knows the site speed is slow.
WPEngine go as far to say that:
‘Slow page load times are like kryptonite. A one-second load time delay results in 7% fewer conversions and hurts your bottom line.’
Site speed is a critical factor in running a successful website and so it’s important to dedicate time to getting it right.
Site speed can get technical and can often need the help of an experienced web developer. However, this doesn’t mean there aren’t some site speed fixes that you can implement which can make a difference.
How to Monitor Site Speed
100’s of element impact the speed of your site. However, most of the time the biggest impact is caused by a small number of common issues.
This is what we are going to cover in this article.
Before we delve into the causes of slow site speed, it’s essential to know the accurate metrics for your site. Without actual numbers, it’s hard to know if your site is running slow and what is likely to be causing it.
There are lots of tools that can test your site speed, but we tend to focus on these two:
Google PageSpeed Insights
It’s Google’s own tool, so you can be sure the advice it gives you is worth listening too! It can get a bit technical on here but it’s a solid place to test your site. If your score well here you can be sure everything is working correctly!
GTMetrix.com
Alongside PageSpeed Insights we use this tool as it can often give a lot clearer explanation of the issues. It’s clear to see the basics and in a lot of places even goes a step further and gives you advice on the changes.
Signup for a free account. You will be able to save your tests and jump ahead of the queue of guest users waiting for a test. This can save a lot of time especially doing repeated tests!
In fact…
We would also note that it’s important to test multiple pages on your website. Don’t just optimise your homepage and assume all is well, check your popular pages too.
You don’t want an amazing piece of content suffering because you left some huge images in it and slowed the whole page down!
Also, something to mention is that most tools will give you an overall score. One of the main things we tell all clients is to not overly focus on these.
Having a top score is great but focus instead on the metrics and the user experience! It’s hard to get 100% on page speed but as long as the site loads fast you are doing a good job!
Basic Site Speed Metrics
Both of the tools above are very simple to use. You enter the URL for your page such as https://www.example.com and they will run their own tests and come back with a report.
Although the terminology of these reports differs there are some key metrics that you can focus on. These will give you the headline of your site speed.
Here are examples of both tools using google.co.uk for the example test. (This also shows that even Google doesn’t get 100% scores on it’s own tools!)
PageSpeed insights
GTMetrix
Fully Loaded Time (GTMetrix) / Time to Interactive (Page Speed insights)
This is the metric we focus on most as it is arguably the main result; the one all other aspects of site speed result in.
This shows you how long a page takes to fully load and be usable. Google’s own tools such as Search Console recommend under 5 seconds. In the real life, this can be tough to achieve as it can be based on lots of factors.
GTMetrix reports the average load time is 8.0s based on all its tests but we would definitely be aiming for lower than this!
Total Page Size (GTMetrix)
This is often the biggest cause of a low score and slow load times.
Even with modern phones and fast 4G (and soon 5G) connections, the smaller the site is to load the faster it will run.
GT Metrix suggest the average page size is 3.16MB however every site is different and even pages within sites will be different.
For example a text only page will always be smaller than one loaded full of interactive elements such as images and videos.
HTTP Requests (GTMetrix)
Let’s keep this simple. A HTTP request is anytime your browser needs to go back to the website for a piece of data and has to wait for that data before continuing to load the page.
The more complicated your page the more requests likely to be made.
This isn’t just the images and text on your page. It includes all of the code such as JavaScript; often scripts are the biggest cause of a hight number of requests.
If your page has all the bells and whistles such as…
- Slider
- Gallery plugin
- Contact form
- And Others
… All of them will have their own set of code that needs to be loaded!
So be sensible if you’re struggling with this.
Do all of the trimmings actually help the visitors? Or is it more showing off what you can do?
To give you an aim the average on GT Metrix is 88 requests.
Common Site Speed Mistakes and Quick Wins
Site speed issues often boil down to a few key issues which often have some very easy fixes!
A lot of our recommendations and fixes are related to WordPress as it’s what we use most and such a popular CMS. However, the same rules apply to all sites so it may just be a slightly different tool you need.
Optimise Images for Web NOT for Masterpieces!
By no doubt this is the biggest cause of slow site speed. Large page sizes are something that you can save a lot of headaches by preparing them in advance.
When adding an image to a website you only need the image to be as big as the biggest place it shows on the page.
If it’s just a small image alongside some text, don’t upload an image that could easily fill your screen! As well as physical size (height and width), don’t forget the resolution and image origin.
Just think, modern phones can take high-resolution pictures which can easily be 10MB and more! This is far more than your website will need, keeping in mind that the average page size is 3.16MB.
It doesn’t take a genius to see the impact a few large images could have!
How to Optimise Images
There are two easy options to considering when optimising images:
- Optimise them before they go online
- Or use a tool afterwards.
We recommend optimising images using tools like Photoshop prior to uploading. Why upload something that takes up space and then have to fix later down the line?
If you have already uploaded all of the images it’s not too late to sort it.
There are numerous image optimisation plugins available which can scan your site and fix large images.
As with all things, a number of the better plugins do have a cost attached however the benefits nearly always outweigh the cost.
There are however a number of free versions available to make a start. Try these out first and then move to a premium plugin if needed.
One plugin we recommend is Smush from WPMU Dev and its Pro version
It’s a solid plugin that’s been around a long time. When dealing with a lot of images on your site, the added functionality of the pro version can really make a difference.
Poor (often Cheap) Hosting
This is often the hardest one to fix. If your hosting isn’t up to scratch, your whole site speed will suffer regardless of how much you optimise it!
Good hosting is essential and something we spend a lot of time researching and testing on.
It doesn’t have to cost the earth but if you find one that is super cheap, ask yourself why!
One of the key metrics that show poor hosting is the Time to First Byte (TTFB).
At its simplest, this shows you how long after typing a web address into the browser that it takes the web server to start responding.
This is effectively dead time as nothing is being loaded here so keeping this to a minimum is key!
This is often the biggest factor that is hindered with poor hosting. It can also be due to the complexity of the page so it’s important to keep testing.
Leverage Browser Caching
On a typical website, a lot of content on pages is relatively static, such as logos, fonts and images.
Without caching, every time someone loads a page the browser will have to download these assets. Can you imagine how much this would slow down your load times?!
Some browsers like Chrome will do their best to store certain files to help this. However, there is a lot you can do on your website to make this even more effective.
By using a caching plugin such as W3 Total Cache for WordPress you can hugely improve this caching and force the browser to cache even more of your website.
This means that every time someone loads a new page, they will be loading less from the server. This speeds up their experience but also reduces the amount of data on your server!
There are numerous caching plugins, and which one works for you often depends on your hosting company so it’s always worth asking them for their own recommendations.
Use a Content Delivery Network (CDN)
Taking this a step further for larger sites, a CDN can really help you boost your site. Instead of your static content being loaded from your web server, the content is distributed across a network of CDN servers. The site will then tell people which one is the best one for them to use to get the data quickest.
A CDN can sometimes be complicated to setup and often there is a cost attached but for a large site it is something we would always recommend.
It is always useful to talk to your server host as they may well have a CDN offering for free or discounted with your hosting package.
Defer parsing of JavaScript
On complicated websites such as eCommerce sites, there is often a lot of script involved for elements like showing the items in a cart and working out shipping prices.
Although a lot of the script is essential, it doesn’t always have to be loaded straight away.
By deferring script using a plugin you can tell the website to delay loading non-essential script until the rest of the page has loaded.
That way you can save precious loading time and get the user to the page faster whilst the code loads in the background!
Remove Unused Plugins
This is one of easiest to fix. If you have plugins on your site that are not being used turn them off!
Let alone the security risks of having plugins on your site you don’t use, there is no point in loading code for them.
Have a look through your plugin list and turn off anything you’re not using. If it’s something like an export plugin for your data, there is nothing to stop you deactivating and reactivating when you need it.
Useful Site Speed Tools
There are numerous ways to fix the issues above and it’s important to find something that you can work with and understand.
On WordPress, there are 100s of plugins related to site speed. Some focus on a specific task such as image sizes whilst others group all of this under one big tool focused on your overall site speed.
For those with a less technical mind these are often the best place to start as they talk you through the basic settings and get you up and running quickly.
Most of them will have plenty of advanced settings for you to tinker with if you’re brave enough but getting a decent tool could save you a lot of time.
One of the tools we love at the moment is WPRocket. It is a paid tool but we find it’s worth every penny.
It does the basics extremely well with enough advanced settings to keep a geek busy for hours!
It will help you through the initial setup. If you have taken our advice in this article, that will often be all you need to do to see some improvement!
Website Backup
It should go without saying that you should be backing up your site often.
This is essential when working on the actual running of your site as you are going to be making changes. Don’t forget, there is always the chance something unexpected happening, especially when pushing the site speed to its limits.
So, backup your site before you make any changes.
The easiest way to back up your site is by using a plugin but depending on your hosting they may already offer this.
Site Speed Testing (and testing, and testing…)
Working on site speed isn’t always a quick process so do this in stages.
Changes like reducing image sizes are beneficial. But, when you start working on jobs like caching, it doesn’t always have the intended results depending on your site and its hosting.
Our advice is to make a change, re-test the speed and monitor it’s impact, before moving onto another change.
Also check the actual site and see how it’s running.
Just because a tool says the speed has improved, make sure the site is loading correctly. Do the images load okay? Does the functionality work? And so on.
The more you get under the hood of site speed the more there is a chance of breaking something.
It’s not an issue with the right tool and a backup, as you always have the ability to undo a change. The worst thing you can do is not look through your site afterwards and miss something broken that will impact the user experience!
However tempting it is, don’t chase a score, chase the user experience!
There is no point getting 100% site speed score if you’ve had to turn off most of your site.
It is always a balancing act between a fast site and a working site, so find what works for you using our recommendations above
