¶ Following on from Doug Bowman’s recent article on potential bandwidth savings for Microsoft, in which he recounts using CSS to rebuild Microsoft’s home page, I’d like to restate here the points I made in my Ten Questions interview with the Web Standards Group. I talked about the real life benefits and savings we made at Multimap having switched from a table infested layout to CSS:
WSG: I have heard rumours that you have just launched a new-look Multimap. The obvious question – is it built using web standards?
RR: Yes it is, but to be fair it used Web standards beforehand in as much as it validated. We’d got as far as removing all the font tags but the site was still chock full of nested tables and the usual non-semantic mark-up that you would expect to be inherited from a few years ago. We rebuilt the site using meaningful mark-up for two big reasons: ease of maintenance and bandwidth reduction.
The templates used throughout Multimap.com are constructed from heaps of server-side includes. Making changes to the site was a tricky business as any given include might contain one table inside part of another table. Now all the includes are really simple: most just have a div with a proper heading and a list. We’re already noticing the increase in speed with which we can make changes. The move to meaningful mark-up has eased this surprisingly stressful part of the job.
As for bandwidth, roughly speaking Multimap.com serves 4 million pages a day. On average, the HTML of the old site weighed in at 65kb per page. The new site pages are half that at 35Kb. That’s a saving of 40,000 Gb of bandwidth per year! I’ll leave you to translate that into money, but I can tell you the move to Web standards paid for itself within a month.
My final statement regarding the bandwidth (and hence money) savings did not quite pan out as expected. Bandwidth consumption has certainly decreased with the declining page weight but not by the proportion we were expecting. What actually happened was that people starting using the site more. It seems the faster pages (both in terms of bandwidth and rendering) resulted in more page views as people panned, zoomed and searched significantly more than they did before. So not only did the switch to CSS layout save Multimap money, it made Multimap money (page views = banner ad impressions) and quantitatively improved people’s experience (more page views per visit).