Web Development · Beginner · 63 hours
HTML + CSS
Build real web pages from the first lesson: every concept shows where it is used on a real site, with live code previews and a built-in Code Lab.
Slide decks in this course
- Part 1: HTML Foundations 106 slides
- Part 2: CSS Foundations 100 slides
- Part 3: Layout & Responsive Design 82 slides
- Part 4: Components & Capstone Projects 50 slides
Syllabus
| Module | Covers |
|---|---|
| Part 1 · HTML Foundations | How the web works, text and headings, links, images and media, lists, tables, forms and semantic HTML |
| Part 2 · CSS Foundations | Selectors, colours, units and typography, the box model, backgrounds and effects, the cascade, display, position and z-index |
| Part 3 · Layout & Responsive Design | Flexbox, CSS Grid, media queries, CSS variables and dark mode, transitions, transforms and animations |
| Part 4 · Components & Capstone Projects | Pure-CSS UI components, professional workflow and deployment, and five capstone websites |
What your students will be able to do
- Explain how a browser loads a web page and write a valid HTML document
- Mark up text, links, images, lists, tables and forms with the right elements
- Structure a page with semantic HTML
- Style pages with selectors, colours, typography, the box model and the cascade
- Lay out responsive pages with Flexbox, CSS Grid and media queries
- Add CSS variables, dark mode, transitions and animations, and publish a finished site
Questions teachers ask
Do students need to install anything?
No. The decks run in any browser, offline too, and include a built-in Code Lab with live previews.
Is any coding experience needed?
No. Part 1 starts from how the web works and a first web page.
How is the course split?
Four decks: HTML Foundations, CSS Foundations, Layout & Responsive Design, and Components & Capstone Projects, with five practice examples per module.