Page has heading one
Moderate effortFound on 25% of audited stores.
Add a single, descriptive `<h1>` heading to every page so screen readers and search engines can identify the page's main topic.
What it is
Every web page should have exactly one level-one heading — an `<h1>` tag — that clearly names the main subject of that page (e.g. "Women's Running Shoes" on a category page, or a product name on a product detail page). Think of it as the title written on the page itself, separate from the browser tab title. When this heading is missing, assistive technologies like screen readers have no clear starting point to announce to a visitor, and the page's content hierarchy is broken.
Why it matters
**Accessibility & legal risk:** Screen reader users — including shoppers with visual impairments — rely on the `<h1>` to understand where they are and navigate the page quickly. Missing it creates a poor, disorienting experience and can expose your store to accessibility-related legal complaints in jurisdictions where WCAG compliance is expected (e.g. ADA in the US, EN 301 549 in the EU). **SEO & rankings:** Search engine crawlers treat the `<h1>` as the strongest on-page signal for what a page is about. A missing `<h1>` weakens keyword relevance signals, which can suppress organic rankings — especially on high-value category, product, and landing pages. **Conversions:** A clear, visible page heading also reassures human shoppers they've landed in the right place, reducing bounce rates and improving confidence to buy.
How to fix it
- Identify every page type that is missing an `<h1>` (homepage, category/collection pages, product pages, blog posts, custom landing pages, policy pages).
- For each page type, decide on meaningful, keyword-rich `<h1>` text that describes the page's main topic — typically the product name, collection name, or page title.
- Add a single `<h1>` element wrapping that text in the page's HTML, ideally as the first prominent heading visible in the main content area (not in the header or footer).
- Make sure there is only ONE `<h1>` per page — having multiple `<h1>` tags is almost as problematic as having none.
- Style the `<h1>` visually so it looks like a headline (it should be readable, not hidden with `display:none` or `visibility:hidden`, which would still fail accessibility checks).
- Verify the fix using a browser's developer tools (Inspect Element → confirm the tag reads `<h1>`), a free axe DevTools browser extension, or by re-running your accessibility scanner.
<h1>Women's Running Shoes</h1>Fix it on your platform
Pick your platform for the exact steps.
How to fix page has heading one on Shopify
- **Product pages:** Go to Online Store → Themes → Actions → Edit Code. Open `templates/product.liquid` (or `sections/product-template.liquid` / `sections/main-product.liquid` in Dawn and most modern themes). Find where the product title is rendered — it is usually `{{ product.title }}` — and confirm it is wrapped in `<h1>…</h1>`. If it uses `<h2>` or a `<div>`, change the tag to `<h1>`.
- **Collection pages:** Open `templates/collection.liquid` or `sections/main-collection-banner.liquid`. Locate `{{ collection.title }}` and ensure it is inside `<h1>…</h1>`.
- **Homepage:** Open `templates/index.json` (or `index.liquid`) and check each section file rendered there. The first prominent text block (hero banner, featured title) should use an `<h1>`. Edit the relevant section `.liquid` file accordingly.
- **Custom pages:** Go to Online Store → Pages → click the page → switch the content editor to HTML view (< > icon) → ensure the first main heading uses `<h1>…</h1>`.
- **No-code option:** In the theme customizer (Online Store → Customize), some sections expose a 'Heading tag' dropdown — set it to H1 for the primary banner or page-title section.
- Save and preview each template, then verify with browser DevTools or the axe browser extension.
How to fix page has heading one on Shopify Plus
- Follow all standard Shopify steps above; Shopify Plus stores use the same Liquid theme architecture.
- For headless or custom storefronts built on the Storefront API, audit each React/Vue component that renders a page title and ensure the outermost title element is an `<h1>`.
- For checkout extensibility (checkout.liquid or checkout UI extensions), add an `<h1>` to any custom checkout page templates where one is missing.
How to fix page has heading one on WooCommerce
- **Using a block theme (FSE):** Go to Appearance → Editor → Templates. Select the template (e.g. Single Product, Product Archive). Click the title block, open Block settings on the right, and change the 'HTML element' or 'Level' setting to H1.
- **Using a classic theme:** Go to Appearance → Theme File Editor (or use a child theme). Open the relevant template file (`single-product.php`, `archive-product.php`, `page.php`). Find `the_title()` or `woocommerce_page_title()` and make sure it is inside `<h1>…</h1>`.
- **Plugin shortcut:** Install the free 'Headings Map' or 'SEOPress' plugin to audit heading structure across your site without editing code.
- Save changes and test with browser DevTools on the frontend.
How to fix page has heading one on BigCommerce
- Go to Storefront → Themes → click 'Advanced' → Edit Theme Files (Stencil theme editor).
- For **product pages**, open `templates/pages/product.html` — find the product name output (usually `{{product.title}}`) and ensure it is wrapped in `<h1>…</h1>`.
- For **category pages**, open `templates/pages/category.html` and wrap `{{category.name}}` in `<h1>…</h1>`.
- For **custom pages**, open the relevant page template or go to Storefront → Web Pages → edit the page in the HTML editor and add `<h1>Page Title</h1>` as the first heading.
- Commit the changes and preview the storefront, then verify with browser DevTools.
How to fix page has heading one on Adobe Commerce (Magento)
- **Product pages:** In your theme, locate `app/design/frontend/<Vendor>/<theme>/Magento_Catalog/templates/product/view/overview.phtml` (or the relevant `.phtml` for the title). Confirm the product name is rendered inside `<h1 class="page-title">…</h1>`. The default Luma theme already does this — if yours does not, override the template in your custom theme.
- **Category pages:** Check `app/design/frontend/<Vendor>/<theme>/Magento_Catalog/templates/category/view.phtml` and ensure `$block->getLayer()->getCurrentCategory()->getName()` is wrapped in `<h1>`.
- **CMS pages:** Go to Content → Pages → edit the page → expand 'Content' → switch to HTML editor and add `<h1>Your Page Title</h1>` as the first heading.
- **Layout XML override:** Alternatively, use `catalog_product_view.xml` / `catalog_category_view.xml` layout XML files to inject or correct the heading block without touching `.phtml` files.
- Flush cache (System → Cache Management → Flush Magento Cache) and verify on the frontend.
How to fix page has heading one on Wix
- Open the Wix Editor for the page you want to fix.
- Click on the main title text element on the page (e.g. the hero heading or page name).
- In the Text toolbar at the top, open the 'Paragraph Styles' dropdown and select **'Heading 1'** — this outputs an `<h1>` tag in Wix's rendered HTML.
- If no heading text element exists, click '+ Add' → 'Text' → 'Heading 1' and type your page title.
- For **Wix Stores** product/collection pages, Wix automatically renders product and collection names as `<h1>` in the default Wix Stores layout — if you've overridden this with a custom text box, delete the custom box and restore the default title element, or change its style to Heading 1.
- Publish the site and verify using browser DevTools (right-click the heading → Inspect).
How to fix page has heading one on Wix Studio
- Open Wix Studio and navigate to the page.
- Select the primary title text element, open its Style panel, and set the text role to **'Heading 1'** (H1) in the typography settings.
- For dynamic pages (CMS collections), open the dataset-connected text element, confirm its 'Text style' is set to H1 in the Design panel.
- Publish and verify with browser DevTools.
How to fix page has heading one on Squarespace
- Open the page in the Pages panel and click 'Edit'.
- Click on the main title or first text block. In the text editor, highlight the heading text and select **'Heading 1'** from the text-format toolbar.
- For **Squarespace Commerce** product pages: the product name is automatically rendered as an `<h1>` by the platform in standard templates — do not remove or override this block.
- For custom pages or blog posts: ensure the first content heading in each page uses the Heading 1 style, not Heading 2 or a 'Display' style (which may not output `<h1>` depending on the template version).
- Save and preview; right-click the heading and choose Inspect to confirm the tag is `<h1>`.
How to fix page has heading one on Webflow
- Open your project in the Webflow Designer and navigate to the page.
- In the Navigator or on the canvas, find the main title element. Click it and check the Element panel on the left — if it shows 'Heading' with a tag of H2 or lower, change the tag to **H1** using the tag dropdown in the Settings panel (the gear icon).
- If no `<h1>` exists, press 'A' to open Add Elements, drag a **Heading** element onto the canvas, set its tag to H1, and type the page title.
- For **Webflow Commerce** product and category pages: open the product/category template, find the product name or category name text block, and confirm its heading level is H1 in the Settings panel.
- Publish the project and inspect the live page with browser DevTools to confirm `<h1>` is present.
Does your site have this issue?
Run a free SEOLZ audit to find page has heading one — and every other issue — across your whole site in minutes.
Scan my site freeFrequently asked questions
What is Page has heading one?
Every web page should have exactly one level-one heading — an `<h1>` tag — that clearly names the main subject of that page (e.g. "Women's Running Shoes" on a category page, or a product name on a product detail page). Think of it as the title written on the page itself, separate from the browser tab title. When this heading is missing, assistive technologies like screen readers have no clear starting point to announce to a visitor, and the page's content hierarchy is broken.
Why does page has heading one matter?
**Accessibility & legal risk:** Screen reader users — including shoppers with visual impairments — rely on the `<h1>` to understand where they are and navigate the page quickly. Missing it creates a poor, disorienting experience and can expose your store to accessibility-related legal complaints in jurisdictions where WCAG compliance is expected (e.g. ADA in the US, EN 301 549 in the EU). **SEO & rankings:** Search engine crawlers treat the `<h1>` as the strongest on-page signal for what a page is about. A missing `<h1>` weakens keyword relevance signals, which can suppress organic rankings — especially on high-value category, product, and landing pages. **Conversions:** A clear, visible page heading also reassures human shoppers they've landed in the right place, reducing bounce rates and improving confidence to buy.
How do I fix page has heading one?
Add a single, descriptive `<h1>` heading to every page so screen readers and search engines can identify the page's main topic.
Authoritative references
- How to fix this specific rule — Deque/axe (rule reference)
- WCAG 2 overview — W3C WAI
- Web accessibility tutorials — W3C WAI