Բարի գալուստ մեր կայքէջ

Գիտեմ որ սա անյնքան էլ գրավիչ կայքէջ չէ

Այն ամբողջովին դատարկա է, բայց ամեն կայքէջ այդպես է սկսվում

և ես Ձեզ շուտով ցույց կտամ, թե ինչպես կարելի է կառուցել էջ

Բայց առաջին հերթին եկեք

ուսումնասիրենք դատարկ էջի կմախքը

Ամեն կայքէջ սկսվում է

այս, վերևում երևացող տողով, DOCTYPE-ով

այն տեղեկացնում է զննիչին, որ

այս կայքէջը գրված է ժամանակակից HTML-ով

այլ ոչ hին ու տաօրինակ HTML-ով

Հիմա նայենք էջի առաջին թեգին

HTML-ն ամբողջությամբ հիմնված է թեգերի վրա

Թեգն այս անկյունային

փակագծերով սկսվող և

դրանցով ավարտվող բաներն են

կամ եթե դուք սիրում եք մաթեմատիկա

կարող եք դրանց մասին մտածել որպես մեծի և փոքրի նշաններ

Յուրաքանչյուր էջի առաջին թեգն այդ

HTML թագն է, DOCTYPE-ի տակ

Սա բացվող HTML թեգն է

և ներքևում տեսնում եք փակվող HTML թեգը

Որը նույնն է բացառությամբ այս սլեշ նշանի

որը շատ կարևոր է

HTML թեգը պետք է պարունակի կայքէջը կազմող

յուրաքանչյուր թեգ

Այս պատճառով մենք գրում ենք փակող HTML թեգն ամենավերջում

HTML թեգերից շատերն այսպես զույգերով են օգտագործվում

բայց ոչ բոլորը

HTML-ի տակ միշտ կա head թեգ

Այն պարունակում է թեգեր, որոնք օգնում են զննիչին արտացոլել էջը

բայց չի պարունակում օգտատիրոջ համար տեսանելի բաներ

Սա meta թեգն է, որը ցույց է տալիս զննիչին

ավելի շատ տեղեկություն, արտացոլման համար

Օրինակ, եթե դուք օգտագործում եք տարածված սիմվոլներ

Օրինակ անգլերենի տառերը

բայց ոչ ավելի դժվար արտացոլվող տառեր

ինչպիսին են օրինակ արաբական տառերը

ապա ձեզ հարկավոր meta charset-ը 
հավասար է utf-8

հետո տեսնում ենք title tag-ը

որը զննիչն օգտագործում է էջի վեռնագիրը
որոշելու համար

Սա զննիչի վերևում գտնվող tab-ի, էջանիշերի վրա

և որոնման արդյունքներում
երևացող բառն է

Այստեղ Քան Ակադեմիայում, վեռնագիրը
երևում է մեր էջի վերևում

Եկեք փոխենք վեռնագիրը

Ես կպատրաստեմ ճագարներին նվիրված մի էջ

Գրենք անգլերեն "All about rabbits"

և դուք կարող եք տեսնել, 
թե այն ինչպես է փոխվում

Լավ մենք վերջացրինք այս հատվածը

և մենք կարող ենք փակել head tag-ը
և անցնել հաջորդ թագերին

Ամենե ինչ կատարվելու է body tag-ում

Սա բավականին ձանձրալի է հիմա
միայն սկիզբն ու վերջը

Ի՞նչ ավելացնեմ

Քանի, որ պատրաստում ենք 
ճագարների մասին կայքէջ

հավանաբար պետք է վերևում

հայտարարել դա վեռնագրով

Վեռնագիր ավելացնելու համար 
օգտագործում ենք H1 tag-ը

All about rabbits, շատ լավ

Իրականում մենք ունենք 6 թեգեր,

որոնք կարող ենք օգտագործել վեռնագրերի
համար, H1 H2 H3 H4 H5 և H6

H1-ն ամենակարևոր վեռնագրերի համար է

իսկ H6-ը ամենաքիչ կարևոր

եկեք ևս մի քանի վեռնագրեր ավելացնենք այլ

հատվածների համար։ Ես կօգտագործեմ H2-ը

ավելի քիչ կարևոր մասերի համար

և որոշ երգեր, ահա շատ լավ է

Հիմա եկեք ավելացնենք մի քիչ տեղեկություն

Ենթադրենք, որ իմ կայքէջի լսարանը

այլմոլորակայիններ են, 
ովքեր երբեք չեն տեսել ճագարներ

Նշանակում է, որ պետք է
ճագարների լավ բնութագիր տալ

և ինձ պետք է տեղեկության մի պարբերություն

ինչպե՞ս կարելի է ստեղծել
պարբերություն HTML-ում

Իհարկե P tag-ով

մենք դնում ենք P tag-ը և ուղակի

պատճենում տեղեկությունը

որպեսզի դուք ստիպված չլինեք տեսնել
թե ես ինչպես եմ այս ամենը

տպում։ Ահա հիասքանչ է

Հիմա այլմոլորակայիններին հարկավոր 
է ճագարների համար երգ

և ես նրանց կտամ իմ ամենասիրելի
երգերից մեկի բառերը

ևս մեկ անգամ օգտագործենք P tag-ը
և պատճենենք դրա մեջ երգը

Little Bunny Fofoo շատ լավ երգ է

Բայց սպասեք, ամեն ինչ մեկ տողի վրա է

ինչպե՞ս են այլմոլորակայիններ
իմանալու երբ կանգ առնեն

Ինչու՞ զննիչը չարտացոլեց

տողերի ընդհատումները որոնք ես նշել եմ

Սովորաբար զննիչներն անտեսում են դրանք

և բցատները նույնպես անտեսվում են

եթե մենք ցանկանում ենք արտացոլոլ նոր տող

պետք է դա հատուկ նշենք օգտագործելով այլ թեգ

BR tag-ը

մենք կավելացնենք BR ամեն տողից հետո

հիմա ամեն ինչ հասկանալի է

նկատու՞մ եք մի հետաքրքիր բան BR-ի վերաբերյալ

չկա փակող թեգ

եթե մտածենք դրա մասին

տողի ընդհատումը չի պարունակում ոչինչ

այսպիսով չկա ինչ-որ բան որից հետո այն պետք է վերջանա

միայն բացվող թեգը բավարար է

ահ մեզ մոտ ստացվեց

Այլմոլորակայինները կսովորեն ճագարների մասին հիմնական բաներ

իսկ դուք սովորեցիք HTML-ի հիմքերը

Երբ ես կվերջացնեմ խոսելը

մի փոքր զբաղվեք սրանով
և փորձեք փոփոխություններ անել

Երբ պատրաստ կլինեք, կատարեք ձեր առաջին 
HTML-ի առաջադրանքը