Skip to content
Anchor Theme
Component Guide

SR Only Title

Back to Components Overview

Before we discuss the SR Only component, it’s important to understand SEO and the role of header tags.

When Google and other search engines crawl through individual pages of a website, they use heading tags to understand the structure of the page and its various sections.

Heading tags are ranked by importance and typically vary in font size, ranging from H1 to h6. The lower the number, the more significant the tag in the page’s hierarchy.

There are some best practices to follow when structuring a page’s hierarchy. The key guideline is that each page should have one Heading 1 (H1) tag, which generally represents the page title. You can then use any number and combination of H2, H3, H4, H5, and H6 tags, depending on the content. Below is an example of a well-structured page:

  • Heading 1: About Us
    • Heading 2: Our History
      • Heading 3: 1960s – ABC Ltd. Founded and Early Years
      • Heading 3: 1970s – Factory Expansion and Distribution Chain
      • Heading 3: 1980s – Opening of a Gozo Branch
      • Heading 3: 2000s – New Factory
      • Heading 3: 2020s – Partnering with XYZ Ltd for Distribution in Australia
      • Heading 3: The Future for ABC Ltd.
    • Heading 2: Our Values
      • Heading 3: Value 1
      • Heading 3: Value 2
      • Heading 3: Value 3
      • Heading 3: Value 4
      • Heading 3: Value 5
    • Heading 2: Our Team
      • Heading 3: The Directors
        • Heading 4: Team Member Name
        • Heading 4: Team Member Name
        • Heading 4: Team Member Name
        • Heading 4: Team Member Name
      • Heading 3: Management Staff
        • Heading 4: Team Member Name
        • Heading 4: Team Member Name
        • Heading 4: Team Member Name
        • Heading 4: Team Member Name
      • Heading 3: Accounts Team
        • Heading 4: Team Member Name
        • Heading 4: Team Member Name
      • Heading 3: Distribution Team
        • Heading 4: Team Member Name
        • Heading 4: Team Member Name
    • Heading 2: Contact Us

Sometimes, when designing a page, you may find that adding an H1 title tag may be difficult due to design preferences or content limitations. For example, you might have a page with two equally important sections that you’d like to highlight. This is where the SR Only Title component can be useful.

Instead of altering the design to accommodate an H1 heading, you can add the SR Only component at the top of the page’s component list. This allows search engines to detect the page title without it being visible on the front-end.

This component doesn’t require any configuration. It automatically generates an H1 tag based on the page title, as controlled by the CMS.

Important Note: This component should not be used if an H1 tag already exists elsewhere on the page. Avoid using it on blog posts, team member profiles, or any other page type where an H1 tag is automatically added, such as in a page banner.