Loading...
As well as why "page load speed matters", on this page you can read about:
Whilst it’s not the most important factor in calculating page rank, Google started including page load speed into its algorithms as long ago as 2010. See the evidence here.
However, mobile web access is growing, especially for local searches, and it is currently slower than home broadband, so speed matters. It’s said that sites lose 7% of e-commerce conversions – and that’s a lot of viewers - for every one second of delay. And users start to abandon a site and return to the search results if it takes more than 3 seconds to load.
Since we support clients in and around Portishead, local search is important to us. So, we thought it would be a good idea to develop some guidelines to help our clients improve their page load speed. Contribute users can keep these in mind when updating their web sites.
Google supplies tools for checking page load speed. There’s an online tool and plug-ins for Google Chrome and Mozilla Firefox. They wouldn’t do this if they didn’t think it important.
Check your home page using Google’s on-line tool here.
Download web browser plug-ins here.
After the initial design, our new home page scored 78 out of 100. Now it’s 98. The page looks exactly the same. We know how to make it 100, but we decided not to do so. All explained below.
First, we started with an empty page, with no CSS and no content: just bare HTML. Then we re-built it, one step at a time, testing it at each stage using Google’s Firefox plug-in. Each time, the tool suggests improvements. We applied the recommendations carefully and tested again. Just occasionally we didn’t following the tool’s suggestions. Other times we played around with several different solutions before adopting the best.
We’ve listed what happened in the table below. Note numbers refer to notes below table.
Step | Page re-build actions | Speed checker recommends | Note | Score |
1 | Empty page | don’t specify character set in meta tag | 3 | 99 |
2 | Empty: no character set, no meta tags | 1 | 100 | |
3 | Added title tag | 100 | ||
4 | Added copy, text only, from home page | enable compression, specify character set | 98 | |
5 | Specify character set on the server | .htaccess character set for all PHP files: UTF-8 | 98 | |
6 | Enable compression, PHP method | 100 | ||
7 | Add keyword and description tags | 100 | ||
8 | Add navigation HTML | 100 | ||
9 | Add logo image | leverage browser caching | 92 | |
10 | Leverage browser caching | Set expiry for images, CSS & JS resources. | 100 | |
11 | Add div, id and class tags in htaccess. | 100 | ||
12 | Add links to stylesheets | Enable compression, specify a Vary: Accept-Encoding header | 96 | |
13 | Enable compression | Added mod_deflate by updating PHP on the server. This seems to fix the Vary: Accept-Encoding header notice as well. | 100 | |
14 | Add Google font | Low priority: Specify a cache validator | 99 | |
15 | Specify a cache validator | Can’t be done as Google webfont is an external resource. Removed Google font. | 100 | |
16 | Add if statement to add PNG fix script for IE6 and earlier versions | 100 | ||
17 | Add Javascript for homepage slider | Experimental rules: Eliminate unnecessary reflows | 99 | |
18 | Eliminate unnecessary reflows | We'd need to remove homepage slider, one point to gain the slider deemed ok. May change to tabbed format in a later design. | 99 | |
19 | Add Google analytics code | Low priority: Leverage browser caching |
98 | |
20 | Experimental rules: Reduce request serialisation |
|||
21 | Leverage browser caching | This would be set by Google so not able to adjust. We like using analytics; overall performance OK so keep. | 98 | |
22 | Reduce request serialisation | We’re using current best practice for adding Google analytics code, so won’t make any changes here. | 98 | |
23 | Add HTML comment tags | Test with basic tags, to see if Adobe Contribute tags will cause a problem | 98 | |
24 | Apply changes to home page and see if Contribute tags cause any problems | Minify HTML | 98 | |
25 | Minify HTML | Chrome’s tool provides optimised code. It removed all Contribute tags, and surplus white space. | 2 | 98 |
We just removed all white space (including space in JavaScript files) and Minify HTML notice fixed. Contribute tags remain OK. | That's all folks. We decided 98/100 is fine | 98 |
Google changes its rules and recommendations frequently. Last time we checked, our static computer score was 96/100. This is the score when using a computer connected via broadband. We check again from time to time but haven't seen anything we feel we need to address ... so far!
Related links :
Google measures page load speed in points to 100. This page's load speed is 97/100, according to Firefox loaded with the Firebug/Pagespeed plug-in.
This licenced image came from iStock Photo.
We explain how a anyone can check their website's load speed in our blog. And do something about it! See our Web Page Load Speed post.
Here at BlueTree we love this techie stuff. If you'd like some help speeding up your website, just give us a call! Bristol 0117 339 0095, or contact BlueTree.