Three languages, one page
Open any web page and you're looking at the work of three languages quietly working together. They aren't rivals — each has one job, and they pass the work between them like three friends building a house. Once you see who does what, the whole web stops feeling like magic and starts feeling like something you could build yourself.
HTML is the structure — the bones of the page. It decides that this is a heading, that is a paragraph, and over there is a link. CSS is the looks — the skin and clothes. It decides the colors, the fonts, the spacing, where things sit. And JavaScript is the behavior — the muscles. It makes things move and respond: a button that does something when you click it, a menu that slides open.
HTML: tags give a page its bones
HTML stands for HyperText Markup Language, but forget the long name — the important word is markup. You write your content as plain text, then wrap little labels around each piece to say what it is. Those labels are called tags, and they live inside angle brackets like `<this>`.
Most tags come in pairs that hug your content: an opening tag and a closing tag with a little slash, like `<p>` and `</p>`. Everything between them gets treated as that thing. So `<p>Hello</p>` means 'this text is a paragraph,' and `<h1>Welcome</h1>` means 'this text is the biggest, top-level heading.' The browser reads these labels to understand the shape of your page.
<h1>My First Page</h1> <p>Hello, this is a paragraph.</p> <a href="https://example.com">Visit this link</a>
That last line shows one more idea: a tag can carry extra information called an attribute. The `href` on the `<a>` (anchor) tag tells the link which address to open. Don't memorize tags — there are dozens, and you'll pick them up naturally. Just hold onto the pattern: open, content, close.
CSS: rules add the skin
If you stop at HTML, your page works but looks plain — black text on a white background, like an unstyled document. CSS (Cascading Style Sheets) is where the page gets dressed. It doesn't change what things are; it changes how they look — their color, their font, their size, and where they sit on the screen.
A CSS rule has two halves. First a selector — you point at which things you mean, like 'all the paragraphs' or 'every top heading.' Then, inside curly braces, a list of declarations — each one names a property and the value you want, written as `property: value;`. Read it like an instruction: 'For these things, make the color this and the size that.'
h1 {
color: navy;
font-size: 32px;
}
p {
color: gray;
}The browser puts it all together
So who actually turns these text files into the colorful page in front of you? The browser does — the app you're reading this in, like Chrome, Safari, or Firefox. When you open a page, the browser receives the HTML and CSS as plain text and reads them together, like a builder reading both a blueprint and a paint chart at the same time.
First it reads the HTML to build the skeleton: here's a heading, here's a paragraph, here's a link. Then it applies the CSS rules to dress each part: this heading is navy and big, these paragraphs are gray. Finally it paints the finished result onto the screen — the page you see, scroll, and click. All of this happens in a fraction of a second, every single time.
Everything that runs right here, inside the browser, to build the part of an app you can see and touch is called the frontend. HTML, CSS, and JavaScript are the frontend's three core tools. You've now met two of the three — and they're the ones that turn a blank screen into something a person can read and recognize.
Recap
Every web page is a small team. HTML lays down the structure with tags that say what each piece is. CSS adds the looks with rules that say how things should appear. JavaScript — the next one to meet — adds the behavior. And the browser reads them all and paints the page you actually use.