Прилагодљив веб дизајн

Prilagodljiv dizajn veb strane (engl. responsive web design, RWD) представља wеб дизајн који омогућава оптимизовано приказивање, једноставно коришћење, читање, и кретање кроз веб сајт који ће бити прегледан на различитим уређајима. Заправо то је техника која нам омогућава да једну веб страницу можемо прегледати на разним уређајима различитих резолуција. Прегледање веб странице која нема прилагодљиве карактеристике на уређајима са мањом резолуцијом може бити неугодна. Да би корисник дошао до тражених информација део свог времена изгубиће кретајући се кроз саму страну (скроловање, зумирање, померање). При креирању прилагодљивих веб страна садржај се прилагођава различитим ширинама уређаја коришћењем флуидних мрежа, флексибилних слика као и ЦСС3 медиа qуериес (технологија која нам омогућава да на различитим ширинама уређаја користимо различита ЦСС својства) и на тај начин пружа корисницима једноставније коришћење.

Концепт прилагодљивих веб страна

Мобилни уређаји пре свега, ненаметљив ЈаваСцрипт, прогресивно побољшање

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

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

Када wеб сајт мора да се приказује на мобилним уређајима који не подржавају ЈаваСцрипт, детекција претраживача као и детекција мобилног уређаја су неки од начина закључивања да ли се ХТМЛ и ЦСС својства подржана од стране неког уређаја. Међутим ове методе нису у потпуности поуздане све док се не користе у комбинацији са могућностима база података

Велики број мобилних уређаја као и ПЦ рачунара је способан да коришћењем разних ЈаваСцрипт фрејмворка (Модернизр, јQуерy, и јQуерy Мобиле) директно тестира способности претраживача, тачније њихову подршку за ХТМЛ/ЦСС. Коришћењем полифила може се постићи подршка за уређаје који се не придржавају стандарда у потпуност (нпр. Интернет Еxплорер). Функције детекције такође нису у потпуности поуздане. Неке од њих могу пријавити да су нека својства дозвољена када она заправо нису у функцији или су лоше имплементирана.

Технике при креирању прилагодљивих веб страна

Флуидне мреже

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

Флексибилне слике

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

ЦСС медиа qуериес

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

Изазови и неки од приступа

Луке Wроблеwски је направио сажету листу неких од прилагодљивих дизајна веб стране као и дизајнерских изазова за мобилне телефоне и направио каталог архитектуре различитих уређаја. Он сугерише да у поређењу са прилагодљивим дизајном веб стране РЕСС (респонсиве wеб десигн wитх сервер-сиде цомпонентс) пружа бољу оптимизацију за мобилне уређаје.

РЕСС је много скупљи за развој, захтева мново више од једноставне логике на клијентској страни, самим тим имплементирају га организације са већим буџетима.

Иако је изазов прилагодљивих wеб страна у последње време постао мали проблем, на неким местима и даље постоје проблеми у прилагодљивости. Неки од банера оглашивача као и видео снимци нису у потпуности прилагодљиви и тиме кваре концепцију саме стране. Иако компаније које се баве оглашавањем чине све што је у њиховој моћи како би циљали публику и уређаје које њихови корисници користе (приказују се разне велицине реклама на разним уређајима) овај проблем постоји.

Једна од алтернатива прилагодљивом дизајну wеб страна је метод прилагодљиве испоруке wеб страница који је усвојен од стране потрошача широм света. Иако је веома сличан прилагодљивом дизајну веб страна (РWД), метод прилагодљиве испоруке се разликује по томе што овај метод функционише на тај начин што сервер на коме се налази сајт детектује уређај, поставља захтев и користи информације о уређајима како би ми испоручио различите сетове ХТМЛ и ЦСС кодова, базираних на карактеристикама уређаја.

Данас постоји много начина за валидацију прилагодљивих wеб страна. Од разних валидатора мобилних сајтова и мобилних емулатора до симултаних алата за тестирање као што су Адобе Едге Инспецт. Конзоле претраживача Фирефоx и Гоогле Цхроме нуде одговарајући дизајн прозора који омогућава промену његове величине. Такође постоје разни додаци за претраживаче који омогућавају тестирање прилагодљивости.

Историја

Етхан Марцотте

Етхан Марцотте сковао је термин "прилагодљив веб дизајн" (енг респонсиве wеб десигн (РWД) ) маја 2010. године у чланку А Лист Апарт. Описао је како теоретску основу тако и практичну примену ове технике у креирању веб страна 2011. године у својој краткој књизи која се зове Респонсиве Wеб Десигн.

Масхабле је назвао 2013. годину годину прилагодљивог веб дизајна. Такође многи извори препоручују прилагодљив дизајн веб страна као исплативу алтернативу за креирање мобилних апликација.

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