Ensure that tables are carefully and appropriately used

Students who access a table with a screen reader, or users who view only a portion of the page at a time (for instance with screen magnifiers or hand held devices) may have difficulty accessing information held within tables.

Unless tables are properly defined, the screen reader or other device will not have the appropriate information to support navigation among table cells and to access header or other table cell information.

Screen reading software reads the information across cells, left to right, top to bottom. To be accessible, consider the following points:

• Tables should be used to present tabular information ("data tables").
• Avoid the use of tables for layout unless the table makes sense in a linear format.
• Include header information to enable the assisitive technology to distinguish header cells from data cells in the table.

To ensure HTML Table headers are included in the header cells of all tables:

• Use TD to identify data cells and TH to identify headers.
• To provide summaries for tables use the "summary" attribute of the TABLE element.

For more information on creating accessible tables see the tutorial at http://www.webaim.org/tutorials/tables.

To add header information in Dreamweaver:

• Insert a table using the Objects palette and select the number of rows and columns.
• Place the cursor in the top cell of the table (header cell).
• Open the table properties window.
• Check 'Header' to identify the top cell as a header.
• Give the cell a title.
• Repeat the process for other header cells.

Figure 4: Property inspector window for Tables

This checkpoint relates to W3C Guideline 5: Create tables that transform gracefully.