HTML Beginner ~20 h 1 students enrolled

HTML & CSS from Scratch

Complete web layout course: from your first tag to Flexbox, Grid and animations. Write code and see results instantly with live preview.

Start Learning Already have an account? Sign In
45 lessons
30 exercises
2230 XP for course
~20 h

What You'll Learn

How the Web Works
Your First HTML Page
Text and Typography
Links and Navigation
Images and Media
Lists and Tables
Forms
Semantic HTML5
CSS Basics
Box Model
Colors, Backgrounds & Shadows
Positioning
Flexbox
CSS Grid
Responsive Design
Animations & Transitions
Modern CSS
Final Project

This Course Includes

Interactive exercises with instant feedback
Real compiler in your browser
Certificate upon completion
Gamification: XP, levels, badges

Curriculum

18 lessons · 45 lessons · 30 exercises

1

How the Web Works

Learn how browsers load pages and what tools a developer needs

  • How the Internet Works +10 XP
  • Developer Tools +10 XP
2

Your First HTML Page

Create your first page and understand the HTML document structure

  • HTML Document Structure +10 XP
  • Tags and Attributes +10 XP
  • Practice: First Page +15 XP
3

Text and Typography

Learn to work with headings, paragraphs and text formatting

  • Headings h1–h6 +10 XP
  • Paragraphs and Formatting +10 XP
  • Practice: Text +15 XP
4

Links and Navigation

Learn to create links, anchors and navigation menus

  • The <a> Tag — Links +10 XP
  • Practice: Links +15 XP
5

Images and Media

Learn to insert images, use alt and figure

  • Images in HTML +10 XP
  • Practice: Images +15 XP
6

Lists and Tables

Learn to create lists and tables

  • Lists in HTML +10 XP
  • Tables in HTML +10 XP
  • Practice: Lists & Tables +15 XP
7

Forms

Learn to create forms with various input types

  • Forms: Basics +10 XP
  • Input Types +10 XP
  • Practice: Forms +15 XP
8

Semantic HTML5

Learn why semantic tags matter and how to improve accessibility

  • Semantic Markup +10 XP
  • Practice: Semantics +15 XP
9

CSS Basics

Learn how to connect styles and control page appearance

  • What is CSS +10 XP
  • Basic Selectors +10 XP
  • Practice: First Styles +15 XP
10

Box Model

Understand margin, padding, border and display

  • Box Model +10 XP
  • Display Property +10 XP
  • Practice: Box Model +15 XP
11

Colors, Backgrounds & Shadows

Learn to work with colors, gradients and shadows

  • Colors and Backgrounds +10 XP
  • Practice: Colors & Shadows +15 XP
12

Positioning

Understand position, z-index and overflow

  • The Position Property +10 XP
  • Practice: Positioning +15 XP
13

Flexbox

Master the most powerful tool for alignment and layout

  • Flex Container +10 XP
  • Flex Items +10 XP
  • Practice: Flexbox +15 XP
14

CSS Grid

Learn the 2D grid for complex layouts

  • Grid Basics +10 XP
  • Practice: CSS Grid +15 XP
15

Responsive Design

Learn to make websites work on any device

  • CSS Units +10 XP
  • Media Queries +10 XP
  • Practice: Responsive +15 XP
16

Animations & Transitions

Learn to create smooth transitions and CSS animations

  • Transitions +10 XP
  • Keyframe Animations +10 XP
  • Practice: Animations +15 XP
17

Modern CSS

CSS variables, calc(), container queries and other modern features

  • CSS Variables +10 XP
  • Practice: Modern CSS +15 XP
18

Final Project

Put it all together — build a landing page from header to footer

  • Developer Checklist +10 XP
  • Practice: Landing Page +20 XP

Requirements

No prior knowledge required — we start from scratch

Course FAQ

Do I need programming experience?
Not at all! This course is built for complete beginners. We start from the basics and gradually increase complexity.
How do lessons work?
Each lesson includes theory with examples and interactive exercises. You write code right in your browser, and our compiler checks the result.
How long does the course take?
On average, you can complete the course in a few days at 1-2 hours per day. But there's no rush — learn at your own pace.
Will I get a certificate?
Yes! After completing all lessons and exercises, you'll receive an electronic certificate with a unique ID.

Ready to start?

Sign up for free and start coding right now. Your first result in 5 minutes.

Start Learning