Home · Design blog · Table-less and Div-less too!

Table-less and Div-less too!

Yes, this is seriously, no joke. A guy named P.J. Onori one day decided to think outside of the box, and came up with this wild idea to create a web site without using tables, and not using any divs either!

"Thats crazy" you say? Well look here.

According to P.J. using the ul and dl elements interchangeably as the primary element for a page's structure is really not much less reliable than using a div. And in fact, for backwards compatibility, is even better. As regards forwards compatibility, it doesn't choke the W3C validator either.

Here's some of the method behind his madness, in his own words:

The reason why the DIV degrades nicely with older browsers is that older browsers do not know what it is and it is therefore omitted. Thus, the DIV, while causing no negative effects to the structure of a website, is providing no positive effects either. XHTML list elements provide a natural hierarchy for all layouts, with or without CSS.

I already know, for those of you semantics zealots, you're already shouting "Thats not a valid use of the list element!". Well, P.J. has heard this one too:

Many have questioned whether using lists in this method is semantically correct. After many long discussions, I have come to the opinion that the final answer lies in what one considers to be a list. [snip] ...

In my opinion, it all comes down whether you're willing to look at the meaning and use of lists as well as the organization and structure of information in a relatively non-traditional manner.

Here's the basic idea, in a nut-shell.

A stripped down version of average website today created with the DIV tag would look something like the example below:
<div id="page">
  <div id="header">
  </div>
  <div id="main">
  </div>
  <div id="sidecol">
  </div>
  <div id="footer">
  </div>
</div>
The list based method replaces the DIV tags with a list structure. As seen below, there is already a much clearer hierarchy of each section of the layout.
<ul id="page">
  <li id="header">
  </li>
  <li id="main">
  </li>
  <li id="sidecol">
  </li>
  <li id="footer">
  </li>
</ul>

Is this the future? No one can really say at this point, if the W3C nods their head at this, is, in my opinion, unlikely.

But, we will just have to wait and see. I must say though, this is surely a unique and creative alternative to building pages. I really dig it.

Apr 10, 2008

Comments

This article hasn't been commented yet.

Write a comment

* = required field

:

:

:


8 + 7 =