A screen reader turns your data table into noise

I built a nice looking table but when I test it with a screen reader the numbers make no sense at all.

Beginner to intermediateRead 4 minDoing: 30 to 40 minutes for a table with a handful of columns and rows, a little longer for a bigger one6 steps

▶ Start

What you'll have at the end

A plan comparison table with a caption, column headers, and row headers that a screen reader announces correctly for every cell, confirmed by listening and by an automated checker.

Before you start

You need

A data table already on a page, built with a table element, rows, and cells, but no caption and no header cells.

Not covered

Making a table with header cells that span more than one column or row accessible, which needs the headers and id attributes instead of scope.

Leans on

HTML5 Cheat SheetCarries the table row this recipe's markup is built from, including the th element and its scope values.
Web Accessibility Cheat SheetConfirms the caption and th-with-scope pattern from the accessibility side, plus when headers and id replace scope for a spanned table.

6 steps

Checked 25 Aug 2026

Part of the HTML5 cookbook