Continuing work on my next theme, Thematic, one thing I want to get out of the way immediately is the structure, or skeleton, of the thing. The outer structure of any HTML+CSS document is where things usually go bonkers and the last thing I want is for my markup to make things worse when I update versions. So, that said, here’s the basic divisions of markup, which I’ll follow with some of my thinking. I’m hoping we can start a conversation over this—and I’m totally up for a raging debate over my non-transcendent approach to this—so give this post a quick scan and see if you can add your two cents. The more the merrier.
The Thematic Markup Divisions
Why Use This Structure?
Why divide the code up this way? How is this any better than The Sandbox or any other theme for that matter? What are you trying to do here exactly?
Well, one of my main goals is to enable all sorts of CSS madness without changing the markup. While at the same keeping the markup divisions logical, letting the <div> serve it’s intended purpose. That is, making sure the <div> is there only to make my code more readable and imparting some meaning to it with class structure. With two important and glaring exceptions of course, wrapper and container.
A wrapper class is sort of a convention now—even though it’s not necessary—and anyway, it provides a useful point for playing with absolute and relative positioning. The container class lets us up keep our content source-ordered and have a sidebar on the left side of the screen using CSS only (check out the Sandbox layouts for examples of this). The use of these classes are straight out of The Sandbox and general web design convention. I think we can probably all agree on keeping these here.
But what about the CSS madness? More carefully thought out divisions = more madness. Subdividing the header and footer contents and collecting the center bits in a <div> let’s us create a bulletproof fixed-fluid hybrid layout, something like SimpleBits, or even something weird like MNML, and who knows what else. Personally, I like the who knows what else. Anyway, combined with the semantic class functions of The Sandbox there aren’t a lot of themes that can compete when it comes to employing the possibilities of CSS.
So what do you think? I’d appreciate the thoughts of anyone considering using Thematic. It’ll be your markup too, eventually.