By Ansh Yadav 
What is HTML? A Complete Guide with Examples
HTML, or HyperText Markup Language, is the standard language used to create and design documents on the World Wide Web. It forms the backbone of every website and is responsible for structuring content like text, images, videos, and links. Whether you’re a beginner learning how websites work or someone looking to build your first webpage, understanding HTML is an essential first step.
HTML is a markup language, not a programming language. It doesn’t perform logic like a programming language, but instead, it uses “tags” to organize and format content so that web browsers can display it properly. Each HTML tag gives meaning or structure to the content enclosed within it.
The latest version is HTML5, which introduced many new features such as support for video, audio, semantic elements, and improved form controls.
Every HTML page starts with a basic structure. Here’s a simple example:
<!DOCTYPE html>
<html>
<head>
<title>My First Web Page</title>
</head>
<body>
<h1>Welcome to My Website</h1>
<p>This is my first HTML page.</p>
</body>
</html>
Let’s break this down:
<!DOCTYPE html>: Declares the document as an HTML5 document.<html>: The root element of the page.<head>: Contains metadata like the title and links to styles or scripts.<title>: Sets the title that appears in the browser tab.<body>: Holds the content that appears on the webpage.
HTML uses a wide variety of tags. Below are some commonly used ones:
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<p>This is a paragraph.</p>
<strong>Bold Text</strong>
<em>Italic Text</em>
<h1>to<h6>: Define headings.<h1>is the largest, and<h6>is the smallest.<p>: Paragraph.<strong>and<em>: Bold and italic text.
<a href="https://www.example.com">Visit Example</a>
<img src="image.jpg" alt="Sample Image">
<a>: Creates a hyperlink. Thehrefattribute defines the URL.<img>: Embeds an image.srcis the image path, andaltdescribes the image.
<ul>
<li>Item One</li>
<li>Item Two</li>
</ul>
<ol>
<li>First</li>
<li>Second</li>
</ol>
<ul>: Unordered list (bullets).<ol>: Ordered list (numbers).<li>: List item.
<table border="1">
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>Alice</td>
<td>25</td>
</tr>
</table>
<table>: Creates a table.<tr>: Table row.<th>: Header cell.<td>: Table data cell.
HTML allows users to input information using forms:
<form action="/submit" method="post">
<label for="name">Name:</label>
<input type="text" id="name" name="name"><br><br>
<label for="email">Email:</label>
<input type="email" id="email" name="email"><br><br>
<button type="submit">Submit</button>
</form>
<form>: Defines the form.<label>: Label for the input field.<input>: Accepts user input.<button>: Submits the form.
Read: Xiaomi 15 Latest Smartphone
HTML5 introduced semantic tags that describe the meaning of the content:
<header>
<h1>My Blog</h1>
</header>
<nav>
<a href="#">Home</a> |
<a href="#">About</a>
</nav>
<main>
<article>
<h2>Article Title</h2>
<p>Content goes here...</p>
</article>
</main>
<footer>
<p>Copyright 2025</p>
</footer>
<header>,<footer>: Define top and bottom sections.<nav>: Navigation links.<main>,<article>,<section>: Structure the content meaningfully.
HTML5 allows you to embed audio and video without third-party plugins:
<audio controls>
<source src="song.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
- Foundation of the Web: Every website is built on HTML.
- Easy to Learn: It has a simple syntax and is perfect for beginners.
- Supports SEO: Proper HTML structure helps search engines understand your site.
- Essential for Web Development: Learning HTML is the first step before CSS, JavaScript, or frameworks like React.
You can write HTML using:
- Notepad or TextEdit (basic editors)
- VS Code, Sublime Text, or Atom (advanced editors)
- Online platforms like CodePen, JSFiddle, and W3Schools for testing and learning
HTML is the building block of the internet. It structures the content you see on every website. By learning HTML, you gain the power to create your own webpages and understand how the web works. With continued practice, you’ll be ready to move into more complex topics like CSS for styling and JavaScript for interactivity. Start writing HTML today, and take your first step into the exciting world of web development!
Aman Yadav