Projects›Pro· 180 min read
Capstone: Multi-Page Website
The final boss of HTML: a complete multi-page website that ties every skill together into a portfolio piece.
What you will learn
- Build and link multiple pages into one website
- Apply semantic structure, forms, media and tables across pages
- Produce a portfolio-worthy project
The brief
Create a complete website with at least four linked pages. This is the project you will show employers, so pick a topic you care about (a personal portfolio, a club, a product, a cause).
Page requirements
- Home (
index.html) — hero, intro and links to the other pages. - About — your story or the project’s story, with images.
- Services / Portfolio / Products — use a
<table>or repeated<article>cards. - Contact — a full validated
<form>and a map<iframe>.
Across the whole site
- A consistent
<nav>on every page linking all pages together. - Semantic layout (
<header>,<main>,<footer>) everywhere. - Proper
<title>and metadescriptionon each page. - Meaningful
alttext on every image. - Built-in validation on the contact form.
- Correct relative file paths so the site works anywhere.
Tip: Keep a clean folder structure: an images/ folder for pictures, and your .html files in the root. Use relative links so the site works anywhere.
Note: When you finish, you will have a real, multi-page website built entirely by hand. In the next modules you will style it with CSS and bring it to life with JavaScript — but the structure you build here is the backbone of it all.
✍️ Practice
- Build all four pages and link them with a shared navigation menu.
- Test every link, every form field and every image across the whole site.
🏠 Homework
- Write a one-paragraph “project README” describing your website and the HTML features you used. Save it — it is the first piece of your portfolio.