Using table structure appropriately is one of the 10 fundamental concepts that can support digital accessibility in all of your content.
Tables should only be used to share data or other information that can be clearly organized by rows and columns.
When a user navigates a table with a screen reader, the table’s row and column headers are read aloud as they navigate. Screen readers speak one cell at a time and reference the associated header cells so the reader doesn’t lose context. This is why it is important to avoid using table structure for layout or visual design purposes.
In an accessible table, each data cell should have a clear association with a header cell, either at the top of the column or at the start of the row.
Consider the following examples of a group class schedule. In Example 1 (inaccessible), not every column has a header cell, blank cells were merged, and it is unclear how the data in each row is related, which makes it difficult for screen readers to interpret the content.
In Example 2 (accessible), notice how using the days of the week as the column headers simplifies the layout of the table and eliminates the empty cells.
Example 1 (inaccessible): Group class schedule
| Monday | ||
| 9-9:45 | 10-10:45 | 11-11:45 |
| Class A | Class B | Class C |
| Tuesday | ||
| 9:00 – 9:45 | 10:00 – 10:45 | 11:00 – 11:45 |
| Class B | Class C | Class A |
Example 2 (accessible): Group class schedule
| Hours | Monday | Tuesday |
|---|---|---|
| 9-9:45 | Class A | Class B |
| 10-10:45 | Class B | Class C |
| 11-11:45 | Class C | Class A |
The easiest way to avoid creating complex, inaccessible tables is to carefully consider how the information is organized from the start — sometimes, a table may not be the most appropriate format for the content. If you need to fix a complex, inaccessible table later on, you may need to rethink how the table is formatted, such as reorganizing the headers or breaking the information into more than one table.
- Define clear header rows and/or columns to label data in the table
- Avoid complex tables with multiple heading rows
- Avoid merging or splitting cells
- Avoid blank cells
- Contextualize tables within the content of the surrounding page
Fundamentals
Download the checklist
Download our digital accessibility fundamentals checklist PDF to help you keep track of the core principles of accessibility while creating and editing digital resources.
The Center for User Experience
At the Center for User Experience, we are committed to working with you to make digital spaces more accessible, usable and inclusive for all students, faculty and staff at UW–Madison. We help the university follow its Digital Accessibility Policy by offering free evaluation and consultation services to all UW–Madison community members. For guidance on complying with digital accessibility requirements, visit Digital accessibility and the Americans with Disabilities Act (ADA).
Get in touch
- Meet with us: Book a quick chat with one of our team members to ask any questions you have.
- Start a project with us: We support accessible design and development. Fill out our Let’s Connect form to begin working with us on your project or to request an accessibility evaluation.
- Email us: Not sure if you’re ready to meet? Email us to start talking and figure out what to do next.