HTML

Let's cut the crap. You want to build websites? Start here. Everything else - React, Vue, Svelte, whatever Silicon Valley is jerking off to this week - all of it compiles down to HTML eventually. Or it should, anyway.

What HTML Actually Is

HTML stands for HyperText Markup Language. It's the skeleton of every webpage. No HTML, no web. It's been around since 1991 and it'll be here long after your precious JavaScript framework of the month is abandoned on GitHub with 47 open issues.

HTML is not a programming language. It's a markup language. The difference: programming languages have logic, loops, conditionals. HTML just describes structure. That's it. Learn to be comfortable with that.

The Only Tags You Actually Need

Stop memorizing 150 tags. Here's what you'll use 90% of the time:

<!-- This is a comment. The browser ignores it. -->

<h1>This is a heading. Use one per page.</h1>
<h2>Subheading. H2 through H6 exist too.</h2>

<p>This is a paragraph. The workhorse of the web.</p>

<a href="https://example.com">This is a link. href is the URL.</a>

<img src="photo.jpg" alt="Description for accessibility">

<ul>
    <li>Unordered list item</li>
    <li>Another one</li>
</ul>

<ol>
    <li>Ordered list item (numbered)</li>
</ol>

<div>Generic container. Does nothing by itself.</div>
<span>Inline container. Also does nothing.</span>

Structure Your Shit Properly

Every HTML document needs this minimum viable structure:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Your Title Here</title>
    </head>
    <body>
        <!-- Your content goes here -->
    </body>
</html>

<!DOCTYPE html> tells the browser "hey, this is modern HTML5, not some broken-ass HTML from 1999."

<head> contains metadata - stuff the user doesn't see but the browser needs. Title, charset, viewport settings, stylesheets.

<body> is everything visible. That's where your content lives.

Semantic HTML - Use The Right Tag

This is where most developers fail. They wrap everything in <div> and call it a day. Use the right tag for the job:

<header> - Page or section header
<nav> - Navigation links
<main> - Main content area
<article> - Self-contained content
<section> - Thematic grouping
<aside> - Sidebar content
<footer> - Page or section footer

Why does this matter? Accessibility. Screen readers need this shit. SEO needs this shit. Your lazy <div>-soup tells search engines nothing.

Forms - The One Complex Thing

Forms are where HTML gets actually complicated. Everything else is trivial.

<form action="/submit" method="POST">
    <label for="email">Email:</label>
    <input type="email" id="email" name="email" required>
    
    <label for="password">Password:</label>
    <input type="password" id="password" name="password" required>
    
    <button type="submit">Submit</button>
</form>

That's the bare minimum. Forms need an action (where to send data) and a method (GET for fetching, POST for sending data).

Stop Here. Go Build Something.

You don't need a tutorial. Open a text editor, type some HTML, save it as index.html, drag it into your browser. That's it. That's learning.

CSS comes next if you want it to not look like 1995. But that's a whole other conversation.

Learn more:

Our HTML Guide - Interactive lessons
HTML Hangman - Test your knowledge
MDN HTML Reference - The actual documentation