Have you ever wondered how websites are made? The answer starts with something called HTML — and don’t worry, it’s much simpler than it sounds!
HTML stands for HyperText Markup Language.
It’s the skeleton or structure of every webpage you see on the internet.
Think of a website like a house:
The walls, doors, and windows = HTML (the structure)
The paint and decoration = CSS (the design)
The lights and movement = JavaScript (the actions)
Without HTML, a website wouldn’t even stand up — it’s the bones that hold everything together!
Here’s what a very simple HTML page looks like:
<!DOCTYPE html>
<html>
<head>
<title>My First Website</title>
</head>
<body>
<h1>Hello, world!</h1>
<p>This is my first web page!</p>
</body>
</html>
Let’s break that down like a story:
| Tag | What It Means | Example from Real Life |
|---|---|---|
<!DOCTYPE html> |
Tells the browser it’s an HTML5 page | A signboard saying “This is a house!” |
<html> |
Wraps everything | The outer walls of your house |
<head> |
Hidden info (like title, links, etc.) | The blueprint room |
<title> |
Shows the name on the browser tab | The nameplate on your door |
<body> |
Visible content | The main living space |
HTML uses tags — they look like this:
<p>This is a paragraph.</p>
<p> is the opening tag
</p> is the closing tag
Everything in between is the content that shows up on the page
Tags usually come in pairs like this, wrapping content inside like a sandwich.
| Tag | What it does | Example |
|---|---|---|
| <h1> | Big heading | <h1>Hello!</h1> |
| <p> | Paragraph | <p>This is text.</p> |
| <a> | Link | <a href="https://google.com">Go to Google</a> |
| <img> | Image | <img src="cat.jpg" alt="A cute cat"> |
| <ul> + <li> | Bulleted list | <ul><li>Apple</li><li>Banana</li></ul>
|
| <div> | Box/container | <div>Stuff inside a box</div> |
Imagine you’re building your dream Lego house. Each piece you add — a door, a window, or a roof — has a purpose. HTML works the same way! It builds the structure of a web page piece by piece.
<html> is the whole house — it holds everything together.
<head> is like the control room — it stores important information (like
the name of your house).
<body> is where you live — it’s everything visitors can see!
If you hang a big sign saying “Welcome Home!”, that’s your <h1> tag — a big heading!
When you write a small note like “This house was built with love,” that’s a <p> tag — a paragraph.
Want to share where your friend lives? Use an <a> tag to create a link — like “Click here to visit Sam’s house.”
And when you hang a cute picture of your cat, that’s the <img> tag
So, HTML is just like building with Legos — you connect different pieces (tags) to create something amazing on the internet!
Think of HTML like a sandwich.
The bread is <html> and </html>
Inside you have different layers — <html> and
<body>
Each ingredient (tag) gives flavor (meaning) to the page.