🦴 Week 1 — HTML Is the Skeleton
HTML is nested boxes with names. <h1> is your page's one big title; <h2> starts each section; <p> holds paragraphs; <a href="..."> links out; <img src="..." alt="..."> shows a picture.
The alt text on images isn't optional — it's what screen readers speak and what appears if the image breaks. Describe the picture like you'd describe it over the phone.
🎨 Week 2 — CSS Is the Paint (Use Color Theory!)
A CSS rule is a selector plus declarations: h1 { color: teal; }. Style all sections at once with an element selector, or invent your own names with a class: .card { ... } matches class="card".
From the Color Theory Lab: pick one background, one text color, one accent. Check your contrast — light text on light backgrounds is the #1 beginner mistake. Your accent color should appear at least twice so the page feels designed, not random.
⚡ Week 3 — JavaScript Is the Nervous System
Three moves power almost everything: find an element (document.getElementById), listen for something (addEventListener('click', ...)), and change the page (.textContent, .style, .classList).
Your mission is one interactive element — a button that counts, a color-changer, a toggle. Small and working beats big and broken.
🧭 Required Sections
Per the class plan, your page needs at least three sections: About (who you are), Lab (your STEAM builds — rockets, prints, robots), and Games (link your Scratch or Pygame projects). You'll add photos and write-ups to Lab all year, so give it room to grow.
🆘 When It Breaks
Something not showing? Check the three classics: a tag you opened but never closed, a quote mark you opened but never closed, or a name that doesn't match (getElementById('Btn') won't find id="btn"). Read your code out loud — your ear catches what your eye skips.