# Long pages with no subheadings

Source: https://easeweb.dev/learn/section-headings
Topics: Page structure > Long content is divided by headings (WCAG 2.4.10)
The fix: Group the paragraphs by topic and start each group with an h2 that names it, such as Refunds or Exchanges, with an h3 for a topic inside one of them. The text itself stays as it is: the headings divide it, they don't replace any of it.
Test with: screen reader
References: https://www.w3.org/WAI/WCAG22/Understanding/section-headings.html https://www.w3.org/WAI/WCAG22/Techniques/general/G141 https://www.w3.org/WAI/WCAG22/Techniques/html/H69 https://www.w3.org/WAI/WCAG22/Understanding/info-and-relationships.html https://webaim.org/projects/screenreadersurvey11/ https://www.w3.org/WAI/tutorials/page-structure/headings/ https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/Heading_Elements

This is a recreated teaching example, not a finding about a named client. The code is a starting pattern: test it in your own product. No completed assistive-technology test is claimed here.

## What happens

A clothing shop's help centre has a page called Returns and refunds. It was written in one go in the CMS's text block: under the title, twelve paragraphs, each about one thing. The first two give the time limit, the next three say what can be returned, three more say how to send a parcel back, two cover refunds, and the last two cover exchanges and damaged items. The paragraphs are well written, and the page reads well from top to bottom.

Most people don't read it from top to bottom. They come with one question, such as how long a refund takes, and look for the part that answers it. A sighted reader sees twelve grey blocks that look alike, with nothing that marks where refunds start. A screen reader user opens the headings list, or presses H to jump from heading to heading, and finds one entry: "Returns and refunds, heading level 1". The refund time is in the ninth paragraph, and the only way to it is to listen from the top.

## Why it fails

Success Criterion 2.4.10 Section Headings (Level AAA) asks that section headings be used to organise content. Its Understanding page says that when a page is organised into sections, those sections need headings that introduce them, and that rules, boxes and other visual presentation can complement headings but are not enough on their own to identify a section. WCAG defines a section as a self-contained part of written content that deals with one or more related topics, and it may be a single paragraph. The returns page has six such sections, from the time limit to damaged items, and none of them starts with a heading. Technique G141 tests exactly this: examine a page with content organised into sections, and check that a heading for each one exists.

Nothing in HTML asks for a heading. A page with one `h1` and twelve `p` elements is valid, the browser shows it without complaint, and the CMS's text block saves whatever is typed into it. Whether the text has topics is something only the writer knows, so the headings are added only if the writer adds them.

This is a different failure from the one in [headings that don't match the page's sections](/learn/heading-structure). There, the sections have titles that are drawn but not marked up, and 1.3.1 fails. Here, there are no titles at all to mark up.

## Who is affected

Nobody who reads the page through from the start misses anything. The failure reaches people who look for one part of a long page, which is how help pages, policies, terms and guides are often read, and who find nothing on the page to look for it by.

## What automation and AI miss

Every element on the page is valid, so a scan has nothing to report. axe's `page-has-heading-one` passes, since the title is an `h1`, and `heading-order` has only one heading to compare. The audit sends a page to review as `ew:section-headings-manual-check` when six or more paragraphs, or twelve or more form fields, run on in its main content with no heading between them. The paragraphs have to hold 1,000 characters or more between them, with a Japanese or Chinese character, or any other full-width one, counted as two, and a group of radio buttons or checkboxes counts as one field. It can't tell whether the text falls into topics: a letter or a short story can run on for pages and need no headings at all. Where the topics start, and what to call each one, take a person who reads the text. When a tool adds headings for you, read them: check that each one names what its section really says, and that no topic has been split in two or given a heading for every paragraph.

## Before: twelve paragraphs under one title

```html
<main>
  <h1>Returns and refunds</h1>
  <p>You can return most items within 30 days of delivery. …</p>
  <p>Orders placed between 1 November and 24 December can be returned until 31 January.</p>
  <p>Items must be unused and in their original packaging, with any tags still attached. …</p>
  <p>Items bought in a sale can be returned like any other, and we refund the price you paid.</p>
  <p>Personalised items, such as engraved jewellery, can only be returned if they arrive damaged.</p>
  <p>To start a return, sign in, open Your orders and choose Return next to the item. …</p>
  <p>We'll email you a prepaid label. …</p>
  <p>Pack the items securely, and keep the post office receipt until your refund arrives.</p>
  <p>Once your parcel reaches us, we check it within two working days. …</p>
  <p>If you paid with a gift card, the refund goes onto a new gift card, which we email to you.</p>
  <p>If you'd like another size or colour, return the item and place a new order, …</p>
  <p>If something arrives damaged or isn't what you ordered, email us a photo within 7 days. …</p>
</main>
```

- Twelve paragraphs follow the title, and nothing on the page marks where a new topic starts.
- The time limit, what can be returned, sending it back, refunds, exchanges and damaged items are six topics, and none of them has a heading.
- A screen reader's headings list holds only Returns and refunds, so finding the refunds means listening from the top.

## After: a heading at the start of each topic

