HTML Headings

Learn how to structure content using headings from h1 to h6.

What are HTML Headings?

HTML Headings are used to define titles and subtitles on a webpage. They help users and search engines understand the structure of content.

  • Headings range from <h1> to <h6>
  • <h1> is the most important
  • <h6> is the least important

Real-Life Example: Headings are like chapter titles in a book.

Types of HTML Headings

  • <h1> – Main heading
  • <h2> – Section heading
  • <h3> – Subsection heading
  • <h4> – Smaller heading
  • <h5> – Minor heading
  • <h6> – Least important heading

Heading Example

HTML Headings Example


<h1>Main Title</h1>
<h2>Section Title</h2>
<h3>Sub Section</h3>
<h4>Small Heading</h4>
<h5>Very Small Heading</h5>
<h6>Least Important Heading</h6>

                

Heading Hierarchy

Headings should be used in proper order to maintain structure and readability.

Correct Order: h1 → h2 → h3 → h4

Wrong Practice: Using h1 → h4 → h2 randomly.

Importance of Headings in SEO

  • Search engines use headings to understand content
  • <h1> should describe the main topic
  • Good headings improve page ranking

SEO Tip: Use only one <h1> per page.

Headings & Accessibility

  • Screen readers rely on headings
  • Clear hierarchy helps disabled users
  • Never use headings only for styling

Best Practices

  • Use only one h1 per page
  • Follow proper heading order
  • Do not skip heading levels
  • Use CSS for styling, not headings

Pro Tip: Headings improve readability, SEO, and accessibility.

Summary

  • HTML has six heading levels
  • h1 is the most important
  • Headings give structure to webpages