The easiest way to learn semantic and accessible HTML and CSS step by step.

Learn in an interactive environment.
Read short lessons, take notes, and complete challenges directly in your browser.


Anonymous cookies are used to improve the quality of the course.

It's time to learn HTML CSS with proper semantics & accessibility.

Learn HTML CSS from scratch, and practice in an intuitive environment. Throughout this course, you will learn about semantics and accessibility.

You will read short lessons, and solve challenges and projects, one step at a time. Try the first 50 lessons, challenges & flashcards for free. You can upgrade to a Pro account with a one-time payment that gives you access for 5 years.

Learn HTML CSS is suitable for beginners who are getting started and experienced developers who want to learn HTML CSS the proper way.

What you will learn

This course covers HTML and CSS from scratch. While you can get a result on the screen easily with HTML and CSS, it’s important to have proper semantics and accessibility.

We’ve got a unique approach as we like to explain the concepts step by step so that you can fully understand how it works.

The lessons & challenges will guide you through these topics step by step:

  • Accessibility
  • Semantics
  • Headings
  • Meta tags
  • Semantic elements
  • Non-semantic elements
  • HTML Validation
  • Left to right direction
  • Horizontal writing mode
  • Landmarks
  • Reader mode
  • DevTools (Inspect)
  • Images
  • Fonts
  • Units
  • Units
  • Responsiveness
  • Box models
  • Selectors
  • Collapsing margins
  • CSS (axis) Shorthands
  • Anchors
  • UI Kit
  • Color accessibility
  • Custom Properties
  • Flex
  • Grid
  • Positioning
  • Forms
  • Variable fonts
  • Much more..

Real-life projects

To apply your acquired knowledge, we have 2 projects for you. These 2 projects are revisited throughout the course, helping you apply your newly acquired knowledge.

Once you complete the course, you will be able to use these projects for your own (non-educational) work.

HTML CSS flashcards

This course is designed with the learner in mind. That’s why we’ve developed a separate flashcards app where you can reinforce the new concepts that you learned using spaced repetition.

Spaced repetition has been proven to be a more effective learning method.

What people are saying

Melissa Hart

Melissa Hart

@melissahart · 8 Feb

This is what I’ve been talking about for a couple weeks now. This kind of education is sorely needed in development.

James Robert

James Robert

@jamesrobert · 10 Jan

I’ve been coding <html> and <css> for 20+ years, and I still am learning little bits from @JoubranJad’s #codelearning course. A good reminder that we all forget basic things over the years, and should never stop learning.

About the instructor

Jad Joubran is a Google Developer Expert, Microsoft Most Valuable Professional (2019-2022), and Freelance Web Performance Consultant based in Amsterdam.

His passion for JavaScript led him to create and develop the most interactive, step by step courses for JavaScript, React, Programming basics, and HTML CSS.

Why Code Learning through this course?

  • Read concise lessons
  • Save notes in lessons
  • Export & print your notes
  • Read a recap of topics learned
  • Suggested popular highlights
  • Read a recap of every lesson
  • Practice directly in the browser
  • Solve interactive challenges
  • Test-driven environment
  • Solve real-world projects
  • Continue on your phone
  • Compare with official solution
  • Keep your memory fresh
  • Learn on the go
  • Benefit from spaced repetition
  • Review per chapter
  • Maintain your progress streak
  • 200+ flashcards

Modern Pricing

Generous free trial
  • Try the first 50 lessons, challenges, projects (first 15 chapters) & flashcards for free. No time limit.
    The remaining chapters require a PRO account.
One-time payment
  • We do not like subscriptions. This is why Learn HTML CSS PRO can be unlocked for a single payment that gives you access for 5 years.
    Check out the payment page. We recommend that you complete the free trial before upgrading

The easiest way to learn semantic and accessible HTML CSS step by step

Join more than 125,000 learners.

Other courses

Learn Programming

The easiest way to learn programming step by step.

Learn JavaScript

The easiest way to  learn  &  practice  modern JavaScript

React Tutorial

The easiest way to learn React.