Tables

illustration of a simplified page in a book, divided into colored sections

Creating Accessible Tables

Integrating proper structure on your pages makes it easier for people using screen readers.

Do not use structural elements outside of their intended purpose. For example, using table elements for layout to create columns can confuse individuals relying on screen reading software. The screen reader will announce the structure of a table, and users may believe they are navigating through tabular data when they are not.

  • Use table markup for data tables. If you have tabular data, make sure it is presented as an HTML table, with column and row headers.

Examples

The screenshot right shows the table tool in the NYU.edu CMS. The Advanced tab provides the option of setting a column or row, or both, as table headers.

inserting a table on a CMS web page

Accessibility Checklist

Use an inspection tool, like the Web Developer Toolbar, to display structural elements:

  • Are data tables marked up as tables, using row and column headers?
  • Are tables used for layout purposes?

Resources