Introduction to HTML Heading | Importance of HTML Heading | Types of HTML Heading | Example of HTML Heading
The Heading is a word, syllable, or sentence written first in a Document, Article, Blog Post, etc.
The Heading is precisely the same as Page Title. You can compare the Heading with "Title."
Like Newspaper Articles and Magazine Articles, Headings are also written on Webpages and HTML Documents.
In this lesson, we will give you complete information about HTML Heading Tag.
To understand HTML Headings, we have divided this lesson into several parts. About whom are being told below.
{tocify} $title={Table of Contents}
1. Introduction to HTML Heading
The heading Element is used to define a Heading in HTML. Heading Element supports Heading up to 6 levels, determined by <H1> to <H6> Element respectively.
HTML Headings are used based on their importance.
<h1> Level Heading will be used for the most important Heading. And <H6> Level Heading will be used for the least essential Heading.
The Heading of each level has a default size, which may differ in different browsers. That's why you can set the size, color, alignment, etc., of each level, 's heading by CSS - Cascading Style Sheets.
Due to this, each browser has the same type of Headings Display.
If there is a title in your HTML document, then you should use Heading Element only for it. Because with this, you maintain the HTML Standard.
You can also get formatting like <h1> by using another tag <big> of HTML for Heading Formatting.
But, by this, you are breaking the HTML Standard, which reduces the readability of your webpage.
2. Importance of HTML Heading
Headings are used in newspapers and magazines to attract the attention of readers. Readers reach the main content by reading the attractive title.
Similarly, Headings are also used in Webpages, Blog Posts, or other Web Writings to attract readers' attention.
HTML Headings are used by Search Engine(s) to index the content. Apart from these, HTML Headings are very important. About whom are being told inside the post.
1. Headings are used to highlighting the title and structure of the document. The document title is defined by Mainly H1 Heading.
2. Headings are necessary to divide the document into sections. Document Structure becomes readable with Headings. Due to this, the reader remains connected to the content.
3. Headings divide a webpage into several parts. Titles to these parts are given by Heading. By reading this, readers get an idea about the importance of our document.
4. Headings play the most important role in giving instant information to the readers.
5. Search Engines also use HTML Headings to index our content quickly and correctly.
3. Types of HTML Heading
In HTML, 6 types of Headings have been given to defining Document Structure properly. About whom are being told below.
H1 Level Heading
This is the main Heading of the HTML document. And this is also the first important Heading. The title of a Blog Post or Webpage is defined only by the Heading of the H1 Level.
It is advised to use this Heading only once in the document.
Example:
<h1> This is 1st Level Heading. </h1>{codeBox}
H2 Level Heading
This is the sub-heading of the HTML Document. It is used after Main Heading. H2 Heading gives a sub-heading to the document.
Example:
<h2> This is 2nd Level Heading. </h2>{codeBox}
H3 Level Heading
This is called Sub-sub-heading. And it is also known as Minor Heading. It is used to give more in-depth heading in the Use Document.
Example:
<h3> This is 3rd Level Heading. </h3>{codeBox}
H4 Level Heading
This is called 4th Level Heading. With this heading, the document is divided into deep sections. It is used to divide a large topic into smaller sections.
Example:
<h4> This is 4th Level Heading. </h4>{codeBox}
H5 Level Heading
5th Level Heading helps divide the content further. It is defined by the H5 Element.
Example:
<h5> This is 5th Level Heading. </h5>{codeBox}
H6 Level Heading
6th Level Heading is also helpful in dividing the content more deeply. This is the heading of the least importance. It is defined by the H6 Element
Example:
<h6> This is 6th Level Heading. </h6>{codeBox}
4. Example of HTML Heading
Now you have complete information about HTML Headings. Now is the time to apply what you have learned so far. to use it practically.
For this purpose, we have prepared an example after using which the concept of HTML Headings will be absolutely clear.
Copy the HTML code below and paste it into Notepad or type it directly in Notepad with your hands.
<!DOCTYPE html><html><head><meta charset="utf-8"><title>HTML Heading Example</title></head><body><h1>This is First Level Heading </h1><h2> This is Second Level Heading </h2><h3> This is Third Level Heading </h3><h4> This is Fourth Level Heading </h4><h5> This is Fifth Level Heading </h5><h6> This is Sixth Level Heading </h6></body></html>{codeBox}
HTML heading Default size;
Note – Use the H1 tag only once in the entire webpage, you can use the rest of the heading tags as per your requirement.
Conclusion:
Friends, according to my expertise, I have written complete information to help you on “HTML Heading Element | HTML Heading Tag.” If this post is favourable for you or not, please tell me by commenting.
If you liked this post, do not forget to share it with your friends so they can get information about it.
You can ask us through comments if you still have questions or doubts, I will answer all your questions, and you can contact us for more information.
Please tell us through the comment section if you think we miss anything.
