Sharmistha Pathasala HUB
Your Pocket Learning Platform
Menu
New to web development? Learn the top 10 essential HTML tags every beginner should know, explained with simple language and examples to kickstart your coding journey.
If you’re just getting started with web development, HTML (HyperText Markup Language) is your very first step. It’s the foundation of all websites and tells the browser how to display content.
To make your learning easier, here are the Top 10 HTML tags every beginner should know – explained in a simple, friendly way. Let’s dive in!
It is used to declare which type of document is this. This tag is always at the top of every HTML document. It tells the browser, “Hey, this is an HTML5 page!”
Syntax :
<!DOCTYPE html>
It is used to work like a root tag in HTML , in which all the web page goes inside it , it wraps your entire code.
Syntax :
<html>
<!– Content Goes Here –>
</html>
This tag holds meta info, like the page title, links to CSS files, or character encoding.
Syntax :
<head>
<title>My first prgram</title>
</head>
It is used to show the title of the webpage.
Syntax :
<title>My first prgram</title>
Everything you want the user to see (text, images, buttons) goes inside the <body>
.
Syntax :
<html>
<head>
<title>My First Program</title>
</head>
<body>
<h1>Hello World</h1>
</body>
</html>
Use headings to organize content. <h1>
is the biggest, <h6>
is the smallest.
Syntax :
<html>
<head>
<title>My First Program</title>
</head>
<body>
<h1>Hello World</h1>
<h2>Hello World</h2>
<h3>Hello World</h3>
<h4>Hello World</h4>
<h5>Hello World</h5>
<h6>Hello World</h6>
</body>
</html>
This tag is used to write the normal text content on webpage.
Syntax :
<p>
<!– Content Goes Here –>
</p>
This tag is used to create or add clickable links.
Syntax :
<a href=”https://www.google.com”> Click Here goto Google page</a>
Want to add any pictures on the webpage ? This is the tag my friend. In this tag “src” means Source from where you add picture , “alt” means alternative text, which helps when internet slow then picture is not showing it shows only alternative text , then height and width set the dimension of the picture.
Syntax :
<img src=”koala.jpg” alt=”Koala Image” height=”200px” width=”200px”/>
Used to group content. It’s super useful when you start using CSS.
Syntax :
<div>
<p>Welcome Sharmistha Pathsala HUB</p>
</div>
These 10 HTML tags are like building blocks for any website. As a beginner, learning these will give you a strong foundation and confidence to explore more advanced HTML and CSS.
👉 Pro Tip: Try building a simple webpage using just these tags to practice!
Follow for more HTML tips and tricks!
Download our FREE HTML Cheat Sheet PDF (Coming Soon!)
Subscribe to our newsletter for weekly web dev tips.