The Three Languages
Every webpage you have ever seen was built with the same three languages. Just three. They each have one job, and they work together.
HTML — Structure
HTML is what creates the actual content on the page. Headings, paragraphs, buttons, images, links — HTML is what puts them there in the first place.
Think of it as the skeleton. Without it, there is nothing.
<h1>My name is Alex</h1>
<p>I am learning web development.</p>
<button>Say Hello</button>
That is a heading, a paragraph, and a button. Already a page.
CSS — Appearance
CSS is what makes the page look good. Colours, fonts, sizes, spacing, layout — all CSS.
Think of it as the paint and furniture. The rooms exist because of HTML. CSS is what makes them look like something.
The same HTML can look completely different depending on what CSS is applied to it. You will see this firsthand when you get to CSS.
JavaScript — Behaviour
JavaScript is what makes things happen when you interact. Click a button — something changes. Type in a search box — results appear instantly. JavaScript handles all of that.
Think of it as the electricity. Walls and paint exist without it, but nothing actually works.
JavaScript is also a proper programming language — much closer to Python than HTML or CSS are.
The house analogy
| Language | Job | Like building a house... |
|---|---|---|
| HTML | Structure — what exists | The walls and rooms |
| CSS | Appearance — how it looks | The paint and furniture |
| JavaScript | Behaviour — what happens | The electricity |
Where do you start?
HTML. Always.
You cannot style something that does not exist. You cannot make something interactive if there is nothing there first. HTML is always the foundation.
CSS comes after. JavaScript comes after CSS.
For now — just HTML. Everything else builds on top.
Challenge
Open any website right now and look at it carefully. Try to spot:
- Something that is clearly structure — a heading, a list, a form, a button
- Something that is clearly appearance — a colour choice, a font, rounded corners
- Something that is clearly behaviour — something that changed when you clicked or typed
You are training your eye to see the three layers that are always there.