HTML

1. element
[opening tag + content + closing tag = element]

2. heading
[h1 h2 .....h6 use for heading]

3. paragraph
[p use for paragraph]

4. commented out
[ctrl + slash\ ]
it means that when we weite some content in my code but we dont show
it my web page then we use commented out

5. HTML Attribute
[ <a href="link or url">link ka content jo show ho raha ho jasy click
link<\a>
Quotes ap single or dubble dono use kar skty ha koi error nahe ayia
gaa.Is ka use kb hoga? jub hamary link ma double quotes hoga yanee ka
["] ya sign use hoga to pher hum single quotes use karayngay q ka ya
pher 3 dafa show hoga or complier ko pta nahe chalay gaa ka link kitna
ha
Is ma a ak ak tag ha or href jo lika ha ya actual ma ak link ha or jub
be hum anchor tag ke text per click karaymgay to ya href ka link open
hoga
href ak attribute ha
.HTML attribute hum use karty ha more information ka lia
hum ny already HTML tag likha hwa ha hum html attribute use karty ha
more information ka lia
Anchor tag wo tag tag hota ha jis ma hum kisi be link per redirect kar
skty ha
jub hum anchor tag ke text per click karty ha to ya humay link per
redirect kar deta ha

6. Anchor tag
[ anchor tag use hota ha link ko add karna ka lia ] shortcut; yane ka
emmet ko use karna hum a type karayngay or enter press karayngayyy.

This is called absolute link

<a href=" link ">link ka text jo hum sy link ka upper show karna
ha</a>
This is called relitive link
Agar hum "/write a file name" to ya other file ma jia gaa jis ka name
hum ny add kia ha

7. Image tag
<img src="link past karayngay" Alt"name">
yaha per alt ka matlb ha ka kisi be waja sy agar ya image show nahe ho
rahe ha to pher hum ny jo alt ma likha ha wo show hoga. ya absolute
link ke tara work karta ha

agar hamary pc ma koi pic ho hum us ko lagana chahty ha to pher hum ko

relitive link ke tara "/pic name" likhaayngay to pher wo show hoga
lakin agar hamara pic kisi folder ma ho to phr hum "folder name/pic
name" likhayngay

Agar hum hight or width ko add karna chahty ha picture ke to hum

[ width="size" ] attribute add karayngay size ma hum apne marzee ke
size add karayngay
<img src="link or pic name" alt="name" width="size">
width ke jaga hum hight be likh sakhtay ha or {dono ak sath be likh
sakhty ha jo ka recomanded nahe ha q ka is sy pic ke aspect ratio
kharab ho jate ha}

8. font
>...underline [ <u>text</u> ]
>...italian [<i>text</i> ]
....bold [ <b> text </b> ]

9. Br tag
<Br> br tag used hota ha new line ka lia yani ka next line ka lia

10. big and small tags

big tags use hota ha text ke size ko big karny ka lia or small use
hota ha text ke size ko small karny ka lia

11. hr tag
<hr> tag use hota ha horizontal line ka lia

12. subscript or superscript

<sub> subscript use hota ha text to middle sy nechy ke taraf
<sup> superscript use hota ha text to middle sy upper ke taraf
13. pre tag
HTML extra spaces ko ignore karta ha is lia pre tag use hota ha extra
space ka lia

14.STRUCTURE
1.header
2.main
3.footer

>...Header

header ma hum nav tag use karayngay

>...Main

1. section
2. artical
3. aside

1 section
A page section
hum particular part show karna chahty ha user ka lia

sec tag hum 1 sy ziada bar used kar skty ha

2 artical
ak particular batt ka lia use hota ha

3 aside
main contain sy toora sa alag topic ka lia use hota ha or ya wala
part google ads, facebook ads ka lia be use hota ha
>...Footer

is ma hum gmail,phone number,address ko likhny ka lia istimal hota ha

15. Link attribute

[ <a href="link">link ka name</a> ]
jub hum assay link add karayngay to isi tab ma he link open ho jia
gee.
agar hum chahty ha ka hamara link new tab ma open ho to pher
ab is ma hum link attribute add karayngay
[ <a href="link" target="_main">link ka name</a>
is ma hum ny ak attribute add kar dia ha hamary link to new tab ma
open karny ka lia or wo ha [target="_main"]

16. Div tag

[ Div mean divide]
div tag ko hum used karty ha container ka lia

17. inline and block element

1.block element
wo element hoty ha jo full weight ko ghairr latee ha
Example: div , p ,

2.inline element
wo element hoty ha jis ko jitnee space ke need hotee ha wo itnee he
space ghairr latee ha
Example: span

18.List
two types of list
Unorder list and order list

>...unorder list
<ul>content</ul>
is ma attribute used hoty ha 3
1.square
2.circle
3.disc
is ma hum type=1,2,3 teeno name hum add kar skty ha

>...order list
<ol> content </ol>
attribute
capital I[I] used for roman number

>>>in dono ma difference:

order list ka matlb ha ka hum list ma 1,2,3 number add kary or unorder
list ka matlb ha ka yaha per number ke jaga hum dots use kary ya wo 3
attribute add karay jo hum ny upper likhayn gay

or is content ma <li>content</li> use kar ka content likhay is sy

number ya dots show hoga

19.Table
sub sy pahlay hum table tag used karayngay
or is ka bad caption tag used karayngay table ka top ma content
likhayngay
is ka bad hum thead used karayngay or us ka under hum th likhayngay or
heading likhayngay
or is ka bad hum tbody used karayngay td sy pahlay

table row ka lia hum use kaaynngay [tr]

table heading ka lia hum [th]
table data ka lia hum [td]

hum heading ka lia tr or th used karayngay or td ka lia hum alag sy

again tr used karayngay
is ka ilawa hum td ma colspan attribute ka used kar skty ha . ya us
wakat used hoga jub hum 1 sy ziada coloum per 1 he heading used
karayngay

20.Form
<form action="form.php">content</form>
is ma action attribute ha or is ka matlb ha ka backand ma konsa
language used hoga or hum ny php likh lia ha
pher hum content ma input add karayngay or pher is ka type add
karayngay
>text
>passoword
>check box
>button
>color
>date
>datetime-local
>email
>file
>hidden
>radio

textarea hum used karty ha ak area ka lia jis ma hum text add karay

21. select tag

sub sy pahlay hum select tag ko used karayngay pher hum us ka bad hum
is ky content ma option tag ko used karayngay
option ka lia

22. Iframe tag(for online website,vedio tag)

iframe tag used hota ha vedio ko add karny ka lia

>>>Internet ke vedio ka lia
is ka lia hum sub sy pahlay jo vedio hum ny add karne ha us ka hum ny
embed code copy karna ha us ka bad hum wo code past karayngay without
iframe tag ky q ka is ma pahlay sy he iframe tag hota ha code ma
>>>Website ka lia
sub sy pahlay hum iframe tag ka use karayngay
<iframe src="link"></iframe>
is ma bad hum wo link copy karayngay jo hum ny apny website per show
karwana ha or wo link hum src ma past karayngay jaha per ma na link
likha ha

23. video tag

video tag hum used karty ha video ka lia jo hamary computer ma save ho
sub sy pahlay hum us video ko folder ma add karayngay us ka bad hum
vedio tag ka used karayngay
<video src="vedio name"></video>
is ka bad vedio show hogee

>>>>Attribute for vedio

>controls
>autoplay (MDN says not use)
>loop

vedio ma controll show karny ka lia controll attribute ka use

karayngay
vedio ko autoplay karna ka lia autoplay attribute ka use karayngay
vedio ko loop karny ka lia loop attribute ka use karayngay

SEO
Type of SEO
There are two types of seo
1.On page SEO
2.Off page SEO

on page seo use hote ha html ma or off page seo ka koi kam nahe ha
html ka sath

seo ka lia sub sy pahla point

1.heading
heading title ma likha jata ha or title head ka section ma hota ha

2.Meta description
meta tag head ma likha jata ha ,
is ka lia meta description tag used karayngay,or us ma meta tag
likhayngay.

3.Url slug
humay acha sa url slug use karna taky hamara url dakh ka he pta chal
jia ka ya kis cheez ka baary ma ha

4.Meta keyward tag

ya be head ma likha jata ha or is ka lia hum meta tag used karayngay
or is ma hum name attribute add karayngay or us ma hum keyword used
karayngay or is ka bad content ma meta keyword tag used karayngay
Eg:seo, seo 2022,seo search

5.Meta author tag

is ma hum ya likhty ha ka ya blog ya content kis ny likha ha
is ka lia hum meta tag ka used karayngay or is ma hum name attribute
add karayngay or name ma hum author likhayngay or content ma hum
author ka name likhayngay
<meta name="author" content="author name">

6.Link Fav icon

ya head ma likha jata ha
hum ko fav icon add karna ha or ya tab ma show hota ha
is ka lia hum [link fav icon] tag ka used karayngay

7.Compress image and other resources

humay internet sy image compressure ko used kar ky image ko compress
karna hoga

8.Minify and compress js,css html

ya code ko compress kar deta ha yani ka code ma extra spaces or extra
line dono khatam ho jate ha

9.Add alt text to images

jub hum koi image add karty ha to wo jub kisi waja sy show nahe hota
to alt wala text show hota ha ya be zaroori ha user experiances

***********Key Point************
1. If we click alt in vs code then we select more places [cursor]in
one time and we changed , remove , and other works.yaani ka multiple
cursor.
2. ALT + Z [toggle word wrap ] text ke line ko screen ky baraber karny
ka lia.