Banner for switzCodes blog post titled 'Headings and Paragraphs – Writing Basic Page Content' 
                    featuring modern geometric design in dark blue, white, and green

📝 Headings and Paragraphs - Writing Basic Page Content

📅 August 10, 2025

✍️ By Evans

Hey friends! 👋

In my last post, I broke down the structure of an HTML document — from <!DOCTYPE html> to the <body> tag. Now, let's get into something simple but super important: headings and paragraphs.

These are the first things I learned when I started typing real content into my web pages. It's how we actually write stuff on a website — titles, subtitles, and body text.

🏷️ What Are Headings?

In HTML, headings are like titles and subtitles. They help organize content and tell users (and search engines) what's important.

There are six levels of headings:

<h1> This is a level 1 heading</h1>
<h2>This is a level 2 heading</h2>
<h3>This is a level 3 heading</h3>
<h4>This is a level 4 heading</h4>
<h5>This is a level 5 heading</h5>
<h6>This is a level 6 heading</h6>

It's best practice to use only one <h1> tag per page, because it represents the main idea or topic.

💡 Think of it like a book:

  • <h1> = the book title
  • <h2> = chapter title
  • <h3> = section inside that chapter

✍️ Creating Paragraphs with <p>

Now that we have headings, we need text to explain them — that's where the <p> tag comes in.

A paragraph is used for normal text content:


<p>This is my very first HTML paragraph. It's used to display text in a clean and readable way.</p>
                        

                        

Each <p> tag automatically adds some space before and after it, so your text doesn't look cramped together.

🧩 Combining Headings and Paragraphs

When I started practicing, this is what my page looked like:


<h1>About Me<h1>
<p>My name is Evans, and I'm currently learning web development. I started with HTML, and it already feels exciting to create something from scratch.<p>

<h2>My Goals</h2>
<p>I want to fully understand HTML before moving to CSS and JavaScript. My dream is to build and design real websites one day!</p>
                        

This simple structure makes your content clear, organized, and easy to follow.

🧠 Things I've Learned

  • Headings (<h1>-<h6>) help structure content, like chapters in a book
  • Paragraphs (<p>) are for regular text
  • You can use multiple paragraphs and subheadings to keep your content neat
  • Browsers automatically add space between headings and paragraphs (no need for <br> everywhere)

😅 Beginner Mistakes I Made

  • ❌ Using <h1> too many times (try to use only one per page)
  • ❌ Forgetting to close <p> tags
  • ❌ Using headings just to make text look big (use CSS instead!)

📌 Final Thoughts

This part of HTML is simple, but it's the foundation of every web page's content. Writing clean, structured content makes your website easier to read — and easier to style later with CSS.

So if you're just getting started like me, play around with headings and paragraphs. Try writing a fake article or story using just <h1>-<h3> and <p> tags. You'll learn a lot by doing!

👉 What's Next?

In my next post, I'll be exploring HTML Text Formatting — things like bold, italic, underline, and other ways to style text using HTML tags.

If you're also learning HTML, stay tuned! We're just getting started with the fun stuff. 😄

Catch you in the next one!

— Evans 💻