Skip to main content

🙋🏻 HTML Heading tags

HTML headings are defined with the <h1> to <h6> tags. <h1> defines the most important heading, while <h6> defines the least important heading.

index.html
<!DOCTYPE html>
<html>
  <head>
    <title>Heading Tags</title>
  </head>
  <body>
    <h1>This is a Heading 1</h1>
    <h2>This is a Heading 2</h2>
    <h3>This is a Heading 3</h3>
    <h4>This is a Heading 4</h4>
    <h5>This is a Heading 5</h5>
    <h6>This is a Heading 6</h6>
  </body>
</html>
http://127.0.0.1:5500/index.html

This is a Heading 1

This is a Heading 2

This is a Heading 3

This is a Heading 4

This is a Heading 5
This is a Heading 6

In the example above, the <h1> to <h6> tags define headings of different sizes. The <h1> tag defines the most important heading, while the <h6> tag defines the least important heading.

tip

Tip: Use HTML headings to define the structure of your web page. Headings are important for search engine optimization (SEO) and accessibility.

Best Practice:

  • <h1> should be used for the main heading of the page.
  • <h2> to <h6> should be used for subheadings and other content headings.
  • Avoid skipping heading levels (e.g., using <h1> followed by <h3>).
  • Use headings to create a logical structure for your content.

Summary​

HTML headings are defined with the <h1> to <h6> tags. <h1> defines the most important heading, while <h6> defines the least important heading. Headings are important for search engine optimization (SEO) and accessibility. Use headings to define the structure of your web page and create a logical structure for your content.