What is HTML?

Understanding HTML

HTML (HyperText Markup Language) is the standard language used to create and structure content on the web. Every website you visit — from search engines to social media — is built on an HTML foundation. HTML tells the browser what each piece of content is: a heading, a paragraph, an image, a link, a form, and so on.

How HTML Works

HTML uses a system of tags — special keywords wrapped in angle brackets — to define elements on a page. Most tags come in pairs: an opening tag and a closing tag. The browser reads these tags and renders the content accordingly.

Essential HTML Tags

• <html> — Root element wrapping the entire document
• <head> — Contains metadata, title, and linked stylesheets
• <body> — Contains all visible page content
• <h1> to <h6> — Heading levels from most to least important
• <p> — Paragraph text blocks
• <a href="..."> — Hyperlinks connecting pages together
• <img src="..." alt="..."> — Embeds images with accessibility text
• <div> — Generic container for grouping elements
• <ul>, <ol>, <li> — Unordered and ordered lists
• <form>, <input>, <button> — User input forms

Semantic HTML5 Elements

Modern HTML5 introduced semantic elements that describe the purpose of content, improving accessibility and SEO:

• <header> — Page or section header area
• <nav> — Navigation links
• <main> — Primary content of the page
• <section> — Thematic grouping of content
• <article> — Self-contained content block
• <footer> — Page or section footer

A Basic HTML Document

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>My First Page</title>
</head>
<body>
  <h1>Hello, World!</h1>
  <p>This is my first web page.</p>
</body>
</html>

🧪 Try It Yourself — Live HTML Editor

Edit the HTML code below and see the result update instantly in the preview panel:

Best Practices

• Always include a <!DOCTYPE html> declaration at the top
• Use semantic tags instead of generic <div> where possible
• Always add alt attributes to images for accessibility
• Keep your HTML clean and properly indented
• Validate your HTML using the W3C Validator