Дизајн мобилних веб страница је компликован, јер једна мобилна верзија веб-локације можда није компатибилна са свим уређајима. Дизајнери морају бити свјесни најбољих пракси дизајна како би ваше мобилно присуство било смислено и вриједно.
Постоји стална дебата међу Веб програмерима о томе који је начин стварања веб странице која је оптимизирана за мобилне уређаје најбоља. Постоје три водеће методе за развој мобилног веб сајта.
Су:
- Одговарајући веб дизајн.
- Намјенске мобилне веб-локације.
- РЕСС: Програмирање на страни сервера доноси ЦСС и ХТМЛ, у зависности од типа уређаја.
Свака метода има своје предности и мане. Веб програмер мора бити свјестан сваке технике за имплементацију најбољег за ситуацију.
3 начина за дизајнирање мобилне веб странице
Одговарајући веб дизајн (РВД)
РВД се ослања на ЦСС3 медијске упите како би ускладио изглед веб странице са величином површине за гледање уређаја. Исти ХТМЛ код се користи за представљање различитих изгледа веб страница за таблете, мобилне уређаје, столна рачунала и друге гаџете.
Предности:
- Ваш сајт ће имати сличан садржај и ХТМЛ ознаку, тако да ће мобилни посетиоци имати исто искуство, без обзира на врсту уређаја који користе.
- Један УРЛ олакшава корисницима повезивање и дељење садржаја. (Ако је веб страница доступна под више од једне УРЛ адресе, корисници могу постати збуњени.)
Недостаци:
Није могуће засебно оптимизирати мобилни садржај. Стога, дизајнер који користи РВД не може прилагодити садржај посебно за мобилне кориснике.
Према подацима из јануара 2013. из ХТТП архиве, просечна веб страница је око 1.3 МБ. Међутим, већина РВД локација је релативно већа. Ова већа величина смањује перформансе мобилних сајтова, што их чини споријим.
Корисници мобилне телефоније више су прилагођени моделима дизајна корисничког интерфејса специфичним за мобилне уређаје. Штавише, мобилни корисници су навикли на вишеструке задатке. Осим ако се структура за навигацију не прилагођава за одређене уређаје, корисници се могу суочити са проблемима када покушавају да остваре неколико задатака истовремено.
Дедицатед Мобиле Ситес
Овај метод побољшава искуство мобилних корисника креирањем потпуно засебне веб локације.
Предности:
- Једноставност управљања: Потребне су засебне измене за мобилне и радне површине. Направљене измене су ограничене на сваку одговарајућу верзију. То значи да се измјенама намијењеним мобилној платформи не може приступити с радне површине.
- Док развијате веб-сајт за мобилне уређаје, постаје лакше да га поједноставите и оптимизујете посебно за ту публику.
- Структура садржаја и навигације може се прилагодити мобилним корисницима.
Недостаци:
Дељење веб странице преко друштвених медија постаје све теже, јер са наменским мобилним сајтовима постоји више УРЛ-ова за странице. Када корисници стоних кликну на УРЛ-ове за мобилне уређаје који се деле на платформама друштвених медија, они могу нехотице примити мобилну верзију сајта уместо верзије рачунара.
Да би се избегли проблеми са дуплирањем садржаја, Веб програмер мора да користи рел = ”алтернативе” и рел = ”цаноницал” мета тагове. Ако мобилни корисник претражује Гоогле и кликне на УРЛ адресу радне површине, корисник ће или видјети верзију радне површине или ће бити преусмјерен на мобилну верзију веб странице. Ако мобилна верзија не постоји, корисник ће добити поруку о грешци.
Стварање потпуно другачијег веб сајта за мобилне кориснике значи да ће сајт бити посебно прилагођен мобилним корисницима. Међутим, да би испунили ту сврху, Веб програмери морају да исеку функционалност и садржај, што се за њих испоставља као ноћна мора.
Респонсиве Веб Десигн+ Компоненте на страни сервера (РЕСС)
Овај метод зависи од програмирања на страни сервера да би се обезбедио прилагођени ХТМЛ и ЦСС за различите уређаје. Код за кориснике мобилних телефона ће се разликовати од кода корисника десктопа.
Главни циљ ове имплементације је побољшање перформанси веб-локације. Овај метод добро функционише када се комбинира са одговорним веб дизајном. Према томе, ова имплементација се може назвати Респонсиве Веб Десигн + компоненте на страни сервера (РЕСС).
Предности:
- Структура навигације може се прилагодити за различите задатке које обављају десктоп и мобилни корисници.
- Програмери могу уклонити елементе странице из ХТМЛ-а и ЦСС-а како би постигли жељени приказ.
- Могуће је уклонити непотребан ЈаваСцрипт из ХТМЛ-а, што ослобађа ЦПУ ресурсе, меморију и кеш мобилних уређаја.
Недостаци:
- Динамички ХТМЛ повећава оптерећење на серверу.
- Не може се ослонити на детекцију уређаја.
- ХТМЛ и ЦСС су оптимизовани за мобилне перформансе. Десктоп верзија користи више ХТТП захтева и Јава скрипте.
Који метод одабрати?
Одлука о дизајнирању веб-локације оптимизиране за мобилне уређаје овиси о производима које продајете, циљаној публици, потребној инвестицији, вашој конкуренцији, стопама конверзије, итд. Метода дизајна која ће најбоље функционирати у великој мјери овиси о форматима заслона, оперативним суставима, прегледницима и резолуције.
Већина веб сајтова који се одликују дизајном се не имплементирају оптимално и као резултат, овим сајтовима треба више времена за учитавање. Пошто је конкуренција жестока, можете изгубити купце ако ваш сајт ради спорије. Корисник ће се једноставно пребацити на другу веб локацију која треба мање времена за отварање. Иако је могуће креирати веб странице са краћим временом учитавања са наменским мобилним сајтовима, постоје и различити недостаци везани за ову имплементацију.
РЕСС пружа предности РВД-а како би превазишао своја два главна недостатка. Главни недостатак РЕСС-а је да је детекција уређаја непоуздана. Морате често да тестирате нове уређаје да бисте осигурали да процес настави да функционише исправно.
Постоје сервиси као што су ДевицеАтлас, ВУРФЛ и други који могу открити нове уређаје. Биће од велике помоћи ажурирање нових уређаја у вашој бази података.
Мобилни веб дизајн је успешан само када је веб локација приказана на мобилном уређају. Иако је дизајнерима тежак задатак да представљају све битне дијелове десктоп странице у малом, мобилном прозору, свакодневно се појављују нове технике како би мобилне веб странице учиниле бољим, бржим и потпунијим.
Мобиле Вебсите Пхото преко Схуттерстоцка
15 Цомментс ▼