Include Table Headers

It's important that table headers are marked up appropriately so that screen reader users are given context for the data in each cell, as well as being visually distinguishable. For tables with column headers, give each column a name that clearly describes its data.

Your tool or program will usually set the first row as the default header row where you can enter a description for each column. Do not delete this header row; in some programs, you can simply turn the header row back on, but in others, you may have to add the header row back manually.

Example Table with Headers:

Screen Reader	Operating System
JAWS	Windows
NVDA	Windows
VoiceOver	macOS

Keep it Simple

Long, complex tables can create cognitive overload for users. Screen reader users in particular may get frustrated having to navigate through so many different cells or through very complex data. When possible, try to break up complex tables into smaller, simpler tables.

Use Sufficient Color Contrast

Many tables use a zebra pattern to visually distinguish every other row of a table. When choosing cell background and text colors, keep in mind that your color contrast ratio must be 4.5:1 or stronger. You can use the  WebAIM Contrast Checker to easily make sure your contrast is high enough.

The Semantics of Tables

Tables should only be used to present data, as they provide semantic meaning for screen reader users. They should not be used to create a visual layout or for any other purpose than to display data. Try using columns and other features built into your program for creating a custom layout instead.

Adding Tables in Specific Platforms

• Modern Campus CMS & tables
• Microsoft Word & tables
• Microsoft Excel & tables
• Google Docs & tables
• InDesign & tables