Tables
Accessibility Statement: If you use tables
View an accessible page using tables
View an inaccessible page using tables
- If you use tables for layout, be sure that reading the material left to right, row by row makes sense. Screen readers can't decipher the meaning behind a particular layout. Though white space separates columns of text to viewers, a screen reader reads the first line of each column followed by the second line of each column, without regard for the carefully structured layout.
- Because screen readers read left to right, one line at a time, complex table structures can make a page very difficult for a screen reader to read. Consider providing a text link to a table summary or description of the table's contents and purpose. The LONGDESC attribute, part of HTML 4.0, allows you to link to a longer description.
- Table markup tags, such as the <TH> header tag, are often used for layout. Even though a designer may use it to center one item in a single cell, the <TH> tag is interpreted as a column heading by a screen reader, and will be audibly attached to other items in the column.
- If the table contains data in rows and columns as in a spreadsheet, associate header information with the "headers" attribute. The "headers" attribute specifies a list of header cells (row and column labels) associated with the current data cell. This requires each header cell to have an "
id
".
- Check accessibility by viewing your page in multiple browsers and platforms, then verify it with tools like CAST's on-line BOBBY verification tool.
Read the relevant W3C guideline -- 5.1 5.2
Return to the checklist
Adapted with permission from web accessibility pages at Penn State
, multiple selections available, Use left or right arrow keys to navigate selected items