What HTML does

What you will build

Create index.html and see your learning goal in a browser.

A browser receives text from files. HTML labels each piece as a heading, paragraph, link, or image. CSS controls appearance, while JavaScript adds behavior. Knowing the boundary tells you where to debug later.

Build it step by step

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Alex's learning page</title>
  </head>
  <body>
    <h1>Alex's frontend learning log</h1>
    <p>Goal: build a well-structured web page by myself.</p>
  </body>
</html>

Create a folder named my-learning-page, then create index.html inside it. Make sure the file is not really index.html.txt.
Type the complete example and save it.
Open the file in a browser. Its address should start with file:///.
Replace Alex with your name, save, and refresh the browser.

Read the important lines

<!doctype html> selects modern HTML parsing rules.
<head> contains page information; <body> contains visible content.
<h1> is the main heading and <p> is a paragraph.

Common mistakes and what to check

Symptom	What to check
The browser shows source as plain text	Check that the extension is `.html`, not `.txt`.
Edits do not appear	Save the file and refresh the correct tab.
Characters look broken	Save as UTF-8 and keep the charset declaration.

Practice without copying

Add a second-level heading called “This week's plan” and a paragraph below it. Infer the correct heading tag from the example.

Check the answer after you try

The page should have one main h1, followed by <h2>This week's plan</h2> and a <p>.

Completion check

My page contains the required new content
I can explain the key tags or attributes without the answer
I deliberately created and fixed at least one error