Lesson 5: HTML Headings and Paragraphs


Objective:

  • Learn about headings (<h1> to <h6>) in HTML.
  • Understand how to use paragraphs (<p>) to organize text.
  • Discover how to structure your webpage using these tags.

Introduction:

HTML headings and paragraphs are used to structure text on a webpage. Headings define titles, and paragraphs group sentences into meaningful sections.


1. What are HTML Headings?

Headings are like titles or subtitles. They make text easier to read and understand. HTML provides six levels of headings: <h1> is the largest and most important, and <h6> is the smallest and least important.

Example:
<h1>Main Title</h1>
<h2>Subtitle</h2>
<h3>Section Title</h3>
<h4>Subsection</h4>
<h5>Minor Details</h5>
<h6>Smallest Text</h6>

2. What are HTML Paragraphs?

Paragraphs are used to write blocks of text. The <p> tag creates paragraphs.

Example:
<p>This is a paragraph. It organizes text into readable sections.</p>

3. Using Headings and Paragraphs Together

Headings and paragraphs work together to make your webpage organized. Use headings for titles and paragraphs for the details.

Example:
<h1>Welcome to My Website</h1>
<p>This website teaches the basics of HTML in simple steps.</p>

<h2>Why Learn HTML?</h2>
<p>HTML is the foundation of web development. It helps you create and design webpages.</p>

4. Best Practices for Headings and Paragraphs

  1. Use only one <h1> per page for the main title.
  2. Use headings in order (<h1> first, then <h2>, etc.).
  3. Write short and clear paragraphs.
  4. Don’t skip heading levels (e.g., don’t jump from <h1> to <h3>).

5. Activity:

Create a webpage with:

  • A main title using <h1>.
  • A subtitle using <h2>.
  • Two paragraphs about any topic you like.
Example Activity Code:
<!DOCTYPE html>
<html>
<head>
    <title>HTML Headings and Paragraphs</title>
</head>
<body>
    <h1>Learn HTML Basics</h1>
    <p>HTML is used to create webpages. It is easy to learn and widely used.</p>

    <h2>Why Learn HTML?</h2>
    <p>HTML is the foundation of every website. By learning HTML, you can create well-structured webpages.</p>
</body>
</html>

Summary:

  • Use headings (<h1> to <h6>) to create a hierarchy for your webpage.
  • Use <p> tags to write text in paragraphs.
  • Always follow the order of headings and keep your text simple.

HTML Headings and Paragraphs Quiz

Test your knowledge about HTML headings and paragraphs by answering the following questions. Each question has one correct answer. Click “Finish Quiz” to view your results.

Quiz: HTML Headings and Paragraphs

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *