×

html · level 1 · unit 7 · lesson 4

  1. meet it
  2. guess first
  3. your turn
  4. fix it
  5. nailed it

Tap a green word if you get lost.

meet it

A great page starts with a .

Big pages are small pieces working together. Start with a sketch: a rough drawing of what goes where. Then build it from the top down, one landmark at a time.

The skeleton holds everything. The <header> says who you are. <main> holds the good stuff: headings, paragraphs, a picture, a list. The <footer> signs off.

Run your page after every few lines. If something looks odd, check the tags around it. The bug is usually a missing closing tag or a typo.

<!doctype html>
<html lang="en">
  <head><title>About Mo</title></head>
  <body>
    <header><h1>Hi, I'm Mo</h1></header>
    <main><p>I love <strong>baking</strong>.</p><img src="cake.svg" alt="My lemon cake"></main>
    <footer><p>Made by Mo</p></footer>
  </body>
</html>

Press show my page to see it here.

Short elements can sit on one line, like the header here. Longer ones read better spread out.