HTML

What is HTML?

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!

What Does HTML Mean?

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!

The Basic Structure of an HTML Page

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

Tags — The Building Blocks

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.

Some Common HTML Tags

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>

Explained in the Easiest Way with Real-Life Examples

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!

Fun way to remember:

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.