HTML h1 to h6 Tag (original) (raw)
Last Updated : 19 May, 2026
HTML heading tags, ranging from
to , are used to define the structure and hierarchy of content on a web page. These tags help organize information clearly and improve both readability and accessibility.
represents the main heading, while
represents the least important heading.
- Heading tags help search engines and screen readers understand page structure.
- They improve content organization and enhance the overall user experience.
**Syntax
**Global Attributes: Apply to all HTML elements, enhancing functionality and styling.
**Event Attributes: Trigger JavaScript functions based on user actions, enhancing interactivity.
**The six different HTML headings:
| Tag | Description | Size |
|---|---|---|
| Defines the most important heading. | 2em (32px) | |
| Defines a level 2 heading. | 1.5em (24px) | |
| Defines a level 3 heading. | 1.17em (18.72px) | |
| Defines a level 4 heading. | 1em (16px) | |
| Defines a level 5 heading. | 0.83em (13.28px) | |
| Defines the least important heading. | 0.67em (10.72px) |
HTML h1 to h6 Tag Example
**Example: Here, we displays headings from
to , each representing different levels of importance in a webpage's structure.
HTML `
Heading ExampleHeading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
`
Importance and Usage
- It is a good practice to use only one h1 tag on a single web page.
element has the highest importance in heading levels the content inside this tag shows the main and important title of the web page.
- If using more than one heading tag, do not skip the levels of the heading. Starting must be from
element to define the title of the web page and then use
element then
and so on.
- Always use heading elements to define headings or the sub-headings of the web page do not use them for any style like font size or font weight.
- If the web page has proper use of headings then it would be easy to rank the website which improves the visibility to the web page.