Having just learned that Google will be looking at website optimization as a criteria to influence search engine rankings beginning in 2010. It’s time for every web designer to hone their skills at several optimisation techniques.

gzip-largeThis post is packed with website optimisation goodness.

It is little known that IIS has the facility to compress files before they get sent to your visitor. The reason so few people know about this is because the compression option is not part of the graphical user interface, but with a few tweaks and a few clicks here and there you’ll be able to save around 70% of your bandwidth, so for anyone with a slow connection to the Internet or bandwidth limitations IIS compression is an absolute boon!

Think your CSS is pretty compact? Sticking everything all on one line, removing unnecessary ;’s from the end of a block is all well and good, but did you know you can GZip these files to?

This tutorial goes through the process of configuring Microsoft’s IIS 6 to compress your CSS files before transmition. The aim is to have the CSS files cached (so you don’t grind your processor to a halt when a page request comes in) so you will be able to make a bandwidth saving of around 70-80% – nothing to be sniffed at!

Firstly there is an article on the Microsoft technet website here: http://www.microsoft.com/technet/prodtechnol/WindowsServer2003 that goes into full detail. I’ll summerise the salient points for you here:

This really is a golden nugget for web designers and well worth reading.

When IIS receives a request, it checks whether the browser that sent the request is compression-enabled. Ever wondered what the HTTP 1.1 tick box was all about? Well now you know.

If the content of the file is static, IIS checks whether the file has previously been requested and is already stored in a compressed format in the temporary compression directory. If a compressed version of the requested file is not found, IIS sends an uncompressed version of the requested file to the client browser while a background thread compresses the requested file. The newly compressed file is then stored in the compression directory, and subsequent requests for that file are serviced directly from the compression directory. In other words, an uncompressed version of the file is returned to the client unless a compressed version of the file already exists in the compression directory.

If the file contains dynamic content, IIS compresses the response as it is generated and sends the compressed response to the browser. No copy of the file is cached by the Web server.

The performance cost of compressing a static file is modest and is typically incurred only once, because the file is then stored in the temporary compression directory. The cost of compressing dynamically generated files is somewhat higher because the files are not cached and must be regenerated with each request. The cost of expanding the file at the browser is minimal. Compressed files download faster, which makes them particularly beneficial to the performance of any browser that uses a network connection with restricted bandwidth (a modem connection, for example).

How to enable IIS native compression

First things first. You will need to make some changes to your IIS config, so before doing anything I suggest backing up your current config.

Editing the IIS6 Metabase – Eeek!

Controling the flow of IIS6’s operations is the file metabase.xml. Some websites suggest that you edit this file using Notepad or similar. The metabase.xml file is not to be messed with and although you can restore from an earlier point if things go horribly wrong, sometimes everything might seem fine, until little quirks start appreaing in your webserver.

There is a simple way around this by using the Metabase Explorer it’s free and can be downloaded from Microsoft here: http://www.microsoft.com/downloads/details.aspx

There is no need to set gZip.dll as a web extension – It’s not a web extension!

Using Metabase Explorer from the IIS6 resource kit go to the following path:

LM > W3SVC > Filters > Compression

metabase-explorer

Expand ‘Compression’ and you will see ‘deflate’ and ‘gzip’, you will want to change both. Hypothetically say you select gzip. Find the key name HcFileExtensions and double click on it. You will now see a box at the bottom of which says <new item> Click on that and add: css and click OK.

Now whenever your CSS files are served IIS6 will check it’s cached & GZipped folder to see if the file is there. If it is the compressed file will be served, if not the file will be served and compressed ‘on the fly’ and stored in the cache folder.

Remember both HcFileExtensions (for CSS) as well as HcScriptFileExtensions (for PHP, ASPX, CFM etc…)

Optimizing Web Performance with AOL Pagetest from Dave Artz on Vimeo.

Yahoo’s Best Practices for optimisation report

http://developer.yahoo.com/performance/rules.html

Still here?

You’re in for a real treat! This post is just one aspect of IIS6 optimisation! There are actually a number of things you can do to make IIS6 even faster, by the time you’re done you’ll have IIS6 delivering pages so fast you can expect all the major search engines to rank you even higher – just out of sheer coolness!

Check out this post!

http://www.caspianit.co.uk/iis6-website-optimisation-for-webpagetest-org/

0 comments

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>