Proper Use of Tables
When researching for this article, "The Proper Use Of Tables", it is very easy to find reasons why tables should NEVER be used. It seems that over the last few years designers and programmers have been misusing tables, using them for styling the graphical layout of the site, rather than using tables for their intended purposes. So many designers of late have taken a very negative attitude towards tables, and it seems we need reminding of the intended purpose of tables for the web.
- Tables should be used for organizing tabular data
- For an example in a spreadsheet style
- When data needs to be structured into many columns and rows:
Personal Data Name Age Hair Color Janice 34 Auburn Paul 26 Blond Alison 41 Black <table> <caption>Personal Data</caption> <tr> <th>Name</th> <th>Age</th> <th>Hair Color</th> </tr> <tr> <td>Janice</td> <td>34</td> <td>Auburn</td> </tr> <tr> <td>Paul</td> <td>26</td> <td>Blonde</td> </tr> <tr> <td>Alison</td> <td>41</td> <td>Black</td> </tr> </table>
Tables are very useful for structuring data in any organized manner that the designer/programmer has in mind. Keep in mind that this is a very linear structure, much like a spreadsheet structures it's information.
- Tables can also be used to structure form fields
- You can include a table inside a form, again the table must be nested completely inside the form
<form> <table> ... </table> </form>
This allows designers/programmers to organize the form in a manner that is consistent with what the general public is expecting.
The Improper Use of Tables
Tables are handy and easy to use to layout information that makes it easy to think of other ways tables could be used. In fact, inexperienced web designers will, and have been, tempted to use tables for the overall layout of the site. Why this is a "bad thing" to do comes back to mixing style with code. More and more designers and programmers are in agreement that design and code should remain separate. These reasons are discussed in the articles Standards and CSS Standards.