HTML Headings

Headings help in defining the hierarchy and the structure of the web page.

HTML Headings

HTML uses six levels of heading tags <h1> to <h6>; the higher the heading level number, the greater it's importance — so <h1> defines the most important heading, whereas the <h6> defines the least important heading in the document.

  • <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>

Note: Each time you place a heading tag, your web browser built-in style sheets automatically create some empty space before and after each heading. Use CSS margin property to override browser's default style sheet.

Importance of Headings

  • HTML headings provide valuable information by highlighting important topics and the structure of the document.
  • Don't use headings to make text BIG or bold. Use it only for highlighting the heading of your document and to show the document structure.
  • As search engines use headings to index the structure and content of your web pages so use it very wisely in your webpage.
  • Use <h1> headings as main headings, followed by <h2> headings, then the less important <h3> headings, and so on.

Tip: A document generally should have exactly one <h1> element to mark the most important heading, followed by the <h2>, <h3> and so on.

Your Feedback:

We would love to hear from you, please drop us a line.