Mastering the Basics of HTML5: A Beginner's Guide to Creating Web Pages | Lecture 1 in Hindi / Urdu

Lecture 1

Welcome to Improve your Knowledge mera naam hai Imtiyaz Khan aur ap is blog me sikhege HTML k zariye web page k structure create karna jiske liye hume html ko samajna hota yani jayise html kya hai aur usme kin kin cheezo ka use hota hai. pore HTML ko hum lecture wise sikhege.

Index of HTML

Lecture 1 Topics

  • What is HTML5?
  • What is HTML Tags?
  • Types of HTML Tags.
  • What is Block-level & Inline Tags?
  • What is HTML Attributes ?

Lecture 2 Topics

  • Write HTML Basic Code.
    • What is DOCTYPE Tag.
    • What is HTML Tag.
    • What is Head Tag.
    • What is Title Tag.
    • What is Body Tag.
    • What is H1 Tag.
    • What is P Tag.

Lecture 3 Topics

  • What is Bold Tag.
  • What is Italic Tag.
  • What is Underline Tag.
  • What is Delete Tag.
  • What is Mark Tag
  • What is Subscript & Superscript Tag.

Lecture 4 Topics

  • What is Image Tag.
  • What is Base Tag.
  • What is Figure Tag.
  • What is Figcaption Tag.
  • With All Attribute

Lecture 5 Topics

  • What is Anchor Tag.
    • With Attribute

Lecture 6 Topics

  • Table Tag.
    • With Attribute

Lecture 7 Topics

  • What is Iframe Tag.
    • With Attribute.

Lecture 8 Topics

  • What is Form Tag.
    • With Attribute.

Lecture 9 Topics

  • What is SVG Tag.
    • With Attribute.

Lecture 10 Topics

  • Make Basic Page.
    • What is Header Tag.
    • What is Nav Tag.
    • What is Main Tag.
    • What is Article Tag.
    • What is Footer Tag.

Introduction of HTML

What is HTML5 ?

HTML 5 (Hypertext Markup Language, version 5) ek markup language hai jo web pages ko create aur present karne ke liye use kiya jata hai. HTML 5 ek standard hai jo World Wide Web Consortium (W3C) dwara develop kiya gaya hai.

HTML 5, pichle version HTML 4 se advanced hai. HTML 5 ke new features ke beech multimedia support, canvas aur SVG graphics, local storage, offline application caching, form controls, aur semantic tags shaamil hain. Isse web developers ko web pages ko create karne ke liye jyada control aur flexibility milti hai.

Kuch HTML 5 ke important features aur benefits hai:Improved multimedia support jaise video, audio, aur canvas.
New form controls jaise date picker, color picker, aur range slider.
Simplified and improved syntax.
Semantic tags jaise "header", "footer", "nav", aur "article" jaisi HTML tags ka use karne se web pages ka structure saaf aur organized rehta hai.
Offline Application Caching jisse web pages offline bhi use kiye jaa sakte hain.
Improved accessibility features jaise WAI-ARIA support.

Overall, HTML 5 ek bahut hi important milestone hai web development mein aur isse web pages ko create karna aur design karna bahut hi aasaan aur powerful ho gaya hai.

What is HTML Tags.

HTML mein tags ka use content ko structure aur presentation dene ke liye kiya jaata hai. Har tag ka apna apna meaning hota hai aur unke use se content ko different elements mein divide kiya jaata hai. HTML tags chevron brackets (<>) ke bich likhe jaate hain.

Kuch common HTML tags niche diye gaye hain:<html> - Defines an HTML document
<head> - Contains metadata about the HTML document
<title> - Defines the title of the HTML document
<body> - Contains the visible content of the HTML document
<p> - Defines a paragraph
<a> - Defines a hyperlink
<img> - Defines an image
<ul> - Defines an unordered list
<ol> - Defines an ordered list
<li> - Defines a list item
<table> - Defines a table
<tr> - Defines a table row
<td> - Defines a table cell
<form> - Defines a form for user input
<input> - Defines an input field
<button> - Defines a clickable button

Yeh sirf kuch common HTML tags hain aur HTML mein aur bhi kayi tags hote hain. Har tag ka apna apna use hota hai, jiske through web page ko design aur content ko structure kiya jata hai.

HTML Tag types.

HTML tags do categories mein divide kiye jaate hain - Container tags (also known as paired tags or start/end tags) and Empty tags (also known as self-closing tags).

