AdvancedWeb DevelopmentLive Data
Web-1 Front-end Design & User Experience
Learn HTML and CSS fundamentals through hands-on projects. Build 4 real websites including your professional portfolio....
AdvancedWeb DevelopmentLive Data
Web-1 Front-end Design & User Experience
Learn HTML and CSS fundamentals through hands-on projects. Build 4 real websites including your professional portfolio....
Lessons
14
Activities
14
Projects
4
Duration
24 sessions • 6 months
About This Course
Learn HTML and CSS fundamentals through hands-on projects. Build 4 real websites including your professional portfolio.
Prerequisites
- Computer with internet connection
- Text editor (VS Code recommended)
- Basic computer skills
Skills You'll Learn
HTMLCSS
This course consists of 24 structured sessions over 6 months. Each session includes lessons, activities, projects, and assessments to ensure comprehensive learning.
1
Introduction to Web Design
Learn web design fundamentals and development tools
Lesson MaterialsActivitySubmission
2
Introduction to HTML
Learn HTML structure, tags, and semantic markup
Lesson MaterialsActivitySubmission
3
Project One: HTML Mini Project
Build first webpage with HTML
Exit Ticket
4
Introduction to CSS
Learn CSS styling, colors, and fonts
Lesson MaterialsActivitySubmission
5
CSS Selector
Master CSS selectors and specificity
Lesson MaterialsActivitySubmission
6
Project 2: My Superhero
Create superhero-themed webpage with CSS styling
Exit Ticket
7
HTML Division + CSS Box Model
Learn div elements and CSS box model
Lesson MaterialsActivitySubmission
8
CSS Display + CSS Flexbox
Master display properties and Flexbox layouts
Lesson MaterialsActivitySubmission
9
Project 3: My Holiday (Part 1)
Plan and design holiday website structure
Exit Ticket
10
Project 3: My Holiday (Part 2)
Build HTML structure and navigation
Exit Ticket
11
Project 3: My Holiday (Part 3)
Apply CSS styling and responsive design
Exit Ticket
12
Project 3: My Holiday (Part 4)
Implement advanced layouts with Flexbox
Exit Ticket
13
Project 3: My Holiday (Part 5)
Complete and polish final project
Exit Ticket
14
Revision + Quiz 1
Review HTML and CSS fundamentals
Lesson MaterialsActivity
15
Introduction to Bootstrap
Learn Bootstrap framework and components
Lesson MaterialsActivitySubmission
16
Bootstrap Grid System
Master responsive grid system
Lesson MaterialsActivitySubmission
17
Bootstrap Navigation Bar + Bootstrap Carousel
Create navigation bars and carousels
Lesson MaterialsActivitySubmission
18
Bootstrap Cards + Progress Bar
Build cards and progress indicators
Lesson MaterialsActivitySubmission
19
Revision + Quiz 2
Review Bootstrap concepts
Lesson MaterialsActivity
20
Final Project: My Profile (Part 1)
Plan personal profile website
Exit Ticket
21
Final Project: My Profile (Part 2)
Build responsive layout with Bootstrap
Exit Ticket
22
Final Project: My Profile (Part 3)
Complete website with custom CSS
Exit Ticket
23
Final Project: My Profile (Part 4 - Presentation)
Present completed project
Exit Ticket
24
Graduation
Project evaluation and course completion
Lesson MaterialsActivitySubmission
Course Information
Course CodeW1
Age Group10+ years old
Class SizeMax 8 students
Teacher Ratio1:8
Learning ModeHYBRID
Last Updated9/14/2025
Data SourceGitHub
Key Benefits
HTML
Master HTML through practical application
CSS
Master CSS through practical application
Learning Outcomes
Practical Skills
Build real-world applications and projects
Problem Solving
Develop computational thinking and problem-solving abilities
Ready to Start?
Join this course and start your learning journey today.
Enroll Now
Limited seats available