Mobile version (Display Regular Site)

Skip to: Navigation | Content | Sidebar | Footer


Weblog Entry

Effects of CSS-Based Design

December 12, 2002

When one decides to scrap the traditional hacks and kludges in creating an HTML page, and opts to instead format in CSS, the effects can be rather dramatic.

A certain Mr. Z. linked an interesting tool last night, the GetContentSize analysis utility. Stripping all extraneous CSS and Javascript, it will report the signal to noise ratio of your HTML.

mezzoblue, for example, sits at about 45% (which will inevitably change as new articles get posted and old ones removed), while Zeldman is a higher 60%. Both are CSS–only layouts that don’t use table hacks. Let’s look at a few examples of old–school HTML tabling to compare.

As tipped off in September, Microsoft redesigned using a plethora of FONT tags and insanely poor code which hasn’t been changed in the least as of yet. The result is a lofty 8.63% content level which should surprise no one. Seemingly for the benefit of a small handful of 3.x browser users (who view the web as a great big broken mess anyway), presentation code and content are carelessly intertwined, when graceful alternatives exist that were, in fact, developed in part by Microsoft themselves.

Not many of the other big players fare better. Amazon? 11.32%. Yahoo? 15.93%. AOL? 8.0%. IBM? 7.24%.

The question begs itself: so what? Why do these numbers matter? On their own, of course, they mean nothing. But they’re telling of an underlying difference in the way these sites are coded.

CSS–based design is intended to work on any browser that supports valid W3C guidelines. When done right, an external file (or two, or more) control the appearance of the entire site. This means that each new page load happens quicker since the display code is cached. A redesign can potentially be done without touching any of the content files which makes for faster turn–around time. The only possible disadvantage is that anything 4.x and back chokes on most CSS beyond simple text formatting. Which means roughly 6 or 7 percent of the market.

And that’s the key, that small niche. These sites willingly increase load times, add cost to development time, and use 5 or 6 year old standards to deliver today’s web to people who can’t or won’t upgrade to newer technology. That’s why we’re seeing ten percent content in their HTML, because someone in marketing has decided that they can’t risk losing that share.

This is an issue that won’t die soon. Anyone in the development business who understands it willl advocate the use of CSS. In fact, most personal sites and web logs are going this way, and those using the older browsers have been seeing upgrade messages for a while now when they happen to hit these sites. This will only continue, as more and more business and content-based sites come around. Wired was the first major player to move in this direction with its recent redesign. Wired is in an excellent position to do this, since their focus is on the cutting edge. It’s a step in the right direction, and now other developers have a mainstream site to reference when making proposals. The revolution has been slow to kick in, but it has started, it’s happening, and it will continue.


Reader Comments