Field note 34

Give data tables clear headers

A compact grid of paper squares has a red top row above two charcoal rows on an off-white background.
Give every column its meaning

A place name is not a complete instruction. In a bicycle repair studio’s service table, “Market workshop” might tell someone where to leave a bicycle or where to collect it. If both columns contain the same kinds of names, readers need the relationship between each value and its header—not just a bold row that looks like a heading.

For a content editor, the useful handoff is a small specification of those relationships. The proposed MAJLS table-meaning review card below records the topic, exact labels, intended associations and an implementation exception. It is an editorial tool, not an accessibility certification. Sara, the fictional page owner, confirms the service information; Kareem, the fictional website maintainer, implements and checks the actual output before Sara authorizes release.

Start with the meaning, not the styling

W3C’s one-header tutorial uses th elements for header cells. For ambiguous data, it explains that scope="col" defines the column direction and associates headers with the corresponding data cells. It also shows a small, unambiguous example without scope, so the lesson is not that scope is mandatory in every smallest table. The implementation should match the relationships and ambiguity of the particular content. [1]

Our fictional table deliberately repeats workshop names under two different headings. That makes direction important. The proposed fix is to mark the top-row labels as semantic header cells with scope="col", rather than leave them as ordinary data cells that merely look bold. Bold styling is not a substitute for the header markup shown in the tutorial. [1]

This specification uses column headers only. It does not require adding row headers to every simple table: W3C explicitly includes tables with header cells in the top row only. [1]

Specify the table readers should receive

Proposed caption: Bicycle service locations.

Service Drop-off location Collection location
Puncture repair Market workshop Market workshop
Wheel truing Riverside workshop Market workshop
Brake adjustment Riverside workshop Riverside workshop

This compact Markdown table is an illustrative content specification. It does not prove that a production website renders the right semantic associations. There are no real customer details, calculations, prices or booking promises in this fictional example.

Read the wheel-truing row as a complete instruction: drop off at Riverside workshop; collect at Market workshop. In the puncture-repair row, “Market workshop” appears twice, but the first occurrence means the drop-off location and the second means the collection location. Repeating the name does not make the two column roles interchangeable.

A caption answers “What is this table about?” W3C describes captions as useful for identifying and understanding tables, while explicitly saying captions and summaries are not required in every case to meet WCAG. For this proposed specification, use the short caption above, associated with the table through its caption element. [2]

A summary has a different job: explaining the organization of an unusual table, usually a complex one. Do not add boilerplate that simply repeats “Bicycle service locations.” W3C says a summary should not duplicate the caption when both are supplied. This small table needs no proposed structural summary. [2]

Filled MAJLS table-meaning review card

Check content and implementation separately

First, perform a manual cell-reading check against the specification. For each service, read the two locations aloud with their full headers. Ask Sara to confirm both statements independently. Start with Wheel truing because its locations differ, then check the repeated names in the other rows. Record a mismatch as a specific cell-and-header exception rather than “table unclear.”

Next, Kareem should inspect the rendered markup, not just the editor’s preview: is the caption associated with this table, are the top labels actual th cells, and does each carry the intended column scope? Then he should navigate the rendered table using assistive technology and check whether the header information encountered with each value matches the card. W3C’s tutorial notes that ambiguous header direction can affect what some screen readers read; appearance alone is not the acceptance evidence. [1][2]

These are proposed checks, not completed test results or a whole-site WCAG assessment. If the website transformation changes the layout or introduces grouped headings, return the exception to Kareem rather than assuming this simple specification remains sufficient.

An AI-assisted role can prepare the specification, compare supplied content and draft the exception card. It cannot certify compliance or publish the changes. The distinct artifact here is a per-table caption/header relationship specification—not a page-heading outline, link-purpose review, image alternative or slide reading-order check. Keep the handoff small enough that Sara can confirm the meaning and Kareem can demonstrate the intended relationships in the real output.

Sources

  1. 🐴 Tables with One Header | Web Accessibility Initiative (WAI) | W3C
  2. 🐴 Caption & Summary | Web Accessibility Initiative (WAI) | W3C

Discuss the process with MAJLS ↗