Headings & Paragraphs in HTML

Structure is everything in HTML. Headings and paragraphs are the skeleton of your content, giving your page meaning, flow, and accessibility for humans and search engines alike.

1. Headings: <h1> to <h6>

HTML gives you six heading levels. Use them to create a logical outline, just like chapters in a book:


<h1>Main Title</h1>
<h2>Section Title</h2>
<h3>Subsection Title</h3>

<h1> should appear once per page, it's your main headline.
Don't skip heading levels just to make text look smaller. Use CSS for styling instead.

2. Paragraphs: <p>

Paragraphs break up your content into readable chunks. They are block-level elements:


<p>This is a full paragraph of text.</p>

Each paragraph should express one idea, thought, or explanation. Avoid wall-of-text syndrome.

3. Why Structure Matters

Readability: Easier for users to scan and digest content.
SEO: Search engines use headings to understand your page's topic.
Accessibility: Screen readers use headings to navigate.

4. Real-World Structure Example


<h1>Welcome to My Blog</h1>
<p>Here I write about my web development journey.</p>

<h2>Why I Started This Blog</h2>
<p>I wanted a place to document my growth and help others learn too.</p>

5. Inline Text Formatting

Inline tags add emphasis to specific words without breaking flow:

<strong> makes text bold
<em> makes text italic
<br> creates a line break


<p>Coding is <strong>fun</strong> and <em>rewarding</em>.</p>

📌 Summary

You’ve learned how to structure pages using headings and paragraphs, and add meaning with inline formatting.

Next: You’ll explore HTML lists, the building blocks of readable structure.

Lessons