Module 3 | PowerPoint | Tables Overview

While many authors try to indicate a table header row by changing its appearance (e.g., font and background color), a change of this type provides little or no information about the structure of the table. If not accessibly designed, tables produce non-sensical information making it impossible for students to navigate the content being presented. Tables without structural markup to differentiate and properly link between header and data cells, create accessibility barriers. 

People using screen readers can have the row and cell headers read aloud as they navigate through the table. Screen readers speak one cell at a time and reference the associated header cells, so the reader doesn't lose context. Additionally, blank cells in a table could also mislead someone using a screen reader into thinking that there is nothing more in the table.

One header

This image is an example of a table with one row designated as the header. You could also select one column to be the header if that were appropriate. 

 

Two headers

This image is an example of a table with a row and a column designated as headers.

 

 

Caption

This image displays the caption at the top of the table, which should provide a brief title or purpose for the content of the table. 

 

 

Data Tables vs Layout Tables

There are two basic uses for tables on the web: data tables and layout tables. The originally intended use of HTML tables was for tabular data like a price list or a spreadsheet. A table is a data table when row and cell properties, or both, are present (similar to the examples on this page). Unfortunately, tables are also sometimes used for page layout. Layout tables do not have logical headers that can be mapped to information within the table cells, and for this reason, it is generally recommended that the use of tables for layout purposes be limited. 

Please navigate to the next page to learn more about formatting accessible tables.