Headings are how you give your content hierarchy and structure. Just like a book has chapters, sections, and subsections, your webpage needs a clear hierarchy so readers can scan and understand what matters most.
HTML gives you six levels of headings, from <h1> down to <h6>. Think of <h1> as the title of your entire page and <h6> as the smallest sub-heading you will ever need.
Heading Levels
Here is how each level looks. Notice how the size decreases as the number increases.
<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>Why Heading Hierarchy Matters
Here is something a lot of beginners get wrong — they pick headings based on size. They want something big so they use <h1>. They want something small so they use <h4>. That is not how headings work.
Headings are about importance, not size. Your page should have exactly one <h1> — the main title. Then <h2> for major sections, <h3> for subsections inside those, and so on. Skip levels only when it makes logical sense.
Why does this matter? Two big reasons:
- Accessibility — Screen readers use headings to navigate. A proper heading structure lets visually impaired users jump between sections just like sighted users scan visually.
- SEO — Search engines pay close attention to your heading structure. A well-structured page ranks better because Google understands your content hierarchy.
If you want bigger or smaller text, use CSS. Use headings for structure, not for styling.
A Proper Heading Structure
Here is what a good heading hierarchy looks like:
<h1>My Travel Blog</h1>
<h2>Asia</h2>
<h3>Japan</h3>
<h3>Thailand</h3>
<h2>Europe</h2>
<h3>France</h3>
<h4>Paris</h4>
<h3>Italy</h3>
<h2>About Me</h2>See how the hierarchy flows? <h1> is the blog name, <h2> is continents, <h3> is countries, <h4> is cities within a country. That makes sense. Do not skip from <h1> to <h4> unless your content genuinely has that gap.