Math 696 -- Tables

Tables

Tables

Tables are one of the most frequently misused features of HTML. Many authors use tables not because they have information that needs to be displayed in a grid, but because they want to control the visual appearance of a document. Besides being contrary to the philosophy of logical markup, this use of tables is a bad idea because the visual display of tables is strongly dependent on the browser. Tables also may cause problems for text-oriented browsers like lynx and for speech synthesizers.

Tables should not be used purely as a means to layout document content.
--HTML 4.0 specification

Tables should not be overused, but sometimes tables are a useful way to display data. Here is an example of how to code a simple table in HTML. The example illustrates the use of the "<table>" tag and the subsidiary tags "<tr>" for table rows, "<th>" for table headers, and "<td>" for table data. (The "border" and "cellpadding" attributes affect the visual display of the table, information that preferably should be included in a style sheet.)

<table border="5" cellpadding="8"
summary="This is a sample table: 
a simple dictionary. It shows three
common words and their translations
into five different languages. It is
useful to include summary information
like this for the benefit of non-visual
browsers, like speech synthesizers.">

<caption><em>A short dictionary
</em></caption>

<tr><th>English</th>
    <th>French</th>
    <th>German</th>
    <th>Finnish</th>
    <th>Hungarian</th>
</tr>

<tr><td>mathematics</td>
    <td>math&eacute;matiques</td> 
    <td>Mathematik</td>
    <td>matematiikka</td>
    <td>matematika</td>
</tr>
<tr><td>function</td>
    <td>fonction</td>
    <td>Funktion</td>
    <td>funktio</td>
    <td>funkci&oacute;</td>
</tr>
<tr><td>chess</td>
    <td>&eacute;checs</td>
    <td>Schach</td>
    <td>shakki</td>
    <td>sakk</td>
</tr>
</table>

Your World-Wide Web browser formats this code as follows.

*A short dictionary*
English	French	German	Finnish	Hungarian
mathematics	mathématiques	Mathematik	matematiikka	matematika
function	fonction	Funktion	funktio	funkció
chess	échecs	Schach	shakki	sakk

The HTML 4.0 table model includes advanced features such as grouped rows and columns, cells that span multiple rows or columns, and categorized cells. Consult the sample table in the specification to see how to implement fancier tables.

Tables