The Building Blocks of a Page
Explore the three root elements and what belongs in each.
The Building Blocks of a Page is a free HTML Academy lesson on CoddyKit — lesson 3 of 3. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the HTML Academy learning path, one of 3 lessons in the course, and your progress syncs across the web and the CoddyKit app.
Pages are made of pieces
Every web page is built from small pieces called elements. Let's meet the friendly ones. 🧱
Headings
Headings are the big, bold titles. They tell readers what a section is about.
<h1>My First Page</h1>Paragraphs
Paragraphs hold your regular text. Most of the words on a page live inside them.
<p>Welcome to my page.</p>Images
Images bring a page to life. One small tag drops a picture right onto your page. 🖼️
Links
Links connect pages together. They are what makes the web a web you can click through.
Lists
Need bullet points? Lists let you stack items neatly, one under the other.
Boxes inside boxes
Elements can sit inside other elements, like boxes within boxes. This is called nesting.
Like building with bricks
Stack a heading, a paragraph, an image, and a link, and you have a real page! 🏗️
A simple recipe
Most pages follow the same simple pattern, so once you learn a few blocks, you can build anything.
You did it!
You finished the intro and know the core building blocks! From here, it only gets more fun. 🎉
Quick Check
You met several building blocks. Which one holds your regular body text?
Frequently asked questions
Is the “The Building Blocks of a Page” lesson free?
Yes — the full text of “The Building Blocks of a Page” is free to read here on the web, and the HTML Academy course includes 3 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the HTML Academy course, upgrade to CoddyKit PRO.
What will I learn in “The Building Blocks of a Page”?
Explore the three root elements and what belongs in each. You practise HTML Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.
Do I need any experience to start HTML Academy?
No prior experience is required. HTML Academy on CoddyKit is structured for beginners through advanced learners; this is — lesson 3 of 3, so you can start here or from the beginning and move at your own pace.
How long does the “The Building Blocks of a Page” lesson take?
Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.
Can I write and run code in this HTML Academy lesson?
Yes. Every HTML Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.
All lessons in this course
- What is HTML?
- How Browsers Read HTML
- The Building Blocks of a Page