Structure of HTML
Now that you know what HTML is, you might be wondering — “Okay, but how does an actual HTML page look?” Don’t worry, we’ve all been there! Before you write your first line of code, let’s take a quick look at how an HTML page is actually built. Once you understand the basic structure, everything becomes smoother from here.
Every HTML document (webpage) follows a basic structure. Think of it like a skeleton or a framework that holds everything together.
<!DOCTYPE html>
<html>
<head>
<title>My First Page</title>
</head>
<body>
<h1>Hello, world!</h1>
<p>This is my first webpage.</p>
</body>
</html>1. <!DOCTYPE html>
This tells the browser:
“Hey, this is an HTML5 document.”
It is written only once at the top of every HTML file. It is not a tag. It’s an instruction.
2. <html>…</html>
This is the root tag.
It wraps the entire webpage.
Everything you want to show on your page goes inside this <html> tag.
3. <head>...</head>
This part is for meta information about the webpage.
It includes things like:
- The title of the page (shown in the browser tab)
- Links to CSS files
- SEO info
- Fonts and icons
4. <title>My First Page</title>
This tag is placed inside the <head>.
It sets the name of your webpage — the name you see on the browser tab.
5. <body>…</body>
This is where the actual content of your webpage lives.
Whatever you want to show on the screen — like headings, paragraphs, images, buttons — goes inside the <body> tag.