COURSE: WEBSITE 101

Lesson 1 — Your First HTML File

Beginner / Free Track

// 01. No Copy-Paste Mindset

To learn how to code, your fingers must physically type every character. When you copy-paste, your brain skips the syntax. When you type it, you notice every angle bracket, every slash, every quote mark.

Rule #1: Every symbol matters. One missing < or / can break the entire page.

// 02. The Anatomy of an HTML File

HTML is a markup language — you label content so the browser knows what it is. Here is the complete structure of a valid HTML document:

<!DOCTYPE html>
<html>
  <head>
    <title>My First Page</title>
  </head>
  <body>
    <h1>Hello World</h1>
    <p>This is my website.</p>
    <a href="https://antcpu.com">Visit antcpu</a>
    <img src="image.jpg" alt="A descriptive label">
  </body>
</html>

// 03. Tag Breakdown

<!DOCTYPE html> — tells the browser to use modern HTML5 rules.

<html> — the root. Everything lives inside this.

<head> — document settings. Not visible to users.

<body> — everything visible lives here.

<h1> — the main heading. Use once per page.

<p> — a paragraph of text.

<a href="..."> — a link. The href is the destination URL.

<img src="..." alt="..."> — an image. Self-closing — no end tag needed.

[TRY IT NOW]

1. Open a plain text editor — Notepad, TextEdit, or VS Code.
2. Type the example above. Do not copy-paste.
3. Save as index.html.
4. Double-click it to open in your browser.

< Previous Lesson 2: Styling with CSS >