HTML Headings

You can already write elements and attributes. This session focuses on headings — the tags that label the main title and section titles of a page. Good headings help readers scan a page and help browsers and assistive tools understand the outline.

What are HTML headings?

HTML headings are six levels of title elements: h1, h2, h3, h4, h5, and h6. h1 is the highest-level heading on the page. h6 is the lowest. These tags are for meaning and structure. Visual size can be changed later with CSS; do not pick a heading level only because you want bigger or smaller text.

Direct answer

Use headings to build a clear outline. Prefer one main h1 for the page topic. Use h2 for major sections under that topic, then h3 for subsections, and so on. Keep levels in order when you can — jumping from h1 straight to h4 usually makes the outline harder to follow.

Reading the example

• h1 introduces the whole page topic
• h2 starts a major section under that topic
• h3 starts a smaller part inside that section
• The paragraph is normal body text, not a heading

Why heading order matters

Headings create a document outline, similar to a table of contents. Screen readers and some SEO tools use that outline. If you skip levels only for look-and-feel, the structure becomes confusing even if the page still “looks fine” to you.

One h1, then sections

For beginner pages in this course, keep a single clear h1. Then organize content with h2 and deeper levels as needed. You will meet more advanced outline patterns later; first master this simple, readable pattern.

Headings are not for empty spacing

Do not use empty heading tags to create blank vertical space. Do not wrap every bold phrase in a heading. If text is not a real title for a section, use a paragraph or another suitable element instead.

Try it yourself

1. Create or open an HTML file with the basic skeleton
2. Add one h1 that names the page topic
3. Add two h2 sections with a short paragraph under each
4. Under one h2, add an h3 and a short paragraph
5. Save and open the page — check that the outline is easy to scan

Common mistakes

• Choosing heading levels only by font size instead of structure
• Skipping from h1 to h4 without a reason
• Using many h1 tags on a simple beginner page when one clear main title is enough
• Putting long paragraphs inside heading tags
• Using headings as decorative spacers with no real section title

Summary

• Headings use h1 through h6 to mark title levels
• They build structure and outline, not just visual size
• Prefer one clear h1, then orderly h2–h6 sections
• Avoid skipping levels only for styling
• Keep heading text short and title-like
• Style size with CSS later; keep HTML headings semantic