HTML Basics: In HTML there are 6 different headings (H1 to H6), which are organized in hierarchical order

How to use the H1 to H6 headings correctly

Headings are Block Elements that generate an automatic line break. For this reason, it is not necessary to force a line break by using the <br> tag before and after the heading.

In HTML, headings are created with the HTML tags <h1> to <h6>. The most important heading is H1. It is then followed by the headings H2, H3, ... in hierarchical order.

H1 indicates the main heading of the webpage and should be used only once on each and every webpage. To structure the text logically, the headings H2, H3, ... should be used. Subheadings divide the text into logical sections.

Headings are started with the HTML tags <, …. Without CSS, the headings are displayed in 6 different font sizes by default.

Heading    
Font Size
H1 Heading2.0em
H2 Heading1.5em
H3 Heading1.17em
H4 Heading1.0em
H5 Heading0.83em
H6 Heading0.75em
Advertisement
Example

A Level 1 Heading (Main Level) is created with the HTML <h1> tag.

<h1>This is a 1st order heading</h1>
Output of the HTML code

This is a 1. order heading

Example

A Level 2 Heading is created with the HTML <h2> tag.

<h2>This is a 2. order heading</h2>
Output of the HTML code

This is a 2. order heading

Example

A Level 3 Heading is created with the HTML <h3> tag.

<h3>This is a 3. order heading</h3>
Output of the HTML code

This is a 3. order heading

Advertisement

Headings divide the website into hierarchical text areas that provide structure for readers and Search Engines. Do not skip or omit any heading level. Always start from <h1>, followed by <h2> and so on. For most websites, headings H1 to H3 are sufficient.

Note:

The use of the correct closing tag of the heading is mandatory.