Vegetables are good for you.

It's an onion. Really, truly, this approach has saved me great trials when explaining things to people: your code is an onion.

Here's what I'm talking about. Because of the multi-viewer nature of the web you don't know what people are going to use to read your message. Cel phone display, or voice browser, or PDA, or Macintosh. Even within the last catagory the machines may be running browsers of different capabilities. "Know your audience" is a great idea, but it's falling apart. We're past the point where we could assume over 95% of our audience is using Explorer 4 or Netscape 4. And the code we're working with isn't limited by that headset either, so let it go.

The code is made so your message is written once yet read in many different formats. This is a new concept. This is what's really new about the web. We've never had a single input = multiple output media before. As an author it's like getting book, radio, and movie contract all at once, yet you only produce one work for all of them. Don't worry if that's a little confusing. It's new to all of us, and it's going to be some time before we get used to the form.

Notice how often I need to say "read" and "view"? We don't even have genre neutral terms in our language. How much longer are we going to say "webpage"? A new form takes time to get comfortable with, but our fact is we're already in it.

So look at your code as an onion. The core is your basic message. The layers are enhancements to your message. Some browsers can't see much more than the core, some can see many layers, and not all multi-layer browsers see the same sets of layers. The onion approach provides a way to add enhancements without blocking any browser from your message. Each browser can display your message with all the enhancements it is capable of, and without you needing to know every browser's capabilities.

I'll explain this in detail, but I think I better take a moment to deal with a contentious subject called,

'Separating Style from Content'

This phrase is a semantic minefield. Some people hang up when they hear this. Can we relax a little? The people who say this do understand that form and function are part of each other.

Let's change the wording and see if it helps. What we're doing -- what the very nature of the web requires -- is to separate data from layout at a code level. Style is not trivial nor divorced from your message. It's just that the multi-viewer nature of the web requires multi-viewer consideration for your data. So you have to think about what's data, what's layout.

In code terms, data is what goes in your HTML. If it's not your core text and absolutely necessary images, strip it out of there. Layout is what goes in your CSS. Colours, fonts... tone rate & gender for voice readers... you name it, that all goes in CSS files.

This is not, in any way, a belittling of style. Style is entwined with content. It's just that there's a lot of options beyond screen layout, so momentarily separating these terms is necessary to help you make choices for the many media without blocking out any media.

The Web Standards Project