HTML Introduction

HTML introduction tutorial for beginners. Learn HTML5 structure, tags, elements, and start building responsive websites easily.

61 views
5 min read
Try It Yourself

Experiment with the code in an interactive editor

What is HTML?

HTML stands for HyperText Markup Language.It is the standard language used to create and design the structure of web pages.

HTML tells the browser how to display content like text, images, links, and other elements.

Purpose of HTML

HTML is used to define the structure of a webpage. It helps in creating:

  • Headings and subheadings

  • Paragraphs and text content

  • Images and media

  • Links to other pages

  • Forms for user input

HTML5 Features

HTML5 is the latest version of HTML and comes with powerful new features:

  • 🎥 Video & Audio Support – Play media without external plugins

  • 🎨 Canvas – Draw graphics and animations directly in the browser

  • 💾 Local Storage – Store data in the browser

  • 🧱 Semantic Tags – Better structure like <header>, <footer>, <article>, <section>

  • 📱 Mobile-friendly design support

What can HTML do?

  • Make big headings (<h1>)

  • Write normal text (<p>)

  • Add pictures (<img>)

  • Create clickable links (<a>)

  • Build forms for login/signup (<form>)

Why learn HTML?

  • Every website uses HTML

  • You cannot build a website without HTML

  • It's the FIRST thing every web developer learns

Your first HTML code (with explanation):

1<!DOCTYPE html>     <!-- LINE 1: "Hey browser, use modern rules" -->
2<html>              <!-- LINE 2: "Everything of my page goes inside me" -->
3<head>              <!-- LINE 3: "These are settings, don't show them" -->
4    <meta charset="UTF-8">  <!-- "Support all languages and emojis" -->
5    <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- "Work on phones" -->
6    <title>My First Page</title>  <!-- "Show this on browser tab" -->
7</head>
8<body>              <!-- LINE 4: "Everything visible goes inside me" -->
9    <h1>Hello World!</h1>   <!-- Big heading -->
10    <p>This is my first website.</p>  <!-- Normal paragraph -->
11</body>
12</html>

How to run:

  1. Open Notepad (or any text editor)

  2. Copy the code above

  3. Save as first.html

  4. Double-click the file → Opens in browser