Container tags, jaise <div>, <p>, <h1> to <h6>, <table>, <ul>, etc., kisi specific content ko wrap karte hain, jaise text, images, other elements, and more. Yeh tags usually start tag (<tag>) aur end tag (</tag>) se bane hote hain, aur content ko start aur end points ke bich mein rakhne ka kaam karte hain. Example:

<p>This is a paragraph.</p>
Empty tags, jaise <br>, <img>, <input>, etc., kisi specific content ko wrap nahi karte hain, lekin usmein khud ka specific meaning hota hai. Yeh tags usually start tag (<tag>) ke sath use kiye jaate hain aur end tag nahi hota hai. Example:


<br> <img src="image.jpg" alt="An image"> <input type="text" name="username" value="Enter your username">


Empty tags khud mein complete hote hain, jisse inhein khud ko close karne ki jarurat nahi hoti. Dono categories ke tags ka use content ko structure aur design dene ke liye kiya jaata hai.

What is Block-level & Inline Tags.

HTML tags do categories mein divide kiye jaate hain - Block-level elements and Inline elements.

Block-level elements, jaise <div>, <p>, <h1> to <h6>, <ul>, <li>, <table>, <form>, etc., web page mein ek naye block ko start aur end karte hain. Yeh normally ek new line se start hote hain aur unke paas width, height, margin, padding ki properties hoti hain. Block-level elements usually contain other block-level and inline-level elements inside them. Example:
<div>
<h1>Heading</h1>
<p>This is a paragraph.</p>
<ul>
<li>List item 1</li>
<li>List item 2</li>
</ul>
</div>

Inline elements, jaise <span>, <a>, <img>, <input>, <strong>, etc., web page mein inline content ko wrap karte hain. Yeh normally ek line ke andar hi display hote hain aur unke paas width, height, margin, padding ki properties nahi hoti hain. Inline elements usually contain only text or other inline-level elements inside them. Example:

<p>This is an <strong>important</strong> message.</p> <a href="https://www.example.com">Visit our website</a>
Block-level aur inline-level elements ke use se HTML content ko structure aur presentation diya jata hai, jisse web pages ko visually appealing banaya ja sakta hai.

What is HTML Attributes ?

HTML attributes tags ke andar ke data ko define karte hai. Yeh tags ke properties hote hain jo content ko describe karte hain aur unke specific characteristics ko define karte hain. Attributes usually key-value pairs hote hain aur tag ke start tag ke andar likhe jaate hain.

Example:

<a href="https://www.example.com">This is a link</a>


Is example mein "href" attribute ka use kiya gaya hai, jo hyperlink ke destination URL ko define karta hai.

Kuch common HTML attributes niche diye gaye hain:id: Ek tag ko unique identifier dene ke liye use kiya jata hai.
class: Multiple tags ko ek group mein classify karne ke liye use kiya jata hai.
href: Link ko define karne ke liye use kiya jata hai.
src: Image ya multimedia files ka path define karne ke liye use kiya jata hai.
alt: Image ya multimedia files ke liye alternative text provide karne ke liye use kiya jata hai.
title: Kisi element ke additional information provide karne ke liye use kiya jata hai.
style: CSS ke styles ke liye use kiya jata hai.
target: Link ke open hone ke liye new window ka define karne ke liye use kiya jata hai.

HTML tags ke alawa, attributes ka use bhi content ke design aur functionality ke liye kiya jaata hai.

umeed hai apko sare tags ache se samaj me aay hoge next lecture k liye humri blog ko follow karte rahe aur agar apko humara blog pasand aaya to apne dosto se bhi share kare. milte hai next lecture k liye tab tak k liye allahafiz

 

"HTML Unleashed: A Comprehensive Guide"
"Mastering HTML: From Basics to Beyond"
"HTML Essentials: Building the Web"
"HTML Demystified: Tag by Tag"
"The HTML Playground: Your Coding Hub"
"Unlocking the Web: HTML Explained"
"HTML Wizardry: Crafting Web Pages"
"HTML Insights: A Developer's Handbook"
"HTML Made Simple: Learn and Create"
"HTML Chronicles: Your Journey Begins Here"

 

"FOR MY CHANNEL" ❤️LIKE 💬COMMENT 🔗SHARE ❗🔥🔥🔥🔥SUBSCRIBE NOW 🔔PRESS THE BELL ICON FOR NOTIFICATION

 


Comments