Պրոգրեսիվ ընդլայնում

Վեբ բրաուզերները եղել են շուրջ, քանի դեռ կայքերն ունեն: Փաստորեն, բրաուզերները կարեւոր բաղադրիչ են փորձի կամ մարդկանց դիտելու համար, բայց ոչ բոլոր բրաուզերները հավասարապես ստեղծվում են: Այն լիովին հնարավոր է (իսկապես, հավանաբար) `հաճախորդներին դիտելու ձեր վեբ էջերը բրաուզերներում, որոնք չափազանց հին են եւ բացակայում են ժամանակակից բրաուզերում հայտնված հատկությունները: Սա կարող է նշանակալի խնդիրներ առաջացնել, երբ դուք ձգտում եք զարգացնել վեբկայքերը, որոնք օգտվում են կայքերի նախագծման եւ զարգացման վերջին նվաճումներից : Եթե ​​որեւէ մեկը գալիս է ձեր կայքը, օգտագործելով այդ հնացած բրաուզերներից մեկը, եւ ձեր վերջին առաջադեմ տեխնիկան նրանց համար չի գործում, դուք կարող եք ընդհանուր առմամբ վատ փորձարկել: Պրոգրեսիվ ընդլայնումը տարբեր բրաուզերների համար վեբ էջի ձեւավորման ռազմավարություն է, այն է, ժամանակակից օժանդակության պակասող այն հին բրաուզերները:

Պրոգրեսիվ ուժեղացումը ինտերնետային էջերի նախագծման ձեւն է, որպեսզի ավելի շատ առանձնահատկություններ օգտագործող գործակալը աջակցում է, որ ավելի շատ առանձնահատկություններ վեբ էջը կունենա: Դա նրբագեղ դեգրադացիան հայտնի նախագծային ռազմավարության հակառակն է: Այդ ռազմավարությունը նախեւառաջ ստեղծում է էջերը առավել ժամանակակից բրաուզերների համար, իսկ հետո ապահովում է, որ նրանք նույնպես լավ են աշխատել ավելի քիչ ֆունկցիոնալ բրաուզերների հետ, որ փորձը «դանդաղորեն նվաստացնում է»: Պրոգրեսիվ ուժեղացումը սկսվում է պակաս հաջողված բրաուզերներից եւ սկսում է փորձից առաջ:

Ինչպես օգտվել առաջադեմ բարելավումից

Երբ դուք ստեղծում եք վեբ դիզայն, օգտագործելով պրոգրեսիվ ուժեղացում, առաջին բանը, որ դուք պետք է անեք, ստեղծեք այնպիսի դիզայն, որը աշխատում է վեբ բրաուզերների ամենացածր ընդհանուր համատեքստում: Իր հիմնական, առաջադեմ ուժեղացումն ասում է, որ ձեր բովանդակությունը պետք է մատչելի լինի բոլոր վեբ բրաուզերների համար, այլ ոչ թե ենթաօրենսդրական հավաքածու: Այս պատճառով սկսեք աջակցել այս հին, հնացած եւ քիչ լիարժեք բրաուզերներին: Եթե ստեղծում եք կայք, որը լավ է աշխատում նրանց համար, դուք գիտեք, որ դուք հիմք եք ստեղծել, որը պետք է մատուցի առնվազն օգտակար փորձ, բոլոր այցելուներին:

Նախ, երբ սկսում եք ամենից քիչ թույլ աշխատող բրաուզերներից, դուք կցանկանայիք ապահովել, որ ձեր բոլոր HTML- ը պետք է լինի վավեր եւ իմաստալից: Սա կօգնի ապահովել, որ օգտվողների ամենալայն բազմազանությունը կարող է էջը դիտել եւ այն ճշգրտել:

Հիշեք, որ տեսողական դիզայնի ոճերը եւ ընդհանուր էջի դասավորությունը ավելացվում են արտաքին ոճի թերթերով : Սա իսկապես ուր է տեղի ունենում առաջադեմ ուժեղացմանը: Օգտագործեք ոճաթերթիկը, կայքի ստեղծման համար, որը աշխատում է բոլոր այցելուների համար: Այնուհետեւ կարող եք հավելյալ ոճեր ավելացնել, էջը բարելավելու համար, քանի որ օգտագործող գործակալները ձեռք են բերում ֆունկցիոնալություն: Յուրաքանչյուրը ստանում է բազային ոճերի ոճերը, սակայն ցանկացած նորությունների բրաուզերների համար, որոնք կարող են աջակցել ավելի առաջադեմ եւ ավելի ժամանակակից ոճերի, նրանք ստանում են լրացուցիչ: Դուք «առաջադեմ բարձրացնում եք» էջը բրաուզերների համար, որոնք կարող են աջակցել այդ ոճերին:

Կան մի քանի եղանակ, որ կարող եք կիրառել առաջադեմ ուժեղացում: Նախ, պետք է հաշվի առնել, թե ինչպիսի զննարկիչը դա անում է, եթե չի հասկանում CSS- ի գիծը, այն անտեսում է այն: Սա իրականում աշխատում է ձեր օգտին: Եթե ​​դուք ստեղծեք բազային ստեղներ, որոնք բոլոր բրաուզերները հասկանում են, ապա կարող եք լրացուցիչ ոճեր ավելացնել նոր բրաուզերների համար: Եթե ​​նրանք սատարեն ոճերը, նրանք կկիրառեն դրանք: Եթե ​​ոչ, ապա նրանք անտեսում են դրանք եւ պարզապես օգտագործում են այդ բազային ոճերը: Այս CSS- ում կարելի է տեսնել առաջադեմ ուժեղացման պարզ օրինակ.

.main- բովանդակություն {
background: # 999;
background: rgba (153,153,153, .75);
}

Այս ոճը նախապես ձեւավորում է գորշ գույն: Երկրորդ կանոնը օգտագործում է RGBA գունային արժեքներ `թափանցիկության մակարդակ սահմանելու համար: Եթե ​​զննարկիչը աջակցում է RGBA- ին, ապա այն կկիրառի առաջին ոճը երկրորդով: Եթե ​​դա չի կատարվում, ապա միայն առաջինը կկիրառվի: Դուք սահմանել եք բազային գույն եւ ապա ավելացրեք լրացուցիչ ոճեր ավելի ժամանակակից բրաուզերների համար:

Առանձնահատուկ հարցումների օգտագործումը

Մեկ այլ ձեւ, որը դուք կարող եք կիրառել առաջադեմ ուժեղացում, այն է, օգտագործել այն, ինչ հայտնի է որպես «խաղարկային հարցումներ»: Սրանք նման են լրատվամիջոցների հարցումների , որոնք կարեւոր դերակատարում ունեն կայքի դիզայնի կարեւոր դիզայնից : Լրատվամիջոցը որոշակի էկրանի չափսերի համար տեքստեր հարցնում է, հարցման հարցումներն ստուգելու են, թե արդյոք որոշակի առանձնահատկություն է աջակցվում, թե ոչ: Օգտագործեք այն շարահյուսությունը,

@ աջակցում է (ցուցադրում `ճկուն) {}

Ցանկացած ոճեր, որոնք ավելացրել եք այս կանոնի ներսում, կաշխատեին միայն այն դեպքում, եթե այդ զննարկիչը աջակցեց «flex», որը Flexbox- ի ոճերը: Դուք կարող եք սահմանել մի շարք կանոններ բոլորի համար, եւ ապա օգտագործել հնարավորության հարցումները միայն լրացուցիչ հավելյալ բրաուզերների համար ավելացնելու համար:

Իրական հոդվածը Ջենիֆեր Քրինինն է: Վերափոխվել է Ջերեմի Գիրարդը 12/13/16 թ .: