When it comes to Search, one of the most neglected areas that could enhance your overall traffic and revenue performance is making sure users can access your website as fast as possible across all devices.
Research shows that 47% of consumers expect a page to load in under 2 seconds. Some 40% of users will leave a site if it takes more than 3 seconds to load.
Why Does Site Speed Matter?
Around 15 years ago when the majority of users were using a dial-up modem to connect to the internet, most people (myself included) didn’t actually mind waiting 15 seconds for a page to load. It was the norm back then. Fast-forward to today and it’s a different matter: everyone is in a hurry and wants things to happen instantly.
No matter how good your website looks or what it has to offer, if it takes more than 3-5 seconds to load then you’re not only risking the user going to another website, but you’re also losing out on potential revenue.
These recent statistics from Walmart (in the US) and Firefox will catch your attention:
- Walmart – every 1 second of improvement = 2% increase in conversion rate
- Firefox – reducing page load time by 2.2 seconds = 15.4% increase in downloads (that’s 10 million extra downloads per year)
I can’t emphasis enough how important site speed is. Google has been using site speed as a ranking factor since 2010. Think about it: Google’s core objective is to organise the world’s information as quickly as possible across multiple devices, it’s that simple.
Speaking of speeeeeed… I recently wrote about getting started with Accelerated Mobile Pages (or AMPs), and what it means to improve the user experience with fast-loading content that is easily accessible.
What can I do about it?
Here’s a typical chart that shows how elements on your site impact the download speed. As you can see, the biggest cause in slowing down your site is often images:
Here’s a video from Maile Ohye from Google, who gives an overview of the site performance essentials.
GZIP Compression
Enabling GZIP Compression can reduce the size of web pages on your site by 30-50%. GZIP compresses your entire webpage (HTML, CSS, JS, IMAGES) before it’s downloaded from the server, therefore increasing the speed of your site.
All modern browsers support GZIP Compression and will automatically request all HTTP or HTTPS requests. However, your server will need to be configured to enable GZIP Compression to work on your site.
In the example below, you can see the difference when you compress JavaScript, HTML and CSS files on your site.
It’s a simple, effective way to save on bandwidth. As this requires an additional blog post entirely, here’s a great tutorial on how to enable GZIP Compression on your site.
Image Compression
As mentioned previously, the biggest cause in slowing down your site is having large file-size images on your site.
If you’re using WordPress as your CMS, then you can download the following plugins that will automatically compress and optimise your images, meaning your images will load much more quickly:
- https://en-gb.wordpress.org/plugins/tiny-compress-images/
- https://en-gb.wordpress.org/plugins/ewww-image-optimizer/
If you’re not using WordPress for image compression, then the following tools below will also do this:
In the example below, there are 2 images which don’t contain the correct image dimensions, nor have the appropriate image format type: 
To specify your image dimensions, all you need to do is add some code to the image tag. For example, here’s an image tag without image dimensions:
<img src=”image.jpg” />
And here’s an image tag with image dimensions specified that includes both width and height:
<img src=”image.jpg” width=”200″ height=”200″ />
By adding the width and height to your images, it can improve the loading time of your webpage.
Make sure that the actual image has the same dimensions as the area it will be displayed in.
Quick tips:
- Format & Compression – JPEG for photos and PNG for images, vector graphics for logos
- Dimensions – what is the maximum width and height of the image to be displayed?
Tom from Builtvisible saw some great results after formatting, compressing and applying the correct dimensions to each image, with the page load time reducing by over 1 second. This may not sound like much, but it adds additional revenue to your bottom line.
Credit to Tom Bennet from Builtvisible
Minify CSS, JavaScript, and HTML
Another way to speed up your site is by “minifying” your files (which can include HTML, CSS and JavaScript files). Put simply, removing any unnecessary white spaces, characters and comments left in the code by developers will dramatically improve your site speed.
There are many ways you can minify your code – either manually, or by using any of the free tools below. Just copy your code into the boxes and it will do the rest for you.
If you’re using WordPress then you can install Better WordPress Minify, which will automatically minify your code. It’s also worth checking out some of the more advanced options available.
Minifying your CSS, HTML and JavaScript files will improve your page load time. Remember to keep backups of your code, just in case things go wrong.
Browser caching
When users visit your website for the first time, the browser needs to request all the website server files, which – as you can probably guess – will result in a longer load time.
However, by installing a WordPress plugin called W3 Total Cache, the browser won’t need to reload any of the resources when the visitor goes to another page on your site. That means the logo, CSS files, etc. won’t need to be rendered again. Essentially, your web files will be stored in a browser cache, so your pages will load much faster for repeat visitors.
What are the results?
After implementing the previous site speed improvements above for one of our clients, we saw Desktop speeds increase from 53/100 to 83/100, and mobile from 51/100 to 73/100. This improved the average page load time, improving user engagement on the site as well.
What tools do you use to measure speed?
There are a number of tools you can use to improve the speed of your site, the most common of which is Google’s very own Pagespeed Insights. Just enter your website into the box and you’ll be given a score out of 100.
Google will then provide you with a list of issues that are causing your site to underperform, along with insights on how to fix each issue.
There are some other site speed tools that will provide additional issues and insights. For example, GTmetrix will tell you how fast your site loads, both on mobile and desktop, and provides you with actionable recommendations on how to fix each issue accordingly.
YSlow is a Google Chrome extension that sits on your browser. Powered by Yahoo, YSlow analyses other sections of your pages by grading each area and provides statistics that the other tools don’t.
For example, the statistics tab allows you to see the most pressing issues that are causing your website to load slowly. In this case, images are the main culprit – no surprise there then!
