Updated Jul 6, 2026

HTML From Zero

You know HTML, CSS, and JavaScript have separate jobs - HTML for structure, CSS for looks, JavaScript for behavior. Now it's time to actually write some. This guide teaches HTML by building one real page: a personal "About Me" page, starting from nothing and ending with a complete, semantic document.

Every phase adds to the same file. By the end you'll have a page with a heading, a bio, a photo, a list of skills, links to your other profiles, and proper document structure - and you'll understand why each tag is the right one for the job.

How to read this

  • New to HTML? Read in order. Phase 1 gives you the skeleton every page needs, phase 2 fills it with content, phase 3 makes it semantic and complete.
  • Know some HTML already? Skip to Phase 3: Semantic HTML and Document Structure for <header>/<main>/<footer> and why they beat <div> soup.

The phases

  1. Your First Page: Elements, Tags, and Structure - what a tag, element, and attribute actually are, the doctype and the <html>/<head>/<body> skeleton, nesting rules, and void elements like <br> and <img>.
  2. Text, Lists, Links, and Images - headings, paragraphs, semantic emphasis with <strong>/<em>, lists, links, and images with real alt text.
  3. Semantic HTML and Document Structure - <header>, <nav>, <main>, <section>, <footer> instead of generic <div>s, why it matters for screen readers and search engines, and the finished, annotated About Me page.

This guide stops at structure. It doesn't touch colors, fonts, or layout - that's CSS Without Tears, linked again at the end once you have something worth styling.