Mark up data tables correctly

The Challenge
Because screen readers read a Web page from top to bottom and left to right, information placed in tables is often very difficult to understand. If you use the proper HTML markup for data tables, screen reader users will be able to navigate through the table much more easily.

Solutions

• Designate row and column headers using the <th> tag.
• Associate the data cells with the appropriate headers.
• Use proportional sizing, rather than absolute sizing.
• Provide names or titles for data tables using the <caption> tag.
• Provide summaries using the summary attribute.
• Avoid spanned rows or columns
• Avoid tables with more than two levels of row and/or column headers.