← Back to Home

Week 01 - HTML Examples

Reference files for live coding demonstration.

Open Interactive Presentation (Slides)

Examples (in teaching order)

  1. Basic HTML - Hello world, headings, paragraphs, lists
  2. Student Profile - Exercise 1 solution
  3. Registration Form - Exercise 2 solution
  4. Tables - Student records and schedule
  5. Semantic HTML - header, nav, main, article, footer
  6. Links and Images - All link types and image usage
  7. Common Mistakes - Intentional errors for debugging demo

Quick Reference

Concept Example File Key Tags Covered
Document structure 01-basic.html html, head, body, h1-h6, p, ul, ol, li
Personal page 02-profile.html img, a, strong, em, hr, small
Forms 03-registration-form.html form, input, label, select, option, button
Tables 04-table.html table, tr, th, td
Semantic structure 05-semantic.html header, nav, main, article, section, aside, footer
Links & Images 06-links-images.html a (href, target), img (src, alt), figure, figcaption
Debugging 07-common-mistakes.html All - with intentional errors

Tip: Open these in browser, then right-click → View Page Source to see the code.