PaidCourse

Learn HTML

No setup. No fluff. Just real coding. In this beginner-friendly course, you’ll learn HTML and CSS by building a personal portfolio website from scratch — all in under one hour. Follow along in your browser using our online editor and save your work as you go. It’s the fastest way to start your journey into web development and walk away with something you can proudly show off.

4.8
Start

This course includes

  • In-browser code editor
  • Step-by-step video tutorials
  • Capstone portfolio project
  • Mentor AI assistance
  • Certificate of completion

Skill level

Beginner

Time to complete

1 hour

Projects

1

Prerequisites

None

About this course

This hands-on course is perfect for beginners who want to learn HTML and CSS by actually building something real. You’ll start from scratch and finish with your very own portfolio website, hosted right in your browser using the Hackr online editor. Along the way, you’ll pick up core web development skills, learn best practices, and gain the confidence to continue your coding journey.

Skills you'll gain

  • HTML Structure and Tags
  • CSS Styling and Layout
  • Responsive Web Design
  • Building a Real Portfolio Page

Syllabus

Set up your coding environment using our in-browser editor. No installation required! Learn how to save your work, ask Mentor for help, and get started with ease.

  • Intro to the course and layout
  • Using the Hackr HTML editor
  • How to save your work
  • Using Mentor AI for help
  • Quiz - Getting Started

Learn the essential structure of an HTML page and begin building your first page with headers, paragraphs, and basic formatting.

  • HTML boilerplate explained
  • Creating your first HTML page
  • Using headings, paragraphs, and dividers
  • Quiz - HTML Basics

Enhance your HTML pages with navigation links, organized lists, and beautiful images.

  • Unordered and ordered lists
  • Hyperlinks and email links
  • Adding remote images and image attributes
  • Quiz - Lists, Links & Images

Start styling your HTML pages with CSS. Learn the different ways to apply styles and how to write clean, reusable rules.

  • Inline, internal, and external CSS
  • CSS syntax and selectors
  • Adding fonts, colors, and backgrounds
  • Quiz - CSS Basics

Understand how elements behave on the page using the CSS box model. Group and organize your content like a pro.

  • Box model fundamentals
  • Block vs inline elements
  • Using <div> for layout
  • Spacing with margin and padding
  • Quiz - Layout & Box Model

Polish your page with better fonts, spacing, and visual appeal. Learn how to use Google Fonts and subtle styling tricks.

  • Styling fonts with CSS
  • Adding Google Fonts
  • Aligning and spacing text
  • Using .section styling for polish
  • Quiz - Typography & Styling

Review the checklist of everything you’ve learned so far. Make sure you’re ready for the capstone project.

  • Review HTML tags and structure
  • CSS styling techniques
  • Box model and typography refresher
  • Final setup for the project

Put it all together to build your first real website — a personal portfolio page you can customize and share.

  • Project setup and file structure
  • Header with name and image
  • About, Skills, Projects, Contact sections
  • Styling with CSS and Google Fonts

Projects in this course

Practice Project

Responsive Portfolio Website

Use everything you’ve learned to build a beautiful personal portfolio website — your first real project as a web developer!

Meet the creator of the course

Meet the full team →
Dr. Robert Johns
Dr. Robert Johns

Lead Instructor

Dr. Robert Johns is a web developer, educator, and course creator with a passion for helping beginners break into tech. He specializes in HTML, CSS, JavaScript, and Python — and has taught thousands of students how to build and ship real-world projects. With a strong focus on simplicity and hands-on learning, his mission is to make modern web development accessible to everyone, regardless of experience level.

Frequently Asked Questions

Nope! Everything runs in the browser using our online HTML editor. No setup required.

Just 1 hour. You’ll go from zero to having a finished project in less time than a lunch break.

Yes — a full personal portfolio page that you can customize and share.

Yes! Use our built-in AI assistant Mentor for coding help, explanations, and debugging support.

Absolutely. No experience required — we start from scratch and guide you every step of the way.

Yes! Complete the course and receive a certificate of completion you can add to your resume or LinkedIn.

Looking for more ways to learn HTML? Check out our user-submitted learning resources below

Learn HTML from the best HTML tutorials/courses online.

HTML Tutorials and Courses

19 Tutorials

Learn HTML 5 online from the best HTML tutorials recommended by the programming community.

HTML Articles

Build Responsive Real World Websites with HTML5 and CSS3

31.6k+ views udemy.com
204 Visit
Paid Video Beginner Promoted Popular

Learn How to Build Websites

3.6k+ views codecademy.com
+1 Visit
Paid Video Beginner New

30 Days To Learn HTML + CSS Course

20.5k+ views youtube.com
322 Visit
Free Video

Dive Into HTML5 by Mark Pilgrim

15.4k+ views amazon.com
81 Visit
Paid Book

HTML/CSS: Making webpages

9k+ views khanacademy.org
59 Visit
Free Video

Learn HTML & CSS in 14 days

7.3k+ views ilovecoding.org
57 Visit
Free Video Beginner CSS

HTML(5) Tutorial by W3Schools

7.5k+ views w3schools.com
34 Visit
Free
Paid Beginner CSS

HTML & CSS is Hard

4.6k+ views internetingishard.com
15 Visit
Free Book Beginner

A Smarter Way to Learn HTML & CSS

5.5k+ views amazon
10 Visit
Paid Book Beginner CSS

Free Course: Beginner Web Design using HTML5, CSS3 & Visual Studio Code

5.5k+ views youtube.com
8 Visit
Free Video Beginner

Projects in HTML5

5.7k+ views udemy.com
8 Visit
Paid Video Exercises/Practice-programs