If you’ve got 5 minutes and want to start learning how websites are made — this is for you. HTML is the skeleton of every web page, and knowing its basic tags is your first step into web development.
1. So, What Is HTML?
HTML stands for HyperText Markup Language. It’s used to structure content on the web — think of it like building blocks for web pages.
2. Key HTML Tags You Need to Know First
<!DOCTYPE html>— Declares the document type. It tells the browser to render the page using HTML5 standards. Always place it at the very top of your HTML file.
<html>— The root of your HTML document. Everything goes inside this.
<head>— Contains info about your page (not visible on the page itself).
<meta charset="UTF-8">— Makes sure your page supports all characters (like accents or emojis).
<title>— The title that appears in your browser tab.
<body>— The content that actually shows up on the page.
<h1>— A big heading. Use it once per page.
<p>— A paragraph of text.
- You’ll see all of these in action below.
3. A Simple HTML Page
Before we dive into the code, let’s highlight one important line at the very top:
<!DOCTYPE html> tells the browser to use HTML5, the current standard version of HTML. Without it, some browsers might behave in unexpected ways.
Now, here’s the full basic template:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>My First Page</title>
</head>
<body>
<h1>Hello, world!</h1>
<p>This is my very first HTML page.</p>
</body>
</html>
4. Try It Yourself
Want to see your first HTML page live in the browser? Here’s how to do it:
Copy the code above
Open Visual Studio Code (or any code editor you like).
Create a new file and save it as
index.html.Paste the code into the file.
If you're using VS Code, install the Live Server extension.
Right-click anywhere in the file and choose “Open with Live Server”.
Boom! Your page should open in your browser and say “Hello, world!”
5. Do you want more?
If this helped you or you're just starting out as a dev, I share quick and visual coding tips on Instagram:
@type_z_code
Follow me there and let me know if you’d like to see Part 2, where we’ll dive into more HTML tags, images, and links!
SOCIAL SHARE CARD GENERATOR