CSS Presentation

An interesting link from Tom about the use of CSS. It covers basic techniques, but more interestingly covers some of the stats to do with bandwidth savings and page weights. A brief overview: using proper CSS2 and XHTML can radically reduce the size of your pages, because you need less markup in the actual HTML itself. The results can be pretty stunning:

ESPN redesigned their site using CSS2 and XHTML:

• Page reduction (est.) 50 KB
• Page views/day: 40,000,000
• Projected bandwidth savings: 2 terabytes/day
• or 61 terabytes/month
• or 730 terabytes/year

730 terabytes a year!!! That is a whole lot of saved bandwidth just from redesigning your page.

They also include some stats about Microsoft's website before and after redesign:

	Old	New	Savings
Versions	2	1
Tables	40	0
Spacer gifs	35	0
HTML	40 KB	15 KB	62%

62% savings? Thats pretty good. So, I thought I'd carry out some of the same analysis on the current version of World.Cwintra.Com:

	World
Versions	4
Tables	18
Spacer gifs	0
HTML	33 KB

This isn't actually as bad as I feared - the different versions are far too high (we have different stylesheets for each different browser type), but I was surprised to discover a lack of spacer gifs, and although the page weight is quite high, it is the homepage, which will always contain a lot of content. The "Selling To Customers" area homepage was down to 24KB.

So, we're not as bad as Microsoft were, but we could still remove those 18 friggin' tables, in my opinion. If anyone cares to spend the time trying to work out the bandwidth savings this might give us, then please go ahead and post it!