Capstone build workbook

This is work-integrated learning: you build, deploy, test, and submit proof. Use the evidence pack PDF or online template — fill Parts A–D as you go. Full guide: Capstone assessment. Not sure how specific to be? Read the filled exemplar.

You aligned your brief in Module 06, Lesson 04. Work this checklist in order. Copy proof into the evidence pack as you go.

Your capstone can be a new topic or an upgraded my-static-site.

Stage 0 — Brief locked

• Module 06 brief saved (1–3 pages, must-haves, non-goals)
• Scope fits capstone — cut extra pages before you code

Stage 1 — Folder on disk

my-capstone/
  index.html
  about.html          # optional — max 3 pages total
  styles.css
  images/

• Folder created; relative links (href="about.html")
• Lowercase file names (photo.jpg not Photo.jpg)
• Opens locally in browser — nav works

Stage 2 — Structure (before CSS polish)

• header, nav, main, footer where they fit
• One <h1> per page; no skipped heading levels
• Real copy — no permanent lorem
• Module 03 checklist run on paper or in IDE

Stage 3 — CSS for reading

• Small palette (background, text, one accent)
• Contrast checked on body text and links
• Responsive check — narrow browser, nothing overlaps
• Focus outlines visible on links/buttons (or custom focus style)

Stage 4 — Deploy (do this early)

• Host chosen (Netlify, Vercel, own server, etc.)
• First deploy done — even if ugly
• Live URL recorded for evidence pack Part A
• Every nav link clicked on live site (fresh browser session)

Stage 5 — Lighthouse on live URL

• Chrome DevTools → Lighthouse → Accessibility on deployed URL
• Score ≥ 90% — if not, fix one issue class, redeploy, re-run
• Screenshot or score + date saved for Part A
• Tab through live site without mouse — no traps

Stage 6 — Evidence pack draft

Open the Capstone assessment or your evidence pack PDF and draft:

• Part A — URL, score, date, browser
• Part B — one proof line per marking row (specific paths/elements) — compare exemplar
• Part C — brief attached
• Part D — hosting (one line why), AI yes/no + what you verified

Work log (optional but useful)

Date	What I shipped	Proof
	First deploy	URL:
	Lighthouse run 1	Score:
	Fix + redeploy	What changed:

Common NS causes (fix these, do not write about them)

Problem	First fix
Lighthouse 78% on live URL	Read failing items — usually contrast, alt, or headings
Nav works locally, broken live	Check file name case and relative paths on host
“Looks fine” but no h1	Promote page title to <h1>; redeploy
Only tested file://	Run Lighthouse on deployed URL

What's next

Submit via your provider: Capstone evidence pack