Project 1: My First Web Page

Time to build something real! This first project is tiny on purpose: you create a complete, valid HTML page from memory.

The goal

Make a single page that greets the reader and shows off your name.

What you practice

• <!DOCTYPE html> and the <html> root
• <head> vs <body>
• <h1> and <p>
• HTML comments

Starter skeleton

Every page starts like this, always:

html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>My First Page</title>
</head>
<body>
  <h1>Hello, world!</h1>
  <p>This is my very first web page.</p>
  <! - I will add more to this page later - >
</body>
</html>

Steps

1. Write the <!DOCTYPE html> first, nothing before it.

1. Wrap everything in <html>.

1. Put a <title> in <head> - it shows on the browser tab.

1. Put your greeting in <body>.

1. Open the file in a browser. Pat yourself on the back!

Checklist

• [ ] Doctype is the very first line
• [ ] Every tag has an opening and closing tag
• [ ] The page has a <title>
• [ ] There is one <h1> and at least one <p>

TL;DR

A valid page is a fixed skeleton: doctype, <html>, <head>, <body>. Everything you can see lives in <body>.