Tables Are Only Mostly Dead

I was recently browsing through a web development forum when a particular posting caught my eye. A member was asking what is the best way to mark-up and design a calendar in HTML without using a table. He got plenty of answers, with a lot of advice on complex code structure and CSS floating techniques, some with a few existing examples. He also got few responses telling him to just do it in a table; but he remained convinced it should be table-less.

Where does this anti-tableism come from? In the early days of web design, it became a very popular technique to build web pages using tables to lay out the elements. The ability to slice up Photoshop mockups and arrange them in a grid was the most basic skill a web designer could have. Everybody did it. Since web browsers were in their infancy, it was almost the only way to have a consistent design across browsers. As time went on, pages became more complex. Their designs required more and more tables nested within tables, and page size grew and grew. I remember building pages where just the markup was over 100KB.

But soon, the web grew up, and browsers did too. With using stylesheets, we now have a much better way of designing a page. We keep the HTML dedicated to defining the content, and the CSS to styling it. When this method was new, we called it ‘table-less design’. Tables became associated with the ugly past. So they needed to be replaced…everywhere.

But tables should not be replaced. Tables are meant for tabular data (hence the name). Just think of them as a spreadsheet in HTML. All the HTML elements and parameters associated with tables are there to support a tabular structure. And they are perfect for the job.

Of course, this means tables should NOT be used for laying out a page, since sliced images and transparent spacer .gifs are not tabular data.

As for the calendar? It’s meant to be a grid. Calendars are tabular data. Each row represents a week, and each column represents a day of the week. Once the HTML defines the structure, CSS takes over styling it.

Tables aren’t dead in web design. They’re just finally doing what they’ve been supposed to be doing all along.