May 25th 2017

The need for (webpage) speed

by Rich Milner

Website speed is one of those things that doesn’t even cross your mind until you visit a site that is really slow - then it’s just really frustrating right? Especially on mobile.

What I’m aiming to do in this article is explain what page speed is, why it’s important, and run through what effects it. Then give you some handy tools to review your website speed and how to improve it—AND you don’t have to be a developer to make improvements—good eh?

Why is website speed so important?

In the simplest terms, now more than ever, people have a short attention span and time is incredibly precious to them, so they’re not really up for waiting for things - especially a simple webpage to load. All they need is for the content of your webpage to load quickly so they can be reading, watching, tapping, snapping, as fast as possible.

Google also realises this, which is why they’ve started taking this into account when ranking sites on their search engine. They want to look after their users as much as you should want to look after yours. Therefore, if they’re seen to be sending traffic to sites that aren’t loading in an acceptable amount of time, they’re giving their users a bad experience. Now website speed isn’t the be all and end all for Google; whilst it’s a factor when it comes to rankings, content and relevancy are still king in this area. So don’t let this article scare you too much - the main point is that it's something you should consider as part of your digital strategy.

At the forefront of the page speed conversation is the loading times on mobile devices. This is becoming more and more integral as we move away from our desktop devices to completing everyday tasks on our mobiles.

Facebook speed

Page speed

So what is page speed? What factors effect loading speed? How do you improve your page loading speed? 

Page speed can be defined in the following two ways:

  • The amount of time it takes for a single webpage to display all of the content within the page
  • The amount of time it takes for the website to ‘first byte’ - i,e. the time it takes for a website to call the information from the server where it’s hosted

There are a lot of factors that go into determining a website’s load speed. As you can probably imagine, the different functionality of the website will be a bearing. If you’re just hosting a copy-heavy blog, your website isn’t going to have a massive amount of weight behind it. Then again, if you’ve got loads of high resolution images conveying your brand or personnel etc., you may well have a problem.

Top 5 things effecting page loading

1. Server

This is where time to first byte (TTFB) comes into play and there are a few things that it will be dependant on. There is the time it takes for your website’s request to reach the server - and at it's fastest this request can only travel as fast as the speed of light (we're not time traveling here) - then your server has to respond with the goods.

Essentially, it gets broken down into the following steps:

  • Your website looks for the server
  • Once found, it makes a request and connects
  • It waits for the server to respond
  • Then receives the response and voila! Your site has loaded

I could get way more technical and discuss latency and bandwidth, but you really don’t need to know that stuff… Still with me..?

2. Image size

This can easily hammer the weight of your website if you’re not careful - and if they’re on the homepage, you’re absolutely in trouble. I’ve visited several websites in the past week and seen carousels on the homepage, consisting of 4-5 images - all 2mb or above. This is utterly disastrous and will slow your page loading time significantly. Before uploading images to your CMS, make sure they’ve been optimised for the web. You can do this using handy sites like this: https://compressor.io. This is a great place to start when trying to improve the speed of you site - you don’t need to be a developer, you can do it through the CMS of your site. If you're going to begin optimising pre-existing images on your site and replacing them, it’s always best practice to delete the original image from your CMS media library once you’ve switched them. 

3. Minifying code

This is a task for a developer. It refers to removing all of the unused code that exists within your site. If you think of your site as a racing car, this task would be getting rid of the back seats, head rests, spare tyre in the boot and anything else that isn’t necessary to make the car work, but will increase its performance in a race. 

4. Browser caching

This is where the browser will cache the content of the site after a user has visited your site once. This is great for repeat visits as the server won’t need to deliver all content of the web page every time, thus speeding up the experience. 

5. Enable compression

This can be done by using a program called GZIP (which is also a file format). When used, this reduces the overall size of your code, making it quicker and easier for your server to provide the content to load your webpage.

Before you start looking into any of the above issues in order to speed up your website, you can measure its performance using Google’s test my site. Simply add your URL and Google will give you a handy report on areas which require improvement. This will be a good place to start when improving your speed. Google aims for a page load time of under half a second, which is a good benchmark for everyone. Try putting your competitors sites in the here, see how you stack up against them.      A more in-depth look under the bonnet can be done using webpagestest. We’ve put our own site through the test and benchmarked it against some of our favourite sites and we’re not looking too bad as it goes!!* 

webpagetest

*Even though this may seem impressive, it’s not really a fair benchmark to make. These sites all work in different ways, host different content and deliver different functionality. That being said we have worked hard to keep our page speed down.

So now we’ve discussed the the things that effect the speed and how to improve it, let’s talk further about why it’s important.

They’ll leave your site as quickly as they found it

The need for speed comes from users’ impatience to wait for content. And really; why should they? Our attention span is shortening; we’re seeing more adverts and pieces of communications than ever before. So us marketeers need to make sure we’re delivering content fast. Last year Google stated that nearly half of your visitors will leave your site if the page doesn’t load within 3 seconds. Now, if you’re running a PPC campaign or paid social campaign you’re going be losing half of those leads between them clicking on the ad and them landing on the site. Oh, and you’ll be paying for the pleasure. ZMOT doesn’t even come into play here as users are off before they’ve even had chance to see what you’ve got to offer. If you’re unfamiliar with ZMOT, you can read a blog we wrote about it here.

So, if your site is particularly slow, it could be worthwhile pausing a campaign and spending that money on site improvements, before flushing potentially great (And pricy) leads down the toilet - who likely will never come back. 

So I've talked about why webpage speed is important and discussed ways in which you can speed it up, but in the end, who is responsible for it? You may automatically assume it’s the developer and you’re partially right to think so, but we can’t put it all on them! Poor buggers... This needs to be considered from the planning phase of any new website build. If a developer receives a complex set of designs to build, full of big images, utilities and moving parts, it’s going to be pretty tricky to keep the speed down, especially on mobile. So bear that in mind when you're writing the brief.