Simple Layout Tables

It started with Andy Budd’s controversial (hey, without controversy, what are we?) article where he dared to play Devil’s Advocate in the argument against tables for layout. If you haven’t already read that post, do so, it’s one of the better articles you can read on markup these days. Anyway, I summed up my thoughts on this matter in the comments there:

Giving up a technology just because one or two browser vendors apparently refuse support of it is just unforgiving. That way, we’ll never see the advent of CSS dominion (hmm, that sounded significantly more sinister than I wanted). Stick it through a couple more years, I’m guarenteeing that CSS will see an increase in support. Who knows, maybe Microsoft will have a Trident overhaul when CSS3 hits. (Although they really should have done that by now, CSS2 is 6 years old!)

CSS design does hold many more advantages over tabular design. I believe that CSS in its current maturity is flexible and supported enough to cater for any site, regardless of complexity of design, complexity of content and markup literacy of authors (teach them, for Pete’s sake!).

Within the next few years we’ll only see an increase in CSS based design, I’m relieved to say. With people like Zeldman and Cederholm writing books, hopefully within a few years most web developers won’t be getting funky with FrontPage but will instead be creating semantic, structural designs without the aid of obsolete, inbenefitial and frankly incompetent technology such as layout tables!

I, for one, refuse to go hypocrytical, and will always try to create a flexible CSS design before I bend over backward to incorperate the straggling mess we find in layout tables.

Nevertheless the argument continued, with names like Dave Shea and Jeff Croft behind it, it looked to continue for a while. So I feel it’s time to add a few new arguments to the pile:

  • Forward-thinking

    As I said, CSS-P will only gain popularity in the future, from both vendors and coders. Now WASP has brought the CSS support level to a (mostly) acceptable level, their next task is to bring standards coding to the multitudes: worldwide standardized pages is currently just a dream, but over the next few years it’ll grow and grow and grow, especially if companies like Microsoft, Macromedia and Adobe jump aboard ship. Of course, we’ll also see the inverse happening to tables. What is one clean table will become weeks of unnecessary work in the future when you curse your laziness for not adapting a CSS-P layout from the start.

  • Sure, markup is hard. It’s not easy to get people who’ve never worked at the coding level before out of the presentational mindset and into the semantic one. However, tables for layout isn’t the easiest way out of this problem! It’s damn near just as easy to create a CSS-P layout that works in version 5+ browsers, and degrades to readable content for version 4 browsers. So, unless you absolutely have to code for that low a denominator, there’s no reason to use tables.
  • Finally, let me fight a point Dave Shea brought up in his response article ‘Tables? Oh, the Horror!‘,

    And finally, let’s talk semantics. I hate discussing semantics, personal interpretations (unavoidably) shade the conversations. But let’s do it anyway. This is the point that’s going to get me into the most trouble because everyone is going to have a different take, but I’m going to throw it out there. Using a table for tabular data is universally accepted as being proper use of a table. Which carries with it the assumption that the table is structural and not presentational in that case. Fair enough.

    But if tabular data is structurally tabular, then what inherently (besides a fear of the past) makes a two- or three-column layout structurally non-tabular? Two columns invariably end up in a pair of divs, or a pair of tds. What makes the former structural, but the latter any less so? A pair of divs implies two distinct, separated blocks of structure; a pair of tds does the same, and carries with it the further implication that the blocks are structurally side-by-side columns. Two columns may be presentational to some, but they may be structural to others.

    This isn’t the point of the semantic argument against layout tables. It’s not that tables aren’t structurally sound, but simply that you’re telling anyone that might care to read your code that this is a table, rows of data split into fields. Layout simply isn’t: it’s nothing semantically, just something visually, which is why we use the semantically emptiest tag available, div. Structure is not an issue when using the most minimilist table possible to lay out your pages, because (as you said), it bears a lot of structural resemblance to the markup involved in CSS-P.

What do you think of this? This argument has been incredibly two-sided, rather unlike a lot of debates in the blogosphere. I’d be interested to hear some more people’s views.

Patrick Griffiths also responds to this issue, with many of the same ideas as myself.