Day 21: HTML Basics – Complete Beginner Guide for Ethical Hacking & Web Development (Hindi)
🌐 Day 21: HTML Basics
(Bug Hunting / Ethical Hacking Course – Day 21)
Ab hum web world me entry kar rahe hain 🔥
Agar aap bug bounty ya web hacking karna chahte ho, to sabse pehle aapko HTML samajhna hoga.
Kyun?
Kyuki har website ka structure HTML se banta hai.
🔹 HTML Kya Hai?
HTML ka full form hai:
Hyper Text Markup Language
Ye programming language nahi hai — ye ek markup language hai jo webpage ka structure banati hai.
🔹 HTML Ka Kaam Kya Hai?
HTML define karta hai:
✔ Headings
✔ Paragraphs
✔ Images
✔ Links
✔ Forms
✔ Buttons
Browser HTML ko read karke webpage display karta hai.
Popular browser example:
Google Chrome
🔹 Basic HTML Structure
Har HTML page ka ek basic structure hota hai:
<!DOCTYPE html>
<html>
<head>
<title>My First Page</title>
</head>
<body>
<h1>Hello World</h1>
<p>This is my first webpage.</p>
</body>
</html>
🔥 Important Tags Samjho (Very Important)
1️⃣ <html>
Pure webpage ko wrap karta hai.
2️⃣ <head>
Page ki information (title, meta data)
3️⃣ <title>
Browser tab me naam show karta hai.
4️⃣ <body>
Jo content user ko dikhai deta hai.
🔥 Headings Tags
HTML me 6 heading tags hote hain:
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
👉 h1 sabse bada hota hai
👉 h6 sabse chhota
SEO ke liye h1 important hota hai.
🔥 Paragraph Tag
<p>This is paragraph text.</p>
Text likhne ke liye use hota hai.
🔥 Line Break
<br>
Next line me le jata hai.
🔥 Link Tag (Very Important for Hacking)
<a href="https://example.com">Visit Website</a>
👉 href attribute URL define karta hai.
Bug bounty me links analyze karna important hota hai.
🔥 Image Tag
<img src="image.jpg" alt="My Image">
src → image location
alt → description
🔥 HTML Attributes Kya Hote Hain?
Attributes tag ke extra information dete hain.
Example:
<a href="https://google.com" target="_blank">
Yahan:
href attribute hai
target attribute hai
🔥 HTML File Kaise Banaye?
1️⃣ Desktop par new file create karo
2️⃣ Name rakho:
index.html
3️⃣ Notepad me open karo
4️⃣ Basic structure paste karo
5️⃣ Save karo
6️⃣ Double click karo → browser me open ho jayega
🧪 Practice Lab (Must Do)
Ek simple webpage banao:
<!DOCTYPE html>
<html>
<head>
<title>My Practice Page</title>
</head>
<body>
<h1>Welcome Hacker</h1>
<p>I am learning HTML for Bug Bounty.</p>
<a href="https://google.com">Click Here</a>
</body>
</html>
Save karo → Browser me open karo.
🔎 Hacker Perspective
Jab aap kisi website par right click → Inspect karte ho,
to aapko HTML code dikhai deta hai.
Ye inspect feature browsers me hota hai jaise:
Google Chrome
👉 HTML samajhne se aap website ka structure samajh paoge.
🎯 Day 21 Summary
✔ HTML webpage ka structure banata hai
✔ Basic tags samjhe (html, head, body)
✔ Headings & paragraph use kiya
✔ Link aur image tag samjha
✔ Simple webpage create ki