HTML Heading Tags - <H1> to <H6>

Definition

The tags <h1>, <h2>, <h3>, <h4>, <h5>, and <h6> are used to define HTML headings. The headings are ranked in order of importance or rank.

Example

<h1>H1 Heading</h1>
<h2>H2 Heading</h2>
<h3>H3 Heading</h3>
<h4>H4 Heading</h4>
<h5>H5 Heading</h5>
<h6>H6 Heading</h6>

Usage

• The heading (usually <h1>) represents the heading for that explicit section.
• Headings of equal or higher rank start new subsections that are part of the previous parent section.
• Headings of lower rank start new subsections.
• Headings may be nested in order to reflect the organization of the page. Most screen readers generate an ordered list of headings on a page making it easier for them to understand and navigate the content. An example of nested headings:

  <h1>H1 Heading</h1>
  <h2>H2 Heading</h2>
    <h3>H3 Heading</h3>
  <h2>H2 Heading</h2>
    <h3>H3 Heading</h3>
      <h4>H4 Heading</h4>

Attributes

The H1 to H6 element only supports the Global Attributes.

Best Practices

• It is best practice to only include one <h1> heading per page, but Google’s John Mueller has confirmed that you can use as many as you want:

  As many as you want.

  — Hey John, Your profile caught my eye. Ouch. (@JohnMu) April 12, 2017

  That being said, users using screen readers may expect there to be only one <h1> tag and including more than one might be confusing.

• You should not skip heading levels as it may confuse users using screen readers. For example:

  • This is not good practice:

    <h1>Heading 1</h1>
    <h3>Heading 3</h3>
    <h4>Heading 4</h4>

  • This is good practice:

    <h1>Heading 1</h1>
    <h2>Heading 2</h2>
    <h3>Heading 3</h3>

• For SEO purposes, you may want to use lower importance <h4>, <h5>, or <h6> tags in your footers or sidebars. That being said, Google does use <h3> tags for their footer headings on web.dev.

  This is likely because Google understands semantic HTML, namely that the <footer> element is in a different content sectioning element to the main content, and as such doesn’t belong to the main flow.

Specification

• HTML Living Standard Specification
• HTML5 Specification

Browser Support

Desktop

Mobile