Checking Heading Order on Collection Pages Without Reading All the Code

Collection pages pile up headings from filters, cards, and promos, often out of order. A plain method for checking heading structure and fixing the worst problems first.

Headings are the map screen reader users navigate by. On collection pages that map is often scrambled: the page title buried under a promo heading, product names marked up as headings in random order, and filter labels styled big but marked as plain text, or the reverse.

You do not need to read the whole page source to check this. A heading outline tool or a screen reader's heading list shows the structure in seconds, and the pattern of problems on collection templates is predictable enough to fix at the source.

Pull the outline and read it like a shopper

Generate the heading list for a collection page and read only that list. It should tell a coherent story: one main title, then logical sections like filters, the product list, and any buying guide content, in the order a shopper meets them.

Red flags are easy to spot. Multiple top level headings, jumps from the title straight to a deep level, product prices or sale slogans posing as headings, and identical headings repeated with no context all mean the map misleads the people who rely on it most.

Fix the template, not page by page

Collection headings come from templates and apps, so one template fix repairs hundreds of pages. Set the collection title as the single top heading, give section labels the next level down, and decide once whether product names are headings or plain links, then apply that choice consistently.

Filter and sort tools from apps are frequent offenders, injecting their own heading levels. Where the app allows markup control, set it to match your outline. Where it does not, log it and raise it with the vendor, with the outline as evidence.

Watch promotional blocks and guides

Sale banners and mid grid promotional cards love heading tags because the styles look right. That styling shortcut puts a weekend slogan above the product list in the outline and confuses navigation for the whole sale period.

Buying guides placed under the grid are good content, but their subheadings must sit at the right level under a clear guide heading. When a guide is pasted in from a blog draft, its heading levels often arrive one step too high and break the page outline.

Recheck after merchandising changes

Collection pages change with seasons, sales, and new apps. Add a heading outline check to the same regression pass you use for other template checks, and sample your top collections plus one long tail collection each time.

Keep before and after outlines in the audit file. They show progress concretely and make the next fix faster, because the recurring offender is usually the same component wearing new content.

Related reading

If this topic is useful, these earlier guides go deeper on connected questions: Checking Your Accessibility Statement for Accuracy, ADA Risk in Product Quick View Modals, and Checking Vendor Accessibility Claims and VPATs.

Frequently asked questions

Why does heading order matter if the page looks fine?

Screen reader users navigate by headings the way sighted users skim bold titles. If headings are out of order, missing, or used for slogans, that navigation becomes guesswork. The visual page can look perfect while the spoken outline makes no sense.

How many top level headings should a collection page have?

One: the collection title. Section labels such as filters and product listings sit at the next level, and subsections nest below them. Multiple competing top level headings blur what the page is actually about.

Should product names be headings?

Either choice can work if it is consistent and fits the outline. Many stores make product names plain links to keep the outline clean, others use a low heading level uniformly. Problems come from mixing approaches across templates and apps.

What is the fastest way to check heading structure?

Use a browser headings outline tool or a screen reader's heading list and read the result top to bottom. In under a minute you will see skipped levels, duplicate titles, and promotional text posing as structure.

Home / Blog