Over the last few years, there has been a huge movement (and rightfully so) away from using tables to organize the layout of HTML pages. However, some seem to be taking things a bit too far.
The main reason for moving away from tables was to help make page layouts more semantic. Tables do still have a place in Web design and development, though, when they make sense semantically. Tabular data should be displayed in tables. Some designers and developers seem to forget that from time-to-time.
For instance, I noticed recently that new themes being developed and included with phpBB, the popular forum software, have started using divs, spans and definition lists to display the lists of boards and posts. The problem, is, however, that doing so breaks the semantic meaning of those lists.
Those lists include columns of data. For instance, when viewing a specific board (a list of posts), you will see a column for the topic titles and icons, a column showing the number of replies in each topic, a column showing the number of times each topic has been viewed and a column showing information about the most recent post within each topic. Semantically, those are columns (each topic being a row) and visually they are columns. According to the code, though, they are definitions, nested in separate definition lists, nested within separate unordered list items.
I remember having a discussion about this topic with the developers of YaBB (another popular forum software package) quite a while ago, when the major push toward semantic markup began. At that point in time, the majority of us agreed that it didn’t make sense semantically to try to break away from the use of tables to display the forum data.
Does it make sense to use divs, spans, unordered lists, ordered lists and definition lists to display the rest of the information in the template? Absolutely. Navigation lists should, ideally, be set up as definition lists with a dt element indicating that the list is used for navigation, and each navigation link being set as dd elements. The header and footer areas should be set up using appropriate semantic markup, as well (most likely not table-based, unless, of course, they actually display tabular data).
Even the posts themselves might need to avoid using tables for layout purposes (there are valid arguments for both sides of this issue). But, the lists of boards and the lists of topics are actually tabular data and should be represented as such.
What are your thoughts? What are some other examples you’ve seen where tabular data was presented as something other than a table? What are some of the arguments against using tables to display what would seem to be tabular data? I would love to hear thoughts and assertions on this topic.