Free tool
Excel to accessible HTML table
A screenshot of a spreadsheet can’t be read, searched or zoomed on a phone. Paste your cells here: you get a real HTML table, with headers screen readers understand and numbers written properly.
Everything happens in your browser: your cells are sent nowhere and nothing is kept.
Checks
Preview
In “For WordPress” mode the preview is neutral: on your site, your theme provides the fonts, colours and borders.
HTML code
Why a real table rather than an image
A picture of a table is only pixels: screen readers can’t read it, Google can’t index it, visitors can’t copy a figure or zoom in on a phone without losing the page.
An HTML table is text. It adapts to the screen, its numbers can be selected, and its structure — headers, caption — lets assistive technology announce each value with its meaning.
What the code contains
<th scope="col">
Column headers
A screen reader announces “Budget 2026, 45,000 dollars” instead of a bare number.
Tick “First row = headers” whenever your first row holds titles.
<th scope="row">
Row headers
Useful when the first column names each row (budget line, month, name).
The value is then announced with both its row and its column.
<caption>
Caption
The table’s title, read before its content. It also names the scrolling area on small screens.
One short phrase is enough.
Numbers and dates
In English (Canada), write $1,234.56 and 12.5%. In French, the convention is different: a space between thousands, a comma for decimals, and the dollar sign after the amount, separated by a space — 1 234,56 $, 12,5 %. The tool uses non-breaking spaces ( ) so an amount never splits across two lines.
Whole numbers without a symbol (years, member numbers, codes) are left as they are, unless the column holds amounts. Numbers with a leading zero (007) stay text.
Dates are written YYYY-MM-DD (2026-09-30), the unambiguous format recommended in Canada. A date like 03/04/2026 is converted only if another date in the same column shows the order (a day above 12); otherwise it is left alone.
Adding it to WordPress
- Add a “Custom HTML” blockIn the block editor, click + and search for “Custom HTML”.
- Paste the codeUse the “Preview” tab of the block to check it.
- Or convert it to a Table blockFrom the block’s menu, “Convert to blocks” turns it into a native Table block you can edit — the
scopeattributes, row headers and alignment may be lost along the way.
The “For WordPress” style adds almost no styling, so the table looks like the rest of your site. The “Standalone” style carries a small CSS bound to a unique class, handy for a site without a theme or a simple standalone HTML page.
Keep it readable
- Avoid merged cells and empty spacing rows or columns: they make screen-reader navigation confusing.
- One table, one topic. Two different sets of data are better as two tables, each with its own caption.
- On a phone, a table wider than five or six columns will scroll: keep the essential columns on the left.
- Colour alone should never carry meaning (red for a deficit): keep the minus sign.