How to Create Tables That Are Readable and Navigable
Tables should be structured in a way that allows screen readers, keyboard users, and people with cognitive disabilities to understand the content easily. Use this checklist to ensure your tables are accessible.
10-Point Accessible Tables Checklist
Number One: Use tables only for data, not layout
Tables should be used for presenting structured information. Avoid using tables for page layout or design.
Number Two: Include a <caption>
to describe the table
The caption provides a brief summary of the table’s purpose. It should be the first element inside the <table>
tag.
Number Three: Use <th>
for headers and <td>
for data cells
Headers (<th>
) define column or row labels. Regular cells (<td>
) contain data.
Number Four: Associate headers with data using scope
Use scope="col" for column headers and scope="row" for row headers. This helps screen readers identify relationships between data.
Number Five: Avoid empty table cells
Every cell should contain relevant content or a clear placeholder (e.g., N/A). Empty cells may cause confusion for screen readers.
Number Six: Ensure tables are keyboard accessible
All table content should be reachable using the Tab key. Avoid using interactive elements that are not focusable.
Number Seven: Use row and column grouping when needed
Use <thead>
, <tbody>
, and <tfoot>
to structure large tables. This improves readability and screen reader navigation.
Number Eight: Ensure tables work well on small screens
Tables should be responsive and readable on mobile devices. Use techniques like scrolling or stacking for smaller screens.
Number Nine: Provide alternative text for complex tables
If a table contains extensive data, summarize key takeaways outside the table. Consider using aria-describedby to link a summary to the table.
Number Ten: Test with assistive technologies
Use a screen reader to navigate the table and ensure headers are properly announced. Verify that tables remain readable with high contrast and zoom settings enabled.
Support my work in accessibility
Creating accessible content takes time, care, and deep testing — and I love every minute of it. From writing blog posts to doing live audits and building checklists, everything I create is designed to make the digital world more inclusive.If something here helped you — whether it saved you time, taught you something new, or gave you insight into accessibility — consider supporting my work.
You can buy me a coffee to help keep this platform going strong:
Buy Me a Coffee
Every coffee goes toward:
- Creating new articles with accessibility tips, tools, and testing methods
- Covering hosting, software, and assistive tech costs
- Supporting free education for designers, developers, and testers
- Making a meaningful difference for people living with disabilities
Thanks for being part of this mission to build a more accessible web — one page at a time.