Remember your tables

If CSS layouts taught us one thing is that tables are bad. We now look down upon those who haven’t taken the leap into the 21st century and still use them on their web pages. In fact, the old <table> tag has become so hated that sometime we pretend it doesn’t even exist. But are we right in doing so?

Tables serve one purpose and they serve it well—that is to present tabular information. Let’s pretend for a minute that all that bastardization of the table tag did not occur and it was never used so wrongly for layout purposes. Let’s try and rediscover the way we code and rediscover the table tag. In doing so, we might come across excellent examples of table usage, and most important, correct examples of table usage. Not for layout (that never happened, remember?) but for presenting data, just like any other tag would be suitable for describing and presenting various bits of information.

Using the table tag correctly is not exactly the easiest of tasks when it comes to coding. There are quite a few features here that lots of people are unaware about. I’d like to point you to an excellent and succinct guide to these mostly-unknown attributes: HTML Dog’s guides.

Now that we know the code, let’s take a look at what we can accomplish with tables. Below are some examples of well designed (and semantically correct) tables:

• Blinksale
• Basecamp
• Joshuaink
• Phono Phunk
• PGA Championship

Have more examples? Please share.

In conclusion, tables aren’t evil by heart. Just like any other tag in the shed, if used properly, they can yield great results.