What is HTML?

HTML is a markup language that gives content structure — a precise vocabulary browsers use to build the page.

Open any web page, right-click anywhere, and choose "View Page Source." What you see is a plain text file full of angle-bracketed tags. That file is HTML, and understanding it is the first step to understanding everything the browser does.

The problem HTML solves

Imagine sending someone a text document with no formatting instructions:

Getting Started
This guide explains how to set up your account.
1. Open the app
2. Enter your email
3. Click Sign up

The reader can probably guess that "Getting Started" is a heading and the numbered lines are steps — but they are guessing based on visual conventions. A browser does not guess. It needs to know precisely what each piece of content is before it can display it, index it, or read it aloud.

Markup is the solution. Instead of guessing, you annotate the text with tags that declare meaning:

<h1>Getting Started</h1>
<p>This guide explains how to set up your account.</p>
<ol>
  <li>Open the app</li>
  <li>Enter your email</li>
  <li>Click Sign up</li>
</ol>

Now the browser knows that Getting Started is a level-one heading, the sentence is a paragraph, and the three items form an ordered list. That knowledge lets it render the page, build an accessibility tree for screen readers, and give search engines something meaningful to index.

Markup, not programming

HTML is a markup language, not a programming language. It does not have variables, loops, conditions, or functions. It describes what content is, not what to do. Think of HTML as vocabulary, not logic.

Three technologies divide responsibility on the web:

HTML — structure and meaning ("this is a heading, this is a list")
CSS — appearance ("headings are blue, lists have no bullet by default")
JavaScript — behaviour ("when the button is clicked, submit the form")

A common mistake is mixing these concerns in HTML — adding inline style attributes or relying on presentational elements like <b> for visual effect. The cleaner approach is to let HTML do only its job.

How the browser reads your file

When a browser fetches an HTML file, its HTML parser reads the file from top to bottom. As it encounters each tag, it constructs a node in the DOM — the Document Object Model, a tree-shaped in-memory representation of the page.

html
├── head
│   └── title: "My Page"
└── body
    ├── h1: "Getting Started"
    ├── p: "This guide explains…"
    └── ol
        ├── li: "Open the app"
        ├── li: "Enter your email"
        └── li: "Click Sign up"

After parsing, the browser uses the DOM tree to figure out how to paint pixels on screen, handle keyboard events, and expose the page structure to assistive technology. Your source file and what appears on screen are two different things — the source is text; the DOM is the live model.

The HTML parser is intentionally forgiving. It will try to recover from missing closing tags, unexpected nesting, and other mistakes rather than showing a blank page. This is convenient for beginners but can hide subtle bugs — valid HTML still matters.

A minimal valid HTML document

Every HTML file you write should start with this skeleton:

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

A few things to notice:

<!DOCTYPE html> is the DOCTYPE declaration. It tells the browser to use modern rendering mode. It is not a tag — it is a processing instruction, and it must be the very first line.
<html lang="en"> wraps the entire document. The lang attribute helps screen readers use the right voice and helps translation tools.
<head> holds metadata — information about the page that does not appear directly in the content: the character encoding, the viewport settings, the page title, links to stylesheets.
<body> holds everything the reader actually sees.

Where to go next

You know what HTML is and why it exists. Next: Elements and Structure — the anatomy of a tag, how elements nest into a tree, and the difference between block and inline elements.

Finished reading? Mark it complete to track your progress.

The problem HTML solves

Markup, not programming

How the browser reads your file

A minimal valid HTML document

Where to go next

On this page