Ինչու են բոլոր կայքերը կառուցված կառուցվածքով, ոճով եւ վարքագծերով
Ընդհանուր անալոգիան, որն օգտագործվում է նախորդ վեբ կայքի զարգացման համար, այն է, որ նման է 3 ոտանի աթոռին: Այս երեք ոտքերը, որոնք նաեւ հայտնի են որպես վեբ զարգացման 3 շերտ, կառուցվածքը, ոճը եւ վարքագիծն են:
Վեբի զարգացման երեք շերտերը
- Կառուցվածք կամ բովանդակային շերտ
- Վեբ էջի կառուցվածքը կամ բովանդակային շերտը այդ էջի հիմնական HTML կոդը է: Տանիքի շրջանակի նման ստեղծում է ամուր հիմք, որի վրա մնացած տան կառուցված է, այնպես որ HTML- ի ամուր հիմքը ստեղծում է հարթակ, որի վրա կարելի է ստեղծել կայք: HTML կառուցվածքը կարող է բաղկացած լինել տեքստի կամ պատկերներից, եւ այն ներառում է հիպերհղումներ, որոնք այցելուները կօգտագործեն այդ վեբ կայքով նավարկելու համար:
- Ոճը կամ ներկայացման շերտը
- Ոճը կամ ներկայացման շերտը թելադրում է, թե ինչպես կառուցված HTML փաստաթուղթը կտեսնի կայքի այցելուներին: Այս շերտը սահմանվում է CSS- ով (Cascading Style Sheets): Այս ֆայլերը պարունակում են ոճեր, որոնք ցույց են տալիս, թե ինչպես պետք է փաստաթուղթը ցուցադրվի վեբ բրաուզերում: Այսօրվա վեբում ոճերի շերտը կարող է ներառել նաեւ ԶԼՄ-ների հարցումներ, որոնք կարող են փոխել կայքի ցուցադրությունը `հիմնված տարբեր տեսակի չափերի եւ սարքերի վրա :
- Վարքագիծ
- Կատարողականի շերտը այն վեբ էջի շերտն է, որը կարող է արձագանքել տարբեր օգտագործողի գործողություններին կամ փոփոխություններ կատարել էջում, պայմանների շարքի հիման վրա: Վեբ էջերի մեծամասնության համար վարքի մակարդակը կլինի էջում JavaScript միջերեսը:
Ինչու պետք է բաժանեք շերտերը:
Երբ դուք ստեղծում եք վեբ էջ, ցանկալի է շերտերը հնարավորինս առանձնացնել: Կառուցվածքը պետք է հավատալ ձեր HTML- ին, տեսողական ոճերին CSS- ում եւ վարքագծի համար, օգտագործվող ցանկացած սցենարների համար:
Շերտերը բաժանելու առավելություններից մի քանիսը հետեւյալն են.
- Համատեղ ռեսուրսներ
- Երբ եք գրում արտաքին CSS ֆայլ կամ JavaScript ֆայլ, դուք կարող եք օգտագործել այդ ֆայլը ցանկացած էջով ձեր վեբ կայքում: Եթե դուք պետք է փոփոխություն կատարեք այդ ֆայլում, հնարավոր է, որ կայքում որոշակի տպագրական ոճերը թարմացնեք, այդ ոճաթերթիկը օգտագործող յուրաքանչյուր էջը կստանա փոփոխություն: Կայքի յուրաքանչյուր էջի անհատապես խմբագրելու անհրաժեշտություն չկա, որը ավելի մեծ կայքի համար կարող է լինել խայտառակ ձեռնարկություն:
- Ավելի արագ ներլցումներ
- Երբ սցենարը կամ ստեղնաշարը ներբեռնվել է ձեր հաճախորդի կողմից առաջին անգամ, այն պահվում է իրենց վեբ բրաուզերի կողմից: Քանի որ այս ընդհանուր ռեսուրսները այժմ պահվում են քեշի մեջ, զննարկիչում պահանջվում է ավելի արագ, որը բարելավում է ընդհանուր էջի արագությունը եւ կատարումը:
- Բազմաթիվ թիմեր
- Եթե դուք ունեք միանգամից մի կայքէջում աշխատող մեկից ավելի անձ, կարող եք օգտագործել այնպիսի համակարգեր, որոնք «ստուգել» եւ «ստուգել» ֆայլերի համար ապահովելու համար, որ թիմի բոլոր անդամները աշխատում են այս ֆայլերի վերջին տարբերակների հետ: Դա շատ ավելի դժվար է անել, եթե ոճերն ու վարքագիծը ներդաշնակ են կառուցվածքային փաստաթղթերի հետ:
- SEO- ն
- Կայքը, որը ունի ոճի եւ կառուցվածքի հստակ տարանջատումը, ամենայն հավանականությամբ, ավելի լավ է դարձնում որոնման համար, քանի որ այդ կայքերը կարող են ավելի արդյունավետորեն քողարկել այդ բովանդակությունը եւ հասկանալ էջը, առանց տեսողական ոճով կամ վարքի մասին տեղեկությունների:
- Մատչելիություն
- Արտաքին ոճի թերթիկները եւ սցենարային ֆայլերը ավելի մատչելի են մարդկանց եւ բրաուզերների համար: Քանի որ առկա է ոճի եւ կառուցվածքի բաժանումը, ծրագրային ապահովումը, ինչպես օրինակ, էկրանի ընթերցողները, կարող են ավելի հեշտությամբ մշակել բովանդակությունը կառուցվածքային շերտից, առանց ոգեշնչված ոճերով, որոնք նրանք չեն կարող օգտագործել:
- Հետագա համատեղելիություն
- Երբ դուք ունեք զարգացման շերտերի նախագծված կայք, այն ավելի հետընթաց կլինի, քանի որ բրաուզերները կամ սարքավորումները, որոնք չեն կարողանում օգտագործել որոշակի CSS ոճեր կամ որոնք կարող են ունենալ JavaScript անջատված, կարող են դեռ դիտել HTML: Ձեր վեբ կայքը կարող է աստիճանաբար բարելավվել նրանց կողմից աջակցվող բրաուզերների հատկանիշներով:
HTML - կառուցվածքային շերտը
Կառուցված շերտը այն է, որտեղ դուք պահում եք ձեր բոլոր հաճախորդների ցանկը կարդալ կամ նայել բոլոր բովանդակությունը: Սա կդառնա կոդավորված HTML5 ստանդարտներին համապատասխան եւ այն կարող է ներառել տեքստային եւ պատկերներ, ինչպես նաեւ մուլտիմեդիա (տեսանյութ, աուդիո եւ այլն): Կարեւոր է համոզվել, որ ձեր կայքի բովանդակության յուրաքանչյուր առարկան ներկայացված է կառուցվածքային շերտում: Սա թույլ է տալիս JavaScript- ը անջատել կամ ով չի կարող տեսնել CSS- ի բոլոր հաճախորդները, դեռեւս օգտվելու են ամբողջ կայքի վրա, եթե այդ կայքի բոլոր ֆունկցիոնալությունը:
CSS- ի ոճերի շերտը
Դուք կստեղծեք ձեր բոլոր տեսողական ոճերը ձեր կայքի համար արտաքին ոճի թերթիկում: Դուք կարող եք օգտագործել բազմակի ոճաթերթեր, սակայն հիշեք, որ առանձին CSS ֆայլը պահանջում է HTTP- ի խնդրանք, որը կխթանի կայքի գործունեության կատարումը:
JavaScript - Վարքագծի շերտը
JavaScript- ը վարվելակերպի շերտի համար ամենատարածված լեզուն է, բայց ինչպես նախկինում նշեցի, CGI- ն եւ PHP- ն կարող են նաեւ ստեղծել վեբ էջի վարքագիծ: Այնուամենայնիվ, երբ շատ մշակողները վերաբերվում են վարքագծի շերտին, նրանք նշանակում են այն շերտը, որը ակտիվանում է անմիջապես վեբ բրաուզերում, ուստի JavaScript- ը գրեթե միշտ ընտրության լեզուն է: Դուք օգտագործում եք այս շերտը, ուղղակիորեն համագործակցելով DOM- ի կամ Document Object Model- ի հետ: Բովանդակային շերտում վավեր HTML- ի ստեղծումը նույնպես կարեւոր է վարքի շերտում DOM փոխազդեցությունների համար:
Երբ դուք կառուցեք վարքագծի շերտում, դուք պետք է օգտագործեք արտաքին սցենարների ֆայլեր, ինչպես CSS- ով: Դուք ստանում եք նույն առավելությունները արտաքին ոճի թերթիկ օգտագործելու համար: