WCAG 1.3.1 Info and Relationships

How it fails in practice

A bold paragraph used as a section heading. A layout table with no header cells. Radio buttons for delivery options with no fieldset, so a screen reader reads four unrelated choices.

How to fix it

Use the element that means the thing: h2 for a heading, ul for a list, th with a scope for a data table, fieldset and legend for a group.

At a glance

Level: Level A — the minimum. Failing one of these usually makes something impossible rather than merely hard.
Principle: Perceivable
Guideline: 1.3 Adaptable
Added in: WCAG 2.0
EN 301 549: 9.1.3.1
Automated check: Partly automated

Read the official definition at W3C

How to test it by hand

Open the list of headings — a screen reader’s headings list, or a headings bookmarklet — and read it as the page’s outline. Anything that looks like a heading but is missing from the list fails.
Check that visual lists are ul or ol, that data tables have th cells, and that related radio buttons and checkboxes sit in a fieldset with a legend.
Click each visible form label: the field it belongs to should get focus. If it does not, the label is not attached.
Switch the styles off — reader mode will do — and check that the structure survives without them.

In code

Fails

<p class="section-title">Delivery</p>

<input type="radio" name="delivery" id="standard"> Standard
<input type="radio" name="delivery" id="express"> Express

Passes

<h2>Delivery</h2>

<fieldset>
  <legend>Delivery method</legend>
  <label><input type="radio" name="delivery" value="standard"> Standard</label>
  <label><input type="radio" name="delivery" value="express"> Express</label>
</fieldset>

Partly automated

How far an automated check gets

A tool finds some failures here and cannot see the rest. A clean automated result means the checks that exist found nothing — not that the criterion is met. This is the gap that makes a green scan look like an accessible site, and it is where the keyboard agent, the agents still in development and a human reviewer do the remaining work.

Missing table headers, a list built from the wrong elements and a form field with no label are all found automatically. Whether the markup matches what the page looks like grouped is not — that part still needs eyes. A skipped heading level is reported too, but as best practice: axe-core does not count it as a 1.3.1 failure, and neither do we.

Rules that check this criterion

aria-hidden-bodyaria-hidden="true" must not be present on the document body
aria-required-childrenARIA role missing required children
aria-required-parentARIA role missing required parent
definition-list<dl> elements must only directly contain properly-ordered <dt> and <dd> groups, <script>, <template> or <div> elements
dlitem<dt> and <dd> elements must be contained by a <dl>
labelForm field without a label
listInvalid list structure
listitemList item outside a list
select-nameSelect without a label
td-headers-attrBroken table header association
th-has-data-cellsTable headers in a data table must refer to data cells

The rule ids are axe-core’s (version 4.14.0), the open-source engine our scan runs, and our keyboard agent’s — the names a report or a CI log will show. An underlined id has a page of its own here.

All rules, explained

Where it matters most

The guides that list it among the criteria to check first.

Related criteria

Other criteria under the same guideline.

All WCAG 2.2 AA criteria

1.3.1 Info and Relationships