Lesson 1-Html & Html5 from A to Z

0
274
Courses - Development - Front-End - Html & Html5 from A to Z

Html-ի մասին

HTML(անգլ.՝ HyperText Markup Language, գերտեքստի նշագրման լեզու), նշագրման լեզու, որն օգտագործվում է վեբ-էջերի մեծամասնության նշագրման համար։ HTML լեզուն վերամշակվում է դիտարկչի կողմից և ցուցադրվում է մարդու կողմից հեշտ ընթեռնելի փաստաթղթի տեսքով։
HTML-ի օգնությամբ հեշտությամբ կարելի է ստեղծել համեմատաբար պարզ, սակայն գեղեցիկ ձևավորված փաստաթուղթ։ Ի հավելումն փաստաթղթի կառուցվածքի պարզեցմանը՝ HTML-ում աջակցվում էր հիպերտեքստը։ Մուլտիմեդիայի հնարավորությունները ավելացվեցին քիչ ավելի ուշ։ Ի սկզբանե HTML լեզուն ստեղծվել է որպես փաստաթղթերի կառուցման և ձևավորման միջոց՝ անկախ օգտագործվող արտածման միջոցից (էկրան, տպիչ և այլն) ցուցադրելու միջոց։ Նախնական HTML ձևաչափով տեքստը պետք է առանց ոճային և կառուծվածքային ձևափոխման արտածվեր սարքավորման վրա՝ տարբեր տեխնիկական համալրմամբ (ժամանակակից համակարգչի գունավոր էկրանը, օրգանայզերի մոնոխրոմային էկրան, բջջային հեռախոսների կամ տեքստերի ձայնային վերարտադրման ծրագրերի կամ սարքավորումների սահմանափակ չափերով էկրան)։ Սակայն HTML-ի ժամանակակից կիրառումը հեռու է սկզբնական նշանակությունից։

Ի՞նչ է HTML-ը

  • HTML-ը նշագրման ստանդարտ լեզուն է վեբ էջեր ստեղծելու համար:
  • HTML-ը նշանակում է Hyper Text Markup Language:
  • HTML-ը նկարագրում է վեբ էջի կառուցվածքը:
  • HTML-ը բաղկացած է մի շարք էլեմենտներից:
  • HTML էլեմենտները browser-ին ասում են, թե ինչպես ցուցադրել էջի բովանդակությունը:
  • HTML էլեմենտները նկարագրում են բովանդակության այնպիսի կտորներ, ինչպիսիք են «Սա վերնագիր է», «Սա հղում է» և այլն:

HTML ֆայլի բացատրություն

— !DOCTYPE html – Հռչակագիր, որը սահմանում է, որ այս փաստաթուղթը հանդիսանում է HTML5 փաստաթուղթ:
— html – էլեմենտը անդիսանում է փաստաթղթի հիմնական էլեմենտներից մեկը:
— head – էլեմենտը պարունակում meta տեղեկատվություն HTML էջի մասին:
— title – էլեմենտը սահմանում է էջի վերնագիրը, որը ցույցադրվում է բրաուզերի վերնագրում:
— body – էլեմենտը սահմանում է փաստաթղթի մարմինը, և մի կաղապար է տեսանելի բովանդակության համար:
— h1 – էլեմենտը սահմանում է էջի մեծ վերնագիր:
— p – էլեմենտը սահմանում է էջի պարբերություններից մեկը:

Ի՞նչ է HTML էլեմենտը

HTML էլեմենտը սահմանվում է բացող թեգի, որոշակի բովանդակության և փակող թեգի միջոցով:
tagname Որոշակի բովանդակության … /tagname

HTML էլեմենտի օրինակներ

h1Սա վերնագիր է/h1
pՍա պարբերություն է/p
Նշում. HTML-ի որոշ էլեմենտներ չունեն բովանդակություն (ինչպես օրինակ br էլեմենտը): Այս էլեմենտները կոչվում են դատարկ կամ միայնակ էլեմենտներ: Այս էլեմենտները փակող թեգ չունեն:

Courses - Development - Front-End - Html & Html5 from A to Z

Վեբ Browser-ներ

Վեբ browser-ի(Chrome, Edge, Firefox, Safari, Opera) նպատակն է կարդալ HTML փաստաթուղթը և ճիշտ ցուցադրել այն: Browser-ը չի ցուցադրում HTML թեգերը, բայց դրանց միջոցով որոշում է փաստաթուղթը ցուցադրելու եղանակը:

Courses - Development - Front-End - Html & Html5 from A to Z

Html-ի պատմություն

Համաշխարհային ցանցի ստեղծման առաջին օրերից ի վեր HTML-ի բազմաթիվ տարբերակներ են եղել. ներկայացնում ենք HTML-ի թարմացումների ցանկը՝ ըստ տարիների:
HTML 2.0 – ստանդարտը հաստատվել է 1995 թվականի սեպտեմբերի 22-ին:
HTML 3.2 – 1997 թվականի հունվարի 14:
HTML 4.0 – 1997 թվականի դեկտեմբերի 18:
HTML 4.01(փոփոխություններ, որը ավելի կարևոր է, քան թվում է առաջին հայացքից) – 1999 թվականի դեկտեմբերի 24:
HTML5 – 2014 թվականի հոկտեմբերի 28:
HTML 5.1 – սկսել է մշակել 2012 թվականի դեկտեմբերի 19-ից:
HTML 5.2 – 2017 թվականի դեկտեմբերի 14:
HTML 5.3 – 2018 թվականի դեկտեմբերի 24:
HTML 1.0-ի պաշտոնական սետիֆիկացիան չկա։ 1995 թվականից կային բազմաթիվ HTML-ի ոչ պաշտոնական ստանդարտներ։

Պարզ HTML փաստաթուղթ

Ստորև ներկայացված է HTML էջի կառուցվածքի գրաֆիկական պատկերը:
Նշում. Body բաժնի ներսում պարունակվող բովանդակությունը ցուցադրումվում է browser-ում: title էլեմենտի պարունակությունը կցուցադրվի browser-ի վերնագրի տողում կամ էջի ներդիրում:

Courses - Development - Front-End - Html & Html5 from A to Z
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Էջի վերնագիր</title>
    </head>
    <body>
        <h1>Սա վերնագիր է</h1>
        <p>Սա պարբերություն է</p>
    </body>
</html>
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Էջի վերնագիր</title>
    </head>
    <body>
        <h1>Սա վերնագիր է</h1>
        <p>Սա պարբերություն է</p>
    </body>
</html>

Նմանատիպ դասեր