• Understand How Web Pages Work

  • Learn how HTML shapes the content of a webpage.

  • See how the structure of a page is built.

• Learn How to Style With CSS

  • Add colors, fonts, spacing, and design to your pages.

  • Make your work look clean and attractive.

• Create Responsive Layouts

  • Use tools like Flexbox, Grid, and media queries.

  • Make websites that look good on phones, tablets, and computers.

• Write Clean Code

  • Create simple, readable, and well-organized HTML and CSS.

  • Learn the basics of accessibility and semantic tags.

• Work with Real-World Web Projects

  • Build and style complete webpages and websites using modern tools and techniques.

• Work on Real Web Projects

  • Build complete webpages from start to finish.

  • Practice real-world skills used by web designers.

• Learn Good Web Design Habits

  • Understand color, spacing, layout, and typography.

  • Improve user experience (UX) through simple design rules.

• Prepare for More Advanced Learning

  • Get ready to learn JavaScript and other web tools.

  • Build the foundation for front-end or full-stack development.

Module 1: Introduction to Web Development

You will learn:

• What HTML and CSS are

• How the web works (browsers, servers, and files)

• How to set up your computer for coding

• How to use VS Code and Live Server

Module 2: HTML Fundamentals

You will learn:

• Basic HTML structure

• Headings, paragraphs, and text elements

• Ordered and unordered lists

• Links and anchor tags

• Images and file paths

• Tables and semantic tags

• Forms: inputs, labels, and buttons

Module 3: CSS Basics

You will learn:

• Three ways to use CSS (inline, internal, external)

• CSS rules and selectors

• Colors, units, and fonts

• The Box Model (margin, border, padding)

• Backgrounds and borders

• How to use browser tools to debug CSS

Module 4: CSS Layout Techniques

You will learn:

• The display property and positioning

• Flexbox for easy layout control

• CSS Grid for advanced 2-D layouts

• Floats and clearing

• How to use media queries to make pages responsive

Module 5: Building Real Projects

You will build:

• A simple personal profile page

• A responsive business landing page

• A multi-page website with navigation

Module 6: Advanced HTML & CSS

You will learn:

• How to style and validate forms

• CSS variables for reusable styles

• Animations and transitions

• How to make sites more accessible

• Mobile-first design ideas

Module 7: Best Practices and Final Challenge

You will learn:

• Clean and simple coding habits

• How to organize files and name them properly

• Basic SEO-friendly HTML

• Final Challenge: Build and publish your own portfolio website