Skip to main content
๐Ÿ“œ WAYPOINT LESSON

Checkpoint: HTML Understanding

โญ beginnerโณ 15 min read๐Ÿ“ Lesson 14 of 143

Prove your HTML understanding: fix broken markup, predict what a browser will do, and build a small accessible page โ€” all in one challenge.

A checkpoint is different from a lesson: nothing new is taught. This is where you prove the module's ideas are yours. Work through the challenge below without re-reading the lessons first โ€” struggling honestly is the point. The challenge mixes four kinds of thinking:

  1. Fix โ€” broken markup that looks fine in a browser but is subtly wrong.
  2. Predict โ€” read code and say what the browser will do before testing it.
  3. Build โ€” a tiny page from requirements only.
  4. Accessibility judgment โ€” choose the markup that serves every visitor.

Before you move on: the self-check

Passing the challenge proves you can do the work. Before starting CSS, also check that you can explain each of these โ€” out loud, in one or two sentences, as if to a friend who missed the class:

  • Why a page needs exactly one <h1>, and why heading levels step down without skipping.
  • When you would reach for <section> instead of <div> โ€” and when a <div> is fine.
  • What the alt attribute is for: not describing the file, but standing in for the image when someone cannot see it.
  • Why every <input> needs a <label>, and what the for/id pair actually wires up.
  • The difference between <a> and <button>: navigation between places vs. actions.
  • Why a <ul> for ingredients and an <ol> for steps โ€” and what goes wrong when the list type and the content disagree.

Anything you cannot explain yet? That is not a failure โ€” it is a precise reading assignment. Go back to the specific lesson, re-do its challenge from a blank editor, and try the explanation again.

If a test fails and you are stuck

First, read the failure message completely โ€” the challenge tests describe the expected behavior, and most failures name the exact line to look at. If the message is not enough, use the test hints (Hint 1 points at the concept, not the code). Only after those two steps should you re-read a lesson โ€” and re-read the specific one the failing test comes from, not the whole module. Guessing faster is not a strategy; targeted re-reading is.

When all tests pass, take a moment to notice what you could not do four lessons ago. That gap is the course working.

Next module: CSS Foundations โ€” same pages, now with color, typography, and layout.