Why We're Building Every Site on Web Standards

This is the first post on a new blog from a new agency, so it should say something worth holding us to. Here it is: every site Brunello ships will be built on web standards. That means clean HTML for structure, CSS for design, and nothing important that only works in one browser. Standards are the only bet that pays off no matter which browser wins.

That sounds like a technical footnote. We think it is the most important promise a web shop can make in 2006. Here is why, in plain terms.

How most sites are built today

Open the source code of a typical business website and you will find layout built from nested HTML tables. Tables inside tables inside tables, with invisible spacer images holding the columns apart. Nobody chose this on purpose. It piled up over the years because tables were once the only way to get columns on a page.

The problem is not how it looks. The problem is that a table-built site welds the content to the design. You cannot change one without breaking the other. Every redesign becomes a full rebuild. And every machine that is not a desktop browser, like a search engine or a screen reader, has to dig through the mess to find the actual content.

The better way

The alternative has been proven in public for a few years now. The CSS Zen Garden site made the case visually: one HTML document, hundreds of totally different designs, because the design lives in the stylesheet.

A standards-based build separates three things. The HTML describes what things are: headings, lists, navigation. The CSS handles how it all looks, in one place. And any scripting sits on top as a bonus, not a requirement. The site becomes a document with a design applied to it, not a fragile arrangement.

What this buys you

• Cheaper redesigns. When the design lives in the stylesheet, a new look is a stylesheet project. The content and structure stay put. That is often the difference between a five-figure project and a small one.

• Faster pages. Table layouts carry their scaffolding on every page. CSS loads once and gets cached. Lighter pages feel faster, and visitors notice even if they never say so.

• Better search visibility. A search engine reading clean markup finds real headings and real content. Nobody honest sells magic rankings, but clean code raises the floor under every search effort.

• Accessibility. Screen readers navigate by structure. Give them real headings and real lists, and the site works for people the table version quietly shut out. For our nonprofit and university clients, that is the mission. It is also, more and more, the law.

• Resilience. Browsers change. Internet Explorer 7 is in beta right now, and sites held together with IE6 tricks are going to have a rough autumn. Standards-built sites will mostly shrug.

The honest costs

Standards work is not free. It asks more skill of the developer up front, and today’s browsers still need some patience. A shop can build a table site faster this month. The savings arrive later, in maintenance, in the next redesign, and in the browser upgrade nobody scheduled.

That is exactly why we are writing this down in our first month. A young agency is tempted to optimize for this month. We would rather optimize for year four, when the site we built in year one gets a fresh look without a bill for rebuilding what already worked.

Where standards stand in 2006

Fair question: if this is so clearly right, why isn’t everyone doing it? Mostly habit. For years the argument against CSS layout was browser support, and for years that was fair. It no longer is. Firefox renders modern CSS well and keeps gaining share. Safari and Opera are solid. IE6 is the laggard, but its quirks are well documented, and the fixes are modest.

Two details matter if you are commissioning work this year. First, every page needs a proper DOCTYPE, the one-line declaration that tells browsers to render in standards mode. It costs nothing to get right, and audits find it wrong all the time. Second, IE6’s remaining gaps should be handled with Microsoft’s own conditional comments, a clean way to give that browser its fixes in a separate file, rather than with hacks that break when browsers improve.

If you are planning a project

One question sorts vendors fast: will the site use CSS layout and semantic markup, and can we see the source of something you have shipped? Viewing the source code is the great honesty check of this industry. A shop that talks standards and ships nested tables has answered your question.

If your current site is a table site, most are, and there is no shame in it. Just make sure the next big investment moves you onto a foundation that will not need replacing. A good foundation should not need replacing for a decade. That is the standard we hold ourselves to.

That is the founding commitment. Hold us to it.