Разлике између одзивног и прилагодљивог Веб дизајна

Упоређивање два различита приступа Веб дизајну са више уређаја

Одговарајући и адаптивни веб дизајн представљају методе за креирање пријатељских веб локација са више уређаја које добро функционишу на различитим величинама екрана. Док Гоогле препоручује одговарајући веб дизајн и што је популарнији од два приступа, оба ова метода за веб дизајн мулти-уређаја имају своје предности и њихове слабости.

Хајде да погледамо разлике између одговарајућег и прилагодљивог веб дизајна, посебно фокусирајући се на ове кључне области:

Неке дефиниције

Пре него што уђемо у паралелно упоређивање адекватног и прилагодљивог веб дизајна, хајде да узмемо тренутак да погледамо дефиницију ове две приступа на високом нивоу.

Одговарајуће веб странице имају распоред течности који се мења и прилагођава без обзира на величину екрана која се користи. Медијски упити дозвољавају одговарајућим местима да се чак и мењају "на путу" ако се претраживач промени величину.

Адаптивни дизајн користи фиксне величине засноване на унапред утврђеним тачкама прекида да испоручи најпогоднију верзију распореда за величину екрана која се детектује када се страница прво учита.

Са овим широким дефиницијама, пређимо на кључне области фокуса.

Једноставност развоја

Најзначајнија разлика између адекватног и прилагодљивог веб дизајна је на начин на који се ова рјешења примјењују на веб страницу. Будући да одговарајући дизајн ствара комплетан изглед текућине, најбоље се користи на пројектима у којима редизајнираш страницу одоздо . Покушај да поновите код постојећег веб сајта да постане одговоран је често напорна афера јер једноставно немате ниво контроле које бисте имали ако сте развили тај код из нуле и узимајући одговарајући дизајн у обзир за најраније фазе тог процеса . То значи да када надоградите сајт како бисте били одговорни, ви сте приморани да направите компромисе како бисте остали у оквиру постојеће кодне базе.

Ако радите на постојећој веб локацији са фиксном ширином, адаптивни приступ значи да можете оставити величину да је страница дизајнирана за нетакнуте и додати на додатне адаптивне прекидне тачке по потреби. У неким случајевима, уколико је буџет пројекта мали, а ако ће се примијенити само мали број развојних радова, можете одабрати само додавање нових адаптивних тачака за мање величине екрана / мобилних центричних. То значи да бисте дозволили већим екранима да сви користе исти изглед - можда верзија 960 за прекидање, за коју је та локација вероватно била првобитно намењена.

Горња страна прилагодљивог приступа је да можете боље искористити код постојећег сајта, али један од недостатака је тај што креирате различите предложене поставке за сваку тачку прекида коју изаберете да подржите. Ово ће имати утицај на радни терет потребан за развој и одржавање овог рјешења на дуги рок.

Контрола дизајна

Једна од предности веб локација јесте да њихова флуидити дозвољава да се прилагоде и подржавају све величине екрана, а не само унапред постављене тачке прекида одређене у адаптивном приступу. Реалност је, међутим, да су одзивне странице можда одличне на одређеним величинама екрана (обично величине које одговарају популарним уређајима доступним на тржишту), али визуелни дизајн често се разбија између тих популарних резолуција.

На пример, локација може изгледати сјајно на распореду широког екрана од 1400 пиксела, на средњем екрану величине 960 пиксела, а на малом екрану 480 пиксела, али шта је са међусобним статусима ових величина? Као дизајнер, немате никакву контролу над овим међу-величинама, а визуелни изглед странице у тим величинама често је мање од идеалног.

Са прилагодљивом вебсајном, имате много више контроле дизајна у односу на различите распореде који се користе, јер су фиксне величине засноване на вашим утврђеним тачкама прекида. Те неуобичајене државе у медјувању више нису проблем јер сте пажљиво дизајнирали сваки "изглед" (што значи сваки приказ бреакпоинт-а) који ће се испоручити посетиоцима.

Пошто је овај ниво контроле дизајна можда атрактиван, морате бити свјесни да долази по цени. Да, имате потпуну контролу над изгледом свих тачака прекида, али то значи да морате уложити време дизајна које је потребно за дизајн за сваки од тих јединствених распореда. Што више тачака прекида које изаберете да дизајнирате, то ће вам више времена бити потребно за тај процес.

Ширина подршке

Реагујући и адаптивни веб дизајн ужива веома добру подршку, посебно у модерним претраживачима.

Адаптивне веб локације захтевају компоненте сервера или Јавасцрипт за детекцију величине екрана. Очигледно је да ако је за адаптивни сајт потребан Јавасцрипт, то значи да је претраживачу потребно да је омогућено како би та страница исправно функционисала. То можда није битна брига за вас јер ће већина људи имати Јавасцрипт у својим прегледачима, али у било ком тренутку сајт има критичну зависност од било чега, треба истаћи.

