HTML Track Track

Headings are like an outline for your page. They tell both users and search engines what each section is about. HTML provides six heading levels, from <h1> (most important) to <h6> (least important).

The Six Levels

<h1>Main Title</h1>        <!-- only ONE per page -->
<h2>Chapter</h2>
<h3>Section</h3>
<h4>Subsection</h4>
<h5>Minor heading</h5>
<h6>Smallest heading</h6>

Best Practices

One <h1> per page — it is the main title, like the title of a book.

Never skip levels — go h1 → h2 → h3, not h1 → h3. Skipping confuses screen readers.

Use headings for structure, not for making text bigger — CSS handles visual size.

Think of it like a book outline:

<h1> = Book title

<h2> = Chapter

<h3> = Section within a chapter

Your Task

Create a heading structure for a blog:

An <h1> with text "My Blog"

An <h2> with text "Recent Posts"

An <h3> with text "Learning HTML"

Another <h3> with text "CSS Basics"

The two <h3> headings are siblings under the same <h2>, representing two blog posts in the same section.

The Six Levels

<h1>Main Title</h1>        <!-- only ONE per page -->
<h2>Chapter</h2>
<h3>Section</h3>
<h4>Subsection</h4>
<h5>Minor heading</h5>
<h6>Smallest heading</h6>

Best Practices

One <h1> per page — it is the main title, like the title of a book.

Never skip levels — go h1 → h2 → h3, not h1 → h3. Skipping confuses screen readers.

Use headings for structure, not for making text bigger — CSS handles visual size.

Think of it like a book outline:

<h1> = Book title

<h2> = Chapter

<h3> = Section within a chapter

Your Task

Create a heading structure for a blog:

An <h1> with text "My Blog"

An <h2> with text "Recent Posts"

An <h3> with text "Learning HTML"

Another <h3> with text "CSS Basics"

The two <h3> headings are siblings under the same <h2>, representing two blog posts in the same section.

Heading Hierarchy

The Six Levels

Best Practices

Your Task

Heading Hierarchy

The Six Levels

Best Practices

Your Task