Posted 3rd July 2013 | By Ean Faragher, Operations Director

For me June was the month of speed! With a week long visit to watch the Isle of Man TT races at the start of the month and then the British Grand Prix at Silverstone at the end of the month.

In the middle of the month my attention turned to website speed – using a basic personal site I decided to make it as fast as I possibly could. Let’s face it, it’s as close as I’ll get to the thrills and spills of motor racing!

Why page speed is important

Google is placing a higher priority on page speed than ever before and it now plays an important part in good rankings, or so we’re told. Google have been experimenting with the idea that page speed is important to the effectiveness and usability of a website since 2010 and there is anecdotal evidence that it can have a real impact on ranking and results, reports of sites jumping from fiftieth position in the rankings to third are not unheard of.

Whilst the basics of SEO are still a lot more important than page speed, for those sites that are following good SEO practice and doing everything else right it can make a big difference in the end result. For competitive terms shaving half a second off your page load times could be the difference between 1st spot and page 5 of the Search Engine Results Pages (SERPs).

Page speed will become increasingly important as the rise of mobile browsing marches on. Hopefully you will have seen all of our posts on the future of the web (it’s mobile, in case you hadn’t guessed) and that at some point in the very near future mobile will overtake desktop as the main way to browse the web. For those mobile users page speed is even more important, if your site takes several seconds to load on broadband speeds imagine how long it will take to load in an area with flaky 3G coverage, or even (god forbid) Edge!

How you can improve your site speed

Now that I’ve brought you up to speed (I’m sorry, I couldn’t resist!) you understand that this is an important issue so below are some tips I’ve picked up on improving a website’s page speed. Before you do anything make sure you have a backup of your site (and test that the backup works, an untested backup is almost like having no backup at all) - try to perform a backup at each stage of modification.

1. Use free tools to measure your progress

There are lots of free tools out there that help you monitor your page speed. Google, Yahoo and others have also given advice on ways to improve your speed that will look good to search engines. I would recommend Pingdom’s website speed test for a simple and straightforward set of headline figures, you can dig further to get more information.

I would also recommend GTMetrix as a tool that incorporates the recommendations from Yahoo, Google and others and explains each element in a bit more detail than pingdom.

2. Keep it lean

Take a look at your website – are you loading unnecessary code? That latest news feed on your homepage (with the most recent article published in 2011), get rid of it. Strip back your site to the stuff you use and get rid of anything that is not being maintained. This is the quickest and easiest way to reduce page size. Next up try to minify your CSS and javascript – essentially this strips out the formatting of your javascript and CSS files, imagine taking a printed book and removing all of the spaces, paragraphs chapter headings etc. You would reduce the size of the book significantly, which is exactly what happens when you do it to CSS and javascript. There are lots of tools out there that will do this for you, some CMS systems even have minifying built in when edits to the files are made. Now target your images – make sure all of your images are optimised to be as small as they can be. If possible consider using CSS sprites for images that you can.

You should try to combine all of your CSS files into one file and do the same with javascript files. There are many tools around the web that will do this for you, some of the minify tools will do this and minify at the same time. Be aware that combining all javascript files into one is likely to cause more problems than doing it for CSS. Make sure you check any javascript functionality on your site after doing this. 

3. Server considerations

Make sure your server is up to the job. If you’re hosting on a shared server make sure that it’s not overloaded, make sure it’s got enough cores, RAM and everything else to serve your site along with those you’ll be sharing with. There are plenty of hosts out there who will offer servers with maxed out RAM, 8+ cores, a redundant network, 99.9% uptime and then ruin it all by loading the server to it’s maximum possible load making sites slower and less responsive.

If you really are looking for speed consider an SSD (solid state drive) server. These are becoming more common as the price of SSD drives drops and more drives tuned for read-intensive applications (like web servers) are released. These servers are usually complemented with flash memory to increase throughput and faster read speeds. The reliability of these servers is also improved as solid state drives are less likely to fail due to the lack of moving parts.

4. Compression

This is another way to reduce the file size that is being served to the user. In the same way that zipping up all those photos makes the file size smaller to email Gzip (or other compression format) reduces the size of your page. The Gzipped file is then decompressed by the browser and displayed to the user in all its glory. This is (usually) much quicker than sending the full uncompressed file for the browser to display.

If available this can be turned on at the server level. Most popular CMSs also include this functionality (although it may be named differently).

5. Content Delivery Networks

No longer the domain of big business, Content Delivery Networks (CDNs) are now accessible to the mere mortal. By making your static content (background images, standard text etc) available from a variety of servers across the globe a CDN makes sure that your visitors are being served the site from their closest server – data still has to travel but it has a shorter distance. Even with fibre networks, distance matters. Dynamic content is still sent from your server, however many CDNs will route the traffic from your server in the quickest way possible - and if that dynamic content hasn't changed they will serve a fully cached version of the site from the nearby server.

One of the more popular CDNs is Cloudflare. They claim that on average Cloudflare is able to load a page twice as fast as your web server. They offer a free service that can be made use of with smaller sites.

The Result

sitemetricsUnfortunately I didn't take a screenshot of the original site speed but Pingdom's history records show it was 3.74 seconds, as you can see it now reads 824 milliseconds.

Following the methods above I've managed to shave off just under 3 seconds on the page load. Seeing the load time drop into milliseconds for the first time was a satisfying experience. 

There is still room to play with, the page size could be reduced further I believe and there's a small problem with a javascript file that if I'm able to solve will reduce the size and number of requests.

I would share my test site however it is a site that will be being used and as such is very much not in a state that I would want to share. Hopefully you've taken a few tips from this and will be able to improve your own site speed with a few simple steps.

Written by Ean Faragher

At ExtraMile we try to take an hour out each week to look around us at what others do and to gain inspiration and to admire people's creativity. Each post in this series is one staff member's take on the world of web, design and things online. We hope you enjoy it.

Image courtesy of and copyright 2013 Phil Long under the Creative Commons Attribution 2.0 Generic license.

Ean

About Ean | Meet our Operations Director

Problem Solving Operations Director