```html
<main>
  <h1>Returns and refunds</h1>
  <h2>Return window</h2>
  <p>You can return most items within 30 days of delivery. …</p>
  <p>Orders placed between 1 November and 24 December can be returned until 31 January.</p>
  <h2>What can be returned</h2>
  <p>Items must be unused and in their original packaging, with any tags still attached. …</p>
  <p>Items bought in a sale can be returned like any other, and we refund the price you paid.</p>
  <p>Personalised items, such as engraved jewellery, can only be returned if they arrive damaged.</p>
  <h2>Sending it back</h2>
  <p>To start a return, sign in, open Your orders and choose Return next to the item. …</p>
  <p>We'll email you a prepaid label. …</p>
  <p>Pack the items securely, and keep the post office receipt until your refund arrives.</p>
  <h2>Refunds</h2>
  <p>Once your parcel reaches us, we check it within two working days. …</p>
  <p>If you paid with a gift card, the refund goes onto a new gift card, which we email to you.</p>
  <h2>Exchanges</h2>
  <p>If you'd like another size or colour, return the item and place a new order, …</p>
  <h2>Damaged or wrong items</h2>
  <p>If something arrives damaged or isn't what you ordered, email us a photo within 7 days. …</p>
</main>
```

1. Read the text and mark where each topic starts. Paragraphs about the same thing stay together: what can be returned and sale items are one topic, and so are starting a return and the label.
2. Start each topic with an `h2`, one level below the page's `h1`. A screen reader lists it, and jumping to it lands at the start of its topic.
3. Name each heading after what its topic answers, in the words people come looking for: Refunds, Exchanges, Damaged or wrong items.

The six topics now each start with a heading, so the page shows its outline on screen and in the headings list, and the refund time is one jump away. This fixes the Before and passes 2.4.10. Because the headings are `h2` elements, the structure people see is in the code too, as 1.3.1 asks. The text of the paragraphs hasn't changed.

## Implementation decisions

The headings go missing most often where the editor makes them hard to add:

- A page builder's text widget, or a CMS field, that offers bold but no heading styles. Give the field a heading option limited to the levels its content can use, usually h2 to h4, so a writer doesn't draw a heading in bold instead. A heading drawn in bold is the failure in [headings that don't match the page's sections](/learn/heading-structure).
- Text pasted from a word processor, where the headings were bold lines and arrive as paragraphs. Paste as plain text and add the headings in the editor.
- A template that puts the whole body in one field. A policy or help article that will grow benefits from a field per section, each with its own heading.

Divide by topic, not by length. A section can be one paragraph, as Exchanges is here, and a heading on every paragraph makes the headings list as long as the page. Where one topic has parts of its own, such as refunds by card and refunds by gift card, give each part an `h3` inside its `h2` section.

Rules, extra space and boxes can show where a section ends, but they don't name it, and a screen reader doesn't list them. Use them beside a heading, never in place of one.

On a very long page, a list of links to the headings at the top lets anyone jump to a section, not only screen reader users. Give each `h2` an `id` and link to it. The list adds to the headings and doesn't replace them.

A long form is divided the same way. A settings page, or an application form with contact details, delivery and payment, gets a heading for each group of fields. A `fieldset` with a `legend` names a group when a screen reader moves into it, but a legend doesn't appear in a screen reader's headings list, so the groups people jump between on a long form need headings as well.

Some writing has no sections. The Understanding page gives two examples: a letter, which may cover several topics but where headings would be strange, and an existing document posted as it was written, whose author included none. A story or a news report that reads straight through is the same. 2.4.10 asks for headings where the content is organised into sections, not on every long page. Its note adds that it covers sections within writing, not user interface components, which 4.1.2 covers.

## Verify the fix

1. Read the page and mark where each topic starts. Every one has a heading just before it, and every heading names what its section covers.
2. List the page's headings, from the accessibility tree in the browser's developer tools or a headings outline extension. Each section heading is an `h2`–`h6`, one level below the heading of the section it sits in, and none is empty.
3. With a screen reader, open the headings list (in NVDA, Insert + F7 and choose Headings; in VoiceOver, the rotor) and choose the heading of one topic, such as Refunds. It lands at the start of that topic and is announced with its level. Press H in NVDA or JAWS to move on to the next section.
4. Read only the headings, from top to bottom, without the text between them. They make an outline someone could choose a section from.

Record the OS, browser and assistive-technology versions, the build, the date, and the actual result of each step. Repeat whenever the page's text, its template or the editor's styles change.

## Limits

This is a starting pattern, not a guarantee for every application. The text, the shop and the `…` in the code are placeholders. Screen readers word the headings list differently, so listen for the headings and their levels rather than the exact phrasing. Where the topics start, and what each heading should say, depend on the text, and no rule can settle them for every page. This guide covers whether long content has headings at all. Whether the headings that exist are marked up, at the right levels and with words that describe their sections, is in [headings that don't match the page's sections](/learn/heading-structure). Test the complete journey with your target assistive technology.

---

Get this guide in your coding agent: MCP https://easeweb.dev/mcp (setup at https://easeweb.dev/services/developers)