Day 1: Introduction to HTML & CSS
Module 1: Getting Started with HTML & CSS
- Overview of web development and why HTML & CSS are important
- Explaining the structure of a web page: HTML for content, CSS for style
- Real-life analogy: HTML as the skeleton and CSS as the clothes and makeup
- Tools needed for development: Text editors (VS Code), browser developer tools
Module 2: Setting Up the Environment
- Installing and using Visual Studio Code
- Introduction to Chrome Developer Tool
- Writing your first HTML & CSS file
- Real-life analogy: Setting up a kitchen to cook your first recipe
Module 3: Basic HTML Structure
- Anatomy of an HTML document:
<!DOCTYPE html>
, <html>
, <head>
, <body>
- Understanding tags, elements, and attributes
- Practical: Creating a simple webpage with a title, heading, paragraph, and a link
- Real-life example: A business card with a name, role, and contact info
Day 2: Styling and Layout with CSS
Module 4: Introduction to CSS
- Types of CSS: Inline, internal, and external