1-Month Fast-Track
HTML, CSS, and responsive design in 4 weeks — build real websites from day one.
Week 1: HTML Foundations
Topics: HTML structure, elements, attributes, forms, semantic tags
Daily Session Plan
Day 1: What is HTML? Create first page with headings & paragraphs (90 min) Day 2: Links, images, and lists (75 min) Day 3: Tables and forms — input, select, textarea (90 min) Day 4: Semantic HTML — header, nav, main, section, footer (75 min) Day 5: Build a complete "About Me" page (90 min)
Key Concepts & Analogies
HTML is the skeleton of a website — it defines the structure. Think of tags like containers: <h1> is a big box for titles, <p> is a box for paragraphs. Attributes are like labels on the box — they give extra info (href, src, alt).
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My First Website</title>
</head>
<body>
<header>
<h1>Welcome to My Website</h1>
<nav>
<a href="#about">About</a>
<a href="#contact">Contact</a>
</nav>
</header>
<main>
<section id="about">
<h2>About Me</h2>
<p>I am learning web design!</p>
<img src="profile.jpg" alt="My profile photo">
</section>
<section id="contact">
<h2>Contact Me</h2>
<form>
<label for="name">Name:</label>
<input type="text" id="name" name="name" required>
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
<button type="submit">Send</button>
</form>
</section>
</main>
<footer>
<p>© 2024 My Website</p>
</footer>
</body>
</html>Practice Exercises
- Create an HTML page with a navigation bar linking to 3 sections
- Build a registration form with name, email, password, and a dropdown for country
- Create a table showing a weekly class schedule
Mini Project
Personal Bio Page — A complete page with header, photo, bio section, hobbies list, and contact form