Practice: add readable content

Open the index.html file you created in the previous practice.

Keep the existing h1. Under it, add two sections of content using h2 headings.

The first section can introduce you:

<h2>About me</h2>
<p>
  I am learning <strong>HTML</strong> so I can build pages
  that work for everyone.
</p>

The second can list what you are learning:

<h2>What I am learning</h2>
<ul>
  <li>How browsers request a page</li>
  <li>How HTML describes content</li>
  <li>How to choose meaningful elements</li>
</ul>

Add one short quotation you like. Use blockquote for the quotation and cite for its source.

Then mention one HTML element inside a paragraph. Use code around the element name:

<p>The <code>h1</code> element contains the page heading.</p>

Use your own words. The example is a starting point, not a template you must copy.

Read the outline

Ignore the visual size of the text for a moment. Read only the headings:

1. page title
2. About me
3. What I am learning

Do they describe the page in the right order? If not, fix the headings before changing anything else.

Do not skip heading levels to make text bigger. After one h1, the next section heading should be h2, not h4. Size comes from CSS later.

If your list items are full sentences, that is fine. If they are labels, keep them parallel (“Document structure”, “Links”, “Images” reads better than mixing styles).

Strong emphasis (strong) marks importance. Italic emphasis (em) marks stress or a different voice. Use them when the meaning changes, not to bold words for decoration.

Save and reload. Select all text in the browser and copy it into a plain text editor. If the outline still makes sense without formatting, your structure is doing its job.

You are done when your page is understandable as plain text and uses elements for meaning, not appearance.