Skip to content

Guide · Agent skill

How to use the Accessible Tables Reviewer agent skill

Updated · written with AI from the project's own documentation and checked against our catalogue data

The accessible-tables skill teaches an AI agent to review web page table markup for accessibility. It checks that data tables use header cells with scope attributes, have a caption or labelled name, and are not misused for page layout. This guide explains what a skill is, how to install this one, how to ask for a review, and what to expect from the results.

Accessible Tables Reviewerthedaviddias/Front-End-Checklist · MIT

Quick start

  1. 1Download the ZIP. Get the accessible-tables ZIP from this page and unzip it so you have the SKILL.md file and the references folder.
  2. 2Place the skill folder. Copy the folder to ~/.claude/skills/ for personal use, or to a project's .claude/skills/ folder to limit it to that project.
  3. 3Or upload it in the apps. In the Claude apps, open Settings → Capabilities → Skills and upload the skill.
  4. 4Provide the HTML. Paste the table markup or point the agent at the file containing the rendered HTML.
  5. 5Ask for a review. Request a check of the table's headers, scope, caption and layout use in plain language.
  6. 6Apply the fixes. Work through the findings, then verify with browser accessibility tooling or assistive technology.

What is an agent skill and what does this one do?

An agent skill is a folder of instructions that an AI agent can load when a task matches the skill's description. This one is written for reviewing rendered HTML. When you ask for it, the agent checks whether each data table uses th elements with scope set to col or row, has a caption or a labelled name, and avoids tables for layout.

When the agent finds a problem, it reports the exact elements that break the rule, suggests a fix, and explains why screen reader users need the structure. The source explains that screen readers read table data cell by cell, so without proper headers a user hears a value like $99 with no context, rather than Row 3, Column 2: $99.

Install the accessible-tables skill

Download the ZIP for this skill from this page and unzip it. The skill folder contains two files: SKILL.md and references/rule.md.

For a personal install, place the unzipped skill folder in ~/.claude/skills/. To limit it to one project, place it in that project's .claude/skills/ folder instead.

If you use the Claude apps, you can instead upload the skill under Settings → Capabilities → Skills.

  • Personal: ~/.claude/skills/
  • Single project: the project's .claude/skills/ folder
  • Claude apps: Settings → Capabilities → Skills (upload)

Ask for a table review with natural requests

You do not need a special command. Ask in plain language about tables, headers or table accessibility, and include the markup or the page. The review needs rendered HTML to inspect, so paste the table code or point the agent at the file that contains it.

Good requests name the table and what you want checked, for example: review the data table in this HTML for header and scope problems, or check whether this pricing table is being used for layout.

  • Paste the table's HTML and ask whether the headers and scope are correct.
  • Ask whether a table is being used for layout and should use CSS Grid or Flexbox instead.
  • Ask what fix to make for a complex table with merged cells.

Read the review output

The source's checklist asks the agent to verify th elements with scope, a caption or aria-labelledby, and sound table structure. For a simple table with a clear adjacent section heading, a missing scope is often a stronger finding than a missing caption. The skill also asks the agent to prefer one strong finding over several minor ones on the same simple table.

For complex tables with merged cells, the fix may use id and headers attributes instead of scope alone.

  • Each finding should name the exact element and the rule it breaks.
  • Each finding should include a suggested fix.
  • Verify fixes afterwards with browser accessibility tooling or assistive technology, as the skill recommends.

Example of correct table markup

The source's reference file shows a table that follows the rule. It has a caption describing the table, column headers marked with scope col, and row headers marked with scope row. Use this as the target the agent compares your markup against.

<table> <caption>Q1 2024 Sales by Region</caption> <thead> <tr> <th scope="col">Region</th> <th scope="col">January</th> <th scope="col">February</th> <th scope="col">March</th> </tr> </thead> <tbody> <tr> <th scope="row">North</th> <td>$12,000</td> <td>$14,500</td> <td>$13,200</td> </tr> </tbody> </table>

What the skill needs and how it runs

The skill lists no requirements. It does not run scripts and does not use the network, so it only reads the material you give it and writes a review. Because it works on markup, it cannot judge a page you cannot share as HTML.

The skill covers table markup only. It does not check colour contrast, keyboard behaviour across the whole page, or other areas, and it is not a full WCAG audit.

  • Requirements: none listed
  • Runs scripts: no
  • Uses network: no

What people use it for

  • Checking a pricing or sales data table for th elements with scope before release.
  • Confirming a table has a caption or aria-labelledby that describes its purpose.
  • Spotting a table being used for page layout and getting a CSS Grid or Flexbox alternative.
  • Getting a fix for a complex table with merged cells using id and headers attributes.

Frequently asked questions

How do I install the accessible tables agent skill?

Download the ZIP from this page and unzip it. Put the folder in ~/.claude/skills/ for personal use or in a project's .claude/skills/ folder for one project. In the Claude apps you can upload it under Settings → Capabilities → Skills.

Does the accessible-tables skill require anything to run?

The skill lists no requirements. It does not run scripts and does not use the network, so it works from the markup you provide.

Is this skill free to use?

The skill is published under the MIT licence. This page does not state pricing, so check the licence and the source repository for the terms.

Can this skill replace a full accessibility audit?

No. It covers only table markup. It does not check colour contrast, keyboard behaviour across the whole page, or other areas, so it is not a full WCAG audit.

What should I do if the agent gives no useful results?

The review needs rendered HTML, so paste the table markup or point the agent at the file. Non-technical users without access to the HTML will not get a useful review, because the skill inspects markup.

How does this compare with other accessibility checks?

This skill focuses narrowly on data table semantics: headers, scope, captions and layout misuse. Use it alongside broader checks for contrast, keyboard use and full-page audits, since it does not cover those areas.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

Use this skill if you are a front-end developer, designer or QA reviewer who wants a consistent checklist review of data table markup before shipping. Pick something else if you need a full WCAG audit, colour contrast checks or keyboard testing across a whole page, or if you cannot share the page's HTML.

Download the skill