HTML Header Tag
What is a heading tag?
Heading tag on a website refers to a text title or a subtitle which has the html tag on front and back of the text title or the subtitle.
For example:
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
In general definition a heading is a title or topic of a document , article, chapter, or it is of a section of some content. When we write a paragraph, an article or any writing we put a heading or a title on top to tag what subject is it about. Just like that on websites heading tag is used to tag the title of the content or description. Heading tag is an HTML tag which tag to define any text or title to be a header of the webpage.
For example:
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
In general definition a heading is a title or topic of a document , article, chapter, or it is of a section of some content. When we write a paragraph, an article or any writing we put a heading or a title on top to tag what subject is it about. Just like that on websites heading tag is used to tag the title of the content or description. Heading tag is an HTML tag which tag to define any text or title to be a header of the webpage.
What is the difference between title tag and heading tag?
In HTML the title tag is is a tag on the text just like we put header tag on a text. So both of them are a tag. Title tag is used for a webpage one time which you can see on the browsers tab as well and even in the search engine results pages (SERP). When a user search in the page it shows the title first then the description of the page. The header tag on the other hand is used to describe the content of your page. You can use multiple headers to describe multiple content writing topics and you can also organize and give breaks to it like a structure for the text or the content sections on a page so that it may become more easy for visitors and search engines to navigate and understand your page.
Why is heading tag needed?
If you do not organize your content or text using proper heading tags, people browsing online may not find be able to find your content because the search engines could not find any heading tags on your website. Without a heading the search engines cannot provided SEO friendly content to the people who are searching about the specific topic or subject you have written about. So, the title with heading tag is necessary. In terms of search engine optimization heading tag has to be present to define the title of the content. Search engines use these headings or tags to identify and to index the structure and content of your website. Without heading tags, the content is more like a headless body. So, the heading is the head for the content and the content is the body for the heading.
What are the uses of different heading tag
Heading tags H1 tags are for the most important heading tag for a website. And after that the importance of the heading reduces gradually meaning H2 H3 H4 H5 H6. So h6 is the most less important tag to use. Remember not to use too many heading tags in a website and to keep things organized. So, the headings are organized based on the content of your website. Do not try to overuse headings unless you know how you are organizing the content or how much content you have to explain your heading.
How many times can you use heading tags on a single webpage?
An H1 tag heading can only be used one time in one page. Whether it is the main page or weather it is a sub page you can only use it one time and you must have an H1 tag on your page. The H2, H3, H4, H5, H6 are more like sub headings of each other. H2 tag is the sub heading of H1 tag, H3 heading is the sub heading of H2 tag, H4 is the subheading of H3 tag. H5 is the subheading of H4 tag, H6 is the subheading of H5 tag and it goes on and on depending in the content. H4, H5, and H6 tags: These are rarely used but are provided if needed. Always remember that not all topics have diverse types so depending on category we make use of the headings. Tags should be used upon need and necessity depending on the type of content and if it has different sub topics to add a title to.
Why use heading tags?
It is to organize the page size like we organize any article. The way a human understands even the robot bots which crawl the page also want to understand the page what it is about and depending on what and how things are written it shows the result in proper way to the people who search for information. In terms of building or making website it is a good practice which many neglect because of design or for the hassle of thinking. But those who can organize their headings properly have a more beautiful and organized site along with the search engines to rank it because of proper content and writing skills. So along with heading content writing is also connected.
How to write a proper heading?
When you write a heading you always have to remember that it has to be the center or attention relation to the subject you are writing. It is more like you wrote a 250 word section or content about something and you put some keywords from those writings in to your heading. It's like all you wrote can now be understood by just reading that short title so the users and even the search engines can figure out what is the subject you wrote the content about. It is better to keep the heading tag under 70 words although there is no limitation. But for best SEO practice you get best results in the search engines.
What are the regulations of writing headings?
Always start with one h1 tag for the page. After then 2 or 3 h2 tags then h3 tags than if necessary then h4 the rest of the tags such ash h5 or h6 tag rarely have any use. So try to keep things organized and used if your content needs the heading. For example if you have a lot of nested elements. Example below:
1. h1 Beetles
I. h2 Etymology
ii. h2 Distribution and Diversity
iii. h2 Evolution
I. h3 Late Paleozoic
ii. h3 Jurassic
iii. h3 Cretaceous
iv. h3 Cenozoic
iv. h2 External Morphology
I. h3 Head
I. h4 Mouthparts
ii. h3 Thorax
I. h4 Prothorax
ii. h4 Prothorax
iii. h3 Legs
iv. h3 Wings
V. h3 Abdomen
1. h1 Beetles
I. h2 Etymology
ii. h2 Distribution and Diversity
iii. h2 Evolution
I. h3 Late Paleozoic
ii. h3 Jurassic
iii. h3 Cretaceous
iv. h3 Cenozoic
iv. h2 External Morphology
I. h3 Head
I. h4 Mouthparts
ii. h3 Thorax
I. h4 Prothorax
ii. h4 Prothorax
iii. h3 Legs
iv. h3 Wings
V. h3 Abdomen
What should be the heading font size?
In terms of for size for the text it does not effect SEO in any level. But it is more about keeping things organized so there is a regulation where the h1 header has to be the larger than the rest of the headings and the other headings can gradually shrink following it. According to some learning understanding below are the standard
Heading Tags | EM |
| PX | PT |
Heading 1 | 2 em |
| 32 | 24 |
Heading 2 | 1.5 em |
| 24 | 18 |
Heading 3 | 1.17 em |
| 18.72 | 14.04 |
Heading 4 | 1 em |
| 16 | 12 |
Heading 5 | 0.83 em |
| 13.28 | 9.95 |
Heading 6 | 0.67 em |
| 10.72 | 8.04 |
But in terms of design and development font size can change. But one thing which has to be kept in mind is that no way the text should be smaller than 10 pt for the content which is written in the website. The headers will be larger than the content font size. Meaning if the h2 header is 24 pixels the content text size should be 14pt-16pt and if you are using h3 or h4 header which may have 16pt-13pt then your text size should be responsively below that estimating. 10pt-12pt.
