Accessibility Checklist: Tables
Bobby Bailey
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.