Одговарајуће веб странице и медијски упити који ће их моћи добро ће радити у свим модерним претраживачима. Једини проблеми које ћете имати су са најстаријим верзијама Интернет Екплорера јер верзије 8 и ниже не подржавају медијске упите . Да би се ово радило, често се користи полифиль Јавасцрипт , што значи да постоји и зависност од Јавасцрипт-а, бар за оне застарјеле верзије ИЕ-а. Опет, ово можда није баш забрињавајуће за вас, посебно ако анализа сајта показује да не примате многе посетиоце користећи старе верзије прегледача.

Будућа пријатност

Природна природа одговарајућих сајтова даје им предност над адаптивним сајтовима када је у питању будуцност. Ово је због тога што та одзивна места нису изграђена да би се прилагодили само раније утврђеном сету прекидача. Они се прилагоде тако да одговарају свим екранима , укључујући оне које можда и данас нису на тржишту. То значи да одзивне странице неће морати бити "фиксне" ако нова резолуција екрана одједном постане популарна.

Гледајући у невероватну разноврсност уређаја (од августа 2015. године, на тржишту је било више од 24.000 различитих Андроид уређаја), који поседује сајт који ће учинити све што је могуће да одговори овом широком спектру екрана је критично важан за будућност. Ово је због тога што тај пејзаж вероватно неће постати мање разнолик у будућности, што значи да дизајнирање за одређене екране или величине постаје немогуће, ако још нисмо достигли ту стварност.

Са друге стране овог сценарија упоређивања, ако је веб локација прилагодљива и не одговара новим резолуцијама које могу постати важне на тржишту, тада можете бити присиљени да додате тај прекидач на странице које сте креирали. Ово додаје време дизајна и развоја на пројекте и то значи да се ова адаптивна мјеста морају доследно пратити како би се осигурало да на тржиште не буду уведене нове тачке прекида који се морају додати на локацију. Опет, са разноликошћу уређаја који је оно што јесте, стално провјеравање нових величина и могућност прилагођавања новим тачкама прекида је текући изазов који ће имати утјецаја на рад који морате поднијети за локацију и трошкове тог одржавања за компанију или организацију за коју је сајт намењен.

Перформансе

Одговарајући веб дизајн је дуго оптужен (неправедно у многим случајевима) што је лоше решење са становишта брзине преноса / учинка. Ово је у великој мјери резултат чињенице да су у раним данима овог приступа многи веб дизајнери једноставно пребацивали медијске упите на мали екран на постојеће ЦСС-ове странице. Ово је присилило да се слике и ресурси намењени за веће екране испоручују на све уређаје, чак и ако ти мањи екрани не користе их у завршном распореду. Одговарајући дизајн долази дуг пут од тих дана, а реалност је да квалитетно одзивне локације данас не трпе проблеме са перформансама.

Спора брзина преноса и надувани веб сајтови нису одговарајући веб сајт проблем - то је проблем који се може наћи на свим веб страницама. Слике које су превише тешке, храњене су из друштвених медија, прекомерне скрипте и још много тога, те тежак сајт на доле, али се могу поставити и одзивне и прилагодљиве веб странице које се брзо учитавају. Наравно , они се такође могу конструисати на начин који не чини учинак приоритетом, али то није особина самог рјешења, него рефлексија тима који је био укључен у развој саме локације.

Беионд Лаиоут

Један од најважнијих аспеката адаптивног веб дизајна је да не поседујете само контролу над дизајном сајта за постављене тачке прекида, већ и ресурсе који се испоручују за те верзије сајта. На пример, то значи да се ретина слике могу послати само на мрежњаче, док екрани без ретина добијају одговарајуће слике које су мање у величини датотеке. Остали сајтови (датотеке Јавасцрипт, ЦСС стилови, итд.) Могу се паметно испоручивати само када су они потребни и биће коришћени.

Ова употреба адаптивног веб дизајна иде даље од једноставне једначине "ако надограђујете веб локацију, прилагодљиви могу бити лакши приступ за кориштење." Сви сајтови, укључујући и комплетне редизајн, могу имати користи од паметнијег приступа до прилагођеног искуства.

Овај сценарио показује нијансирану природу ове "одзивне и прилагођене" дебате. Иако је тачно да адаптивни приступ може бити боље прикладан него одговарајући за ретрофитне локације, то може бити и одлично рјешење за потпуну редизајн. Слично томе, у неким случајевима, приступни приступ се може додати на постојећу базу кодова, дајући ту локацију све предности потпуно приступљивог приступа.

Који је приступ бољи?

Када је реч о прилагодљивом прилагођеном веб дизајну, не постоји јасан "добитник", иако је одзив наизменично популарнији приступ. Заправо, "бољи" приступ зависи од потреба конкретног пројекта. Штавише, то не мора бити "или / или" ситуација. Постоји велики број веб професионалаца који граде сајтове који комбинују најбоље одзиван веб дизајн (ширину текућине, будућу подршку) са снагама адаптивног дизајна (боља контрола дизајна, паметно учитавање ресурса локације).

Обично познат као РЕСС (Респонсиве Веб Десигн витх Сиде Сиде Цомпонентс), овај приступ показује да стварно нема "једне величине која одговара свим рјешењима". Оба одзива веб дизајна и прилагодба имају своје снаге и њихове изазове, тако да морате одредити који најбоље ће радити за ваш специфичан пројекат, или ако вам хибридно решење уствари одговара.