I recently stumbled across GTmetrix, a great tool that gives you a nice view of how quickly (or slowly) your web pages are to load, and how best to improve them.

It didn’t take long for me to get obsessed with pleasing it – my initial grade was C (75%), and I’ve got a few tips for those who also want their web page to load quickly. Apparently, it uses YSlow and Google Page Speed, the latter of which has been hinted at being included in Google’s search algorithm.

Some of the stuff is a bit OTT, such as combining javascript files etc. I did it anyways, as I only had Jquery and Cycle to combine, but some of the tips are really good, especially image compression.

Image Compression

One of the best tools I discovered doing this was Yahoo Smush, a superb tool that managed to compress images into smaller files without losing any quality whatsoever. I think once all my images had been combined, what with css and slideshow images etc, I’d saved about 30 – 50% of file size, which is fairly good!

SmushIt is easy to use and provides consistently good results, it’s completely free and has a variety of options for uploading images etc. definitely recommend this.

Minimising CSS and Javascript

This is another area which at first I was dubious about, my programming style is very indented and commented with a great deal of line spaces and what not. The idea of grouping everything together didn’t appeal to me much. That said, the javascript files I was using, I can barely understand anyways, so they were okay to compress. Then I decided that saving a minimised version of my CSS as well as a version I could use for editing was the easiest way forward, relatively unnecessary, but I’m a sucker for ticking all the boxes.

Apache Configuration

The killer, is configuring apache in order to send content encrypted with gzip and to add the correct cache expirations headers. This. took me. absolutely. ages. Mainly because I wasn’t editing the .htaccess file properly, or more like I was, but Coda wouldn’t allow me to upload it correctly. I still haven’t found a way to fix this, so I had to do it with Filezilla on my netbook. The actual configuration is below:

I’m no expert with apache handlers or anything, so use at your own risk. But this piece of code ticked all the boxes with GTmetrix and such. The logic behind it seems fairly simple, caching the data that is unlikely to change, which means the number of requests to the server can be reduced dramatically. Once the user has loaded a page for the first time, the rest should load like wildfire, so it’s definitely worth implementing. As well as that, it then allows for all the data to be compressed with gzip and that will also speed up requests and such.

I can guarantee that the above works for GTmetrix as well, meaning it pleases Yahoo and Google in terms of speed. You’ll no doubt see that for yourself if you implement it