Chapter 1 · Lesson 2 of 4
02. The shape of every page
Real pages have a skeleton: <!DOCTYPE html>, <html>, a <head> with the page's title, and a <body> with everything you see.
Browsers are kind: they show <h1>Hi</h1> even on its own. But real pages always have the same skeleton around their content, so every browser reads them the same way.
<!DOCTYPE html><html lang="en"> <head> <title>My Hobbies</title> </head> <body> <h1>My Hobbies</h1> <p>I like cricket and drawing.</p> </body></html><!DOCTYPE html> says *this is a modern HTML page*. Everything else goes inside <html>, which has two parts:
`<head>` holds facts about the page that don't show on it, like its <title>: the name on the browser tab and in search results. `<body>` holds everything you see.
Your turn
1Steps
- 1Give this page its skeleton:
<!DOCTYPE html>, then<html>with a<head>and a<body>. - 2The page's title (in the head) should be
My First Page. Move the heading and paragraph into the body.
Write it in index.html; the page shows as you type.
Starting code
The editor starts empty. Copy this into it to begin, or write your own from scratch.
<h1>Welcome</h1><p>This page needs a proper skeleton.</p>2Expected output
Your page should have
- The page starts with
<!DOCTYPE html> - There's a
<head>, opened and closed - The title in the head is
My First Page - The
<h1>is inside the<body> - The heading still says
Welcome
Submit answer checks each of these.
3Hints
Stuck? Open one hint at a time: each gives a bit more help.
Hint 1
Start from the example above: the same skeleton, with this page's title and content.
Hint 2
<!DOCTYPE html> comes first, then <html>. Inside it, <head> (with <title>My First Page</title>) comes before <body>.
Hint 3
The heading and paragraph go between <body> and </body>; then close </html> at the very end.