HTML Headings
h1 to h6 tags are used to define different types of headings (<h1> to </h6>).
There are six types of headings from h1 to h6.
The most important heading is h1. It means it has big font-size.
The importance of heading decreases from h1 to h6.
h6 defines least important heading. It means it has small font-size.
Example
<h1>This is the most important Heading.</h1>
<h2>This is the least important than Heading1</h2>
<h3>This is the least important than Heading2</h3>
<h4>This Heading has ranking 4.</h4>
<h5>This Heading has ranking 5.</h5>
<h6>This Heading has ranking 6.</h6>Why are Headings so important?
h1 represents explicitly the title of a page. The heading1 (<h1>) is the most important heading.
Headings may also be used in other elements. In <section> element, we write these headings to explain different topics in a page.
Example
<section>
<h1>website</h1>
<p>Here, the description about the website should be written such as it is a combination of webpages.</p>
</section>
Headings order
Least important heading (small font) should not have a most important heading (big font) as a child in a block of content such as <section> element.
We should always have small size heading as a descendant of a big size heading in a page or <section> element.
Example
<section>
<h2>website</h2>
<p>Here, the description about the website should be written such as it is a combination of webpages.</p>
<h1>webpage</h1>
<p>the basic structure of webpage is made using html.</p>
</section>
In the above example, h1 is being used as the child of h2 in a section element which is wrong.
Next Previous
Was this article helpful?
