HTML Headings

Headings in HTML define the titles and subtitles of a webpage.
They help organize your content, improve readability, and play an important role in SEO by showing search engines what your page is about.

What Are HTML Headings?

HTML provides six levels of headings, from <h1> to <h6>.
Each heading represents a different level of importance - with <h1> being the most important and <h6> the least.

<h1>This is Heading 1</h1>
<h2>This is Heading 2</h2>
<h3>This is Heading 3</h3>
<h4>This is Heading 4</h4>
<h5>This is Heading 5</h5>
<h6>This is Heading 6</h6>

Explanation of Heading Levels

• <h1> - Used for the main title of the page or main topic.
• <h2> - Used for major subheadings under <h1>.
• <h3> to <h6> - Used for sub-sections or smaller details.

Browsers automatically display <h1> as the largest text and <h6> as the smallest.

Example: Headings in Real Use

<h1>HTML Tutorial</h1>
<h2>Introduction</h2>
<h3>What is HTML?</h3>
<h4>History of HTML</h4>

This structure shows a clear hierarchy - just like chapters and sections in a book.

Styling Headings with CSS

While HTML defines structure, CSS controls how headings look.

<h1 style="color: #29AB87; font-family: Arial;">Welcome to My Website</h1>

You can change color, size, font, or alignment using CSS - but the semantic meaning of the tag remains the same.

SEO and Accessibility Tips

• Always use only one <h1> per page.
• Maintain logical order - don’t skip from <h1> to <h4>.
• Use headings to organize content, not just to make text look bigger.
• Search engines use headings to understand page hierarchy and keyword relevance.

Browser Support

Chrome	Edge	Firefox	Safari	Opera	IE9+
Yes	Yes	Yes	Yes	Yes	Yes

Conclusion

HTML headings help both users and search engines understand your content.
Use them logically, consistently, and semantically - your pages will be easier to read, better organized, and more SEO-friendly.