Հատկանշական եւ հարմարվող վեբ դիզայնի միջեւ տարբերությունները

Համեմատելով երկու տարբեր մոտեցումների բազմաբնույթ սարքերի վեբ դիզայնին

Պատասխանատու եւ հարմարեցված վեբ դիզայնը երկու մեթոդներն են, որոնք ստեղծում են բազմակի սարքի կայուն կայքերի ստեղծում, որոնք լավ են աշխատում տարբեր էկրանների չափսերի վրա: Մինչեւ պատասխանատու վեբ դիզայնը խորհուրդ է տրվում Google- ի կողմից եւ երկու մոտեցումների ավելի տարածված է, երկուսն էլ այս սարքերից շատերի համար նախատեսված վեբ դիզայնի վրա ունեն իրենց ուժեղ կողմերը եւ թույլ կողմերը:

Հաշվի առնելով նրբագեղ եւ հարմարվող վեբ դիզայնի միջեւ տարբերությունները, մասնավորապես կենտրոնանալով այս հիմնական ոլորտներին,

• Զարգացման հեշտություն
• Դիզայնի վրա ունեցած վերահսկողության մակարդակը
• Սարքի / էկրանի օժանդակության լայնացում
• Ինչպես ապագան բարեկամական լուծումն է
• Ընդհանուր ներբեռնման արագությունը եւ կայքի կատարումը

Որոշ սահմանումներ

Նախքան մեր մոտիվներով եւ հարմարվող վեբ դիզայնի կողք-կողքի համեմատությունները, եկեք մի պահ նայենք այս երկու մոտեցումների բարձր մակարդակի սահմանմանը:

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

Հարմարեցված դիզայնը օգտագործում է ֆիքսված չափսեր, որոնք հիմնված են նախապես որոշված ​​հանգույցների վրա, որպեսզի հայտնաբերվեն այն չափը, որը հայտնաբերվում է էջը առաջին անգամ բեռնում է:

Այդ լայն սահմանումներով, եկեք դիմենք մեր առանցքային ոլորտներին:

Զարգացման հեշտություն

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

Եթե ​​դուք աշխատում եք գոյություն ունեցող ֆիքսված լայնությամբ կայքէջի հետ, հարմարեցված մոտեցում նշանակում է, որ դուք կարող եք թողնել այն չափը, որ կայքը նախատեսված է անձեռնմխելի եւ լրացուցիչ հարմարվողական ընդմիջումներով: Որոշ դեպքերում, եթե նախագծի բյուջեն փոքր է, եւ եթե այն ընդգրկում է միայն փոքր քանակությամբ զարգացման աշխատանք, կարող եք ընտրել միայն նոր adaptive breakpoints ավելացնել փոքր էկրանին / բջջային կենտրոնի չափերի համար: Սա նշանակում է, որ դուք թույլ կտաք ավելի մեծ էկրաններ օգտագործել բոլորը, նույն դասավորությունը, թերեւս, 960-ը:

Աջակցող մոտեցման հակվածությունն այն է, որ դուք կարող եք ավելի լավ օգտագործել լռելյայն կայքի կայքի կոդը, սակայն downsides- ն այն է, որ դուք ստեղծում եք տարբեր դասավորության կաղապարներ, որոնք ընտրում եք աջակցելու համար: Սա, որը կարող է ազդել աշխատանքային ծանրաբեռնվածության վրա, պահանջվում է երկարատեւ լուծում մշակել եւ պահպանել:

Դիզայնի վերահսկում

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

Օրինակ, կայքը կարող է հիանալի տեսք ունենալ 1400 պիքսել լայն էկրանի ձեւաչափով, 960 պիքսելների միջին էկրանին, իսկ փոքրիկ էկրանը, 480 փիքսել, բայց ինչ վերաբերում է այդ չափերի երկրների միջեւ: Որպես դիզայներ, դուք քիչ բան չունեք այս չափերի միջեւ վերահսկելու եւ էջի տեսողական տեսքը այդ չափերի մեջ հաճախ ավելի քիչ է, քան իդեալական:

Հարմարվող կայքի հետ դուք ունեք շատ ավելի նախագծային հսկողություն, որոնք օգտագործվում են տարբեր դասավորությունների վրա, քանի որ դրանք հաստատված չափերի հիման վրա են, որոնք հիմնված են ձեր կայացած հանգույցների վրա: Այն անհարթող երկրների միջեւ այլեւս խնդիրներ չեն ծագում, քանի որ ուշադիր եք մշակել յուրաքանչյուր «նայեք» (այսինքն `յուրաքանչյուր ընդմիջման ցուցակի ցուցադրում), որը կներկայացվի այցելուներին:

Քանի որ գրավիչ է, քանի որ կարող եք հնչել նախագծային հսկողության այս մակարդակը, դուք պետք է տեղյակ լինեք, որ այն գին է: Այո, դուք լիարժեք վերահսկողություն ունեք յուրաքանչյուր հանգույցի տեսքից, բայց դա նշանակում է, որ դուք պետք է ներդնեք նախագծման ժամանակահատվածը, որը նախատեսված է յուրաքանչյուր յուրահատուկ դասավորության համար: Որքան ավելի շատ խոչընդոտներ եք նախընտրում նախագծել, այնքան ավելի շատ ժամանակ պետք է ծախսեք այդ գործընթացին:

Աջակցության լայնությունը

Թե արձագանքող եւ հարմարվող վեբ դիզայնը բավականին ուժեղ աջակցություն է ստանում, հատկապես ժամանակակից բրաուզերում:

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

Հաճախակի կայքերը եւ լրատվամիջոցների հարցումները, որոնց ուժերը նրանց լավ աշխատելու են բոլոր ժամանակակից բրաուզերում: Միակ խնդիրները, որոնք ունենալու են Internet Explorer- ի ամենահին տարբերակները, քանի որ 8-րդ եւ ներքեւի տարբերակները չեն աջակցում լրատվամիջոցների հարցումները : Սրա շուրջ աշխատելու համար , հաճախ օգտագործվում է Javascript պոլիֆիլ , ինչը նշանակում է, որ Javascript- ում կախվածություն կա, առնվազն, IE- ի այդ հնացած տարբերակների համար: Կրկին, սա կարող է ձեզ համար անհանգստություն առաջացնել, հատկապես, եթե ձեր կայքի վերլուծությունը ցույց է տալիս, որ դուք չեք ստանում շատ այցելուներ, օգտագործելով այդ նախկին բրաուզերի տարբերակները:

Ապագա բարեկամությունը

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

Նայելով սարքի լանդշաֆտի անհավատալի բազմազանությանը (օգոստոս ամսվա դրությամբ, շուկայում 24,000-ից ավելի հստակ Android սարքեր), ունենալով այն ամենը, ինչն իր լավագույնն է ներդնում այս էկրանների լայն տեսականի, չափազանց կարեւոր է ապագա բարեկամության համար: Դա այն պատճառով է, որ այդ լանդշաֆտը քիչ հավանական է, որ հետագայում ավելի քիչ բազմազան լինեն, ինչը նշանակում է, որ կոնկրետ էկրանների կամ չափերի նախագծումը անհնար է դառնում, եթե մենք արդեն չհասնենք այդ իրականությանը:

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

Կատարումը

Պատասխանատու վեբ դիզայնը վաղուց արդեն մեղադրվել է (անարդարացիորեն շատ դեպքերում) `բեռնվող արագության / գործունեության տեսանկյունից աղքատ լուծում լինելու համար: Սա մեծապես պայմանավորված է նրանով, որ այս մոտեցման վաղ օրերին բազմաթիվ վեբ դիզայներներ պարզապես փոքրիկ էկրանի լրատվամիջոցների հարցումները ուղղել են կայքի գոյություն ունեցող CSS- ին: Սա ստիպեց պատկերները եւ ռեսուրսները, որոնք նախատեսված են ավելի մեծ էկրանների համար, որոնք պետք է մատակարարվեն բոլոր սարքերի վրա, նույնիսկ եթե այդ փոքր էկրանները չօգտագործեն դրանք վերջնական դասավորություններում: Հիանալի դիզայնը երկար ճանապարհ է անցել, քանի որ այդ օրերը եւ իրականությունն այն է, որ այսօրվա որակական պատասխանատու կայքեր չպետք է տառապում կատարողականի խնդիրներից:

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

Ծայրահեղ դրսից

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

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

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

Որ մոտեցումն է ավելի լավ:

Երբ խոսքը վերաբերում է հարմարվողական վեբ դիզայնի հետ, չկա հստակ «հաղթող», թեեւ պատասխանողը, իհարկե, ավելի հայտնի մոտեցում է: Իրականում, «ավելի լավ» մոտեցումը կախված է կոնկրետ ծրագրի կարիքներից: Բացի այդ, սա չի պահանջվում լինել «կամ / կամ» իրավիճակ: Կան բազմաթիվ վեբ մասնագետներ, որոնք կառուցում են այն կայքերը, որոնք համատեղում են լավագույն պատասխանատու վեբ դիզայնը (հեղուկի լայնությունները, ապագա աջակցությունը) հարմարեցված դիզայնի ուժեղ կողմերի հետ (ավելի լավ նախագծային հսկողություն, կայքի ռեսուրսների խելացի բեռնումը):

Commonly known as RESS (Responsive Web Design with Server Side Components), այս մոտեցումը ցույց է տալիս, որ իսկապես չկա «մեկ չափսը համապատասխանում է բոլոր լուծմանը»: Նպատակը եւ վեբ դիզայնը եւ հարմարվողականությունն ունեն իրենց ուժերն ու մարտահրավերները, ուստի անհրաժեշտ է որոշել, կաշխատի լավագույնը ձեր կոնկրետ ծրագրի համար, կամ եթե հիբրիդ լուծումը կարող է իրականում ձեզ համար հարմար լինել: