Tables in HTML were predicted for presenting tabular data.
Because they are suitable for laying out a web page many programmers are still using them for that purpose.
Some of the reasons for avoiding using tables as layouts are mentioned here:
- Separation of content from layout is a right way to go;
- Easier maintaining and updating of an existing site with external style sheets;
- Readability of HTML code is improved without tables;
- Tables might be rendered slower by browsers;
- SEO (search engine optimization) might suffer;
- Because they should be used for tabular data the future rendering by browsers and indexing by search engines cannot be predicted;
Basic HTML table is built with rows <tr> and cells <td>. Each new cell in a row actually adds a column to the table.
- id, class (document-wide identifiers)
- lang (language information), dir (text direction)
- title (element title)
- style (inline style information)
- align (<tr>, <th>, <td>) (alignment)
- width (<table>) (element proportions)
- summary (<table>) (for non-visual media)
- frame, rules, border (<table>) (borders and rules)
- cellspacing, cellpadding (<table>) (cell margins)
- headers, scope, abbr, axis, rowspan, colspan (<th>, <td>) (cell specific attributes)
- onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup (intrinsic events)
HTML table, row and cell elements: