{"id":344,"date":"2023-10-24T13:22:13","date_gmt":"2023-10-24T17:22:13","guid":{"rendered":"https:\/\/carleton.ca\/cutheme-docs\/?page_id=344"},"modified":"2026-08-10T20:16:33","modified_gmt":"2026-08-11T00:16:33","slug":"heading","status":"publish","type":"page","link":"https:\/\/carleton.ca\/cutheme-docs\/basic-training\/basic-training-module-3-essential-blocks\/heading\/","title":{"rendered":"Heading"},"content":{"rendered":"\n
\n
\n\n
\n
\n
\n

\n Heading\n <\/h1>\n \n \n \n\n

Basic Training Module 3: Essential Blocks<\/p>\n\n\n <\/header>\n\n <\/div>\n\n <\/div>\n\n <\/div>\n<\/section>\n\n\n\n

Headings are used to organize content into sections and make pages easier to read. They help visitors quickly scan a page and understand how information is structured.<\/p>\n\n\n\n

Headings also play an important role in accessibility, allowing screen reader users and other visitors to navigate content more effectively.<\/p>\n\n\n\n

Think of headings as the outline of your page. Just as a document uses titles and section headings to organize information, web pages use Heading blocks to define content structure.<\/p>\n\n\n\n

When to Use a Heading Block<\/h2>\n\n\n\n

Use a Heading block whenever you want to introduce a new section of content.<\/p>\n\n\n\n

Examples include:<\/p>\n\n\n\n

    \n
  • Section titles<\/li>\n\n\n\n
  • Topic headings<\/li>\n\n\n\n
  • Subheadings<\/li>\n\n\n\n
  • Frequently Asked Questions<\/li>\n\n\n\n
  • Content categories within a page<\/li>\n<\/ul>\n\n\n\n

    Headings should be used to organize information, not simply to make text larger.<\/p>\n\n\n\n

    \"A<\/figure>\n\n\n\n

    Adding a Heading Block<\/h2>\n\n\n\n

    To add a Heading block:<\/p>\n\n\n\n

      \n
    1. Click the +<\/strong> button and search for Heading<\/strong>.<\/li>\n\n\n\n
    2. Select the Heading block.<\/li>\n\n\n\n
    3. Enter your heading text.<\/li>\n<\/ol>\n\n\n\n

      You can also type: \/heading<\/code> and select the Heading block from the list that appears.<\/p>\n\n\n\n

      Understanding Heading Levels<\/h2>\n\n\n\n

      Headings are organized using levels.<\/p>\n\n\n\n

      The most common heading levels used in cutheme are:<\/p>\n\n\n\n

        \n
      • Heading 2 (H2)<\/li>\n\n\n\n
      • Heading 3 (H3)<\/li>\n\n\n\n
      • Heading 4 (H4)<\/li>\n<\/ul>\n\n\n\n

        Think of heading levels as a hierarchy.<\/p>\n\n\n\n

        Example:<\/p>\n\n\n\n

        H2 Programs\n    H3 Undergraduate Programs\n        H4 Admission Requirements\n    H3 Graduate Programs\n        H4 Application Process<\/code><\/pre>\n\n\n\n
        A lower-level heading should always relate to the heading above it.<\/p>\n\n\n\n
        Choosing the Correct Heading Level<\/h2>\n\n\n\n
        In most cutheme pages:<\/p>\n\n\n\n
          \n
        • The page title serves as the main heading.<\/li>\n\n\n\n
        • Content sections begin with H2<\/strong> headings.<\/li>\n\n\n\n
        • Subsections use H3<\/strong> headings.<\/li>\n\n\n\n
        • Additional levels use H4<\/strong> headings.<\/li>\n<\/ul>\n\n\n\n
          Avoid skipping heading levels whenever possible.<\/p>\n\n\n\n
          Good Example<\/strong><\/p>\n\n\n\n
          H2 Services\n    H3 Student Services\n    H3 Career Services<\/code><\/pre>\n\n\n\n
          Avoid<\/strong><\/p>\n\n\n\n
          H2 Services\n    H4 Student Services<\/code><\/pre>\n\n\n\n
          Using headings in sequence creates a clear and accessible document structure.<\/p>\n\n\n\n
          Best Practices<\/h2>\n\n\n\n
          Use Headings to Organize Content<\/strong><\/p>\n\n\n\n
            \n
          • Break long pages into logical sections using headings.<\/li>\n\n\n\n
          • Visitors often scan pages before reading them in detail.<\/li>\n<\/ul>\n\n\n\n
            Keep Headings Descriptive<\/strong><\/p>\n\n\n\n
            A heading should clearly describe the content that follows.<\/p>\n\n\n\n
            Good Examples:<\/p>\n\n\n\n
              \n
            • Admission Requirements<\/li>\n\n\n\n
            • Contact Information<\/li>\n\n\n\n
            • Frequently Asked Questions<\/li>\n<\/ul>\n\n\n\n
              Less Helpful Examples:<\/p>\n\n\n\n
                \n
              • More Information<\/li>\n\n\n\n
              • Details<\/li>\n\n\n\n
              • Click Here<\/li>\n<\/ul>\n\n\n\n
                Don’t Use Headings for Styling<\/strong><\/p>\n\n\n\n
                If you want larger text, use formatting options provided by your site’s design system.<\/p>\n\n\n\n
                Choose heading levels based on content structure, not appearance.<\/p>\n\n\n\n
                Keep Headings Concise<\/strong><\/p>\n\n\n\n
                Most headings should be short and easy to scan.<\/p>\n\n\n\n
                \n