Веб-дизајн

Из Википедије, слободне енциклопедије
(преусмерено са Веб дизајн)

Веб-дизајн (енгл. Web design) представља графичко осмишљавање или дизајнирање Интернет странице користећи слике, језик за означавање и формирање HTML, стандардизацију и употребљивост странице.

Веб-дизајн је широк појам који обухвата различите вештине, стандарде и дисциплине који се користе у производњи и одржавању интернет страница. Области веб-дизајна обухватају; веб и графички дизајн, дизајн интерфејса, ауторинг, укључујући стандардизовани код, корисничко окружење и оптимизацију за веб-претраживаче. Многи појединци најчешће ће радити у тимовима који покривају различите аспекте процеса пројектовања, док ће други веб-дизајнери самостално покрити све области. Израз веб-дизајн се обично користи да опише процес дизајна који се односи на предњи део (изглед странице) и пројектовање веб-сајта укључујући писање кода. Раширена је погрешна претпоставка да под тај појам спада и развој Интернет софтвера (енгл. Web development), иако су у суштини то две сасвим различите области. Од веб-дизајнера се очекује да задовоље потребне услове изгледа и функционалности веб-сајта, уколико њихова улога подразумева и писање кода потребно је да буду у току са веб-стандардима.

Историја (1988—2012)[уреди]

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

Почетак веба и веб-дизајна[уреди]

Године 1989, док је радио у ЦЕРН, Тим Бернерс-Ли је наговестио стварање глобалног хипертекст транспорт протокола, који је касније постао познат као Светска мрежа (енгл. World Wide Web), W3, WWW). У раздобљу од 1991. до 1993. настала је Светска мрежа. Странице које у себи садрже само текст могу се прегледати помоћу једноставне линије мод (промптног) прегледача.

Марк Андрисен и Ерик Бина su 1993. године, створили су Мозаик претраживач. У то време било је више претраживача, међутим већина њих били су направљени на платформи Уникса и били су оптерећени текстом. Није било интегрисане подршке графичких елемената дизајна као што су слике или звукови. Мозаик прегледач био је осмишљен тако да разбије овај калуп. W3C је настала у октобру 1994, да „води Светску мрежу до свог пуног потенцијала кроз развој заједничких протокола који промовишу своју еволуцију и обезбеђују његову интероператибилност“. Ово је обесхрабрило компаније да монополишу прегледаче и програмске језике, који би могао мењати ефекат Светске мреже у целини. W3C наставља да поставља стандарде, који се данас могу видети попут ЈаваСkрипта. Године 1994. Андрисен формира корпорацију за комуникације. Она је касније постала позната као Нетскејп (Netscape Communications), Нетскејп верзија 0.9 претраживач. Компанија Нетскејп је створила сопствене ХТМЛ ознаке без додира са традиционалним процесом стандардизације. На пример Нетскејп верзија 1.1 поседовала је команде за мењање боја позадине и форматирање текста са табелама на веб страницама. Током 1996 до 1999 почели су први ратови претраживача на тржишту. У рату претраживача виђене су компаније Мајкрософт и Нетскејп које су се бориле за доминантан положај сопственог претраживача на тржишту. Током овог периода било је много нових технологија у овој области, посебно Листа Каскадних Стилова (ЦСС), Јаваскрипт и Динамички ХТМЛ. Читаво надметање на пољу прегледача довело је до многих позитивних остварења и помогло је да се веб-дизајн развија рапидно, константо брзим темпом.

Еволуција веб-дизајна[уреди]

Године 1996 компанија Мајкрософт објавила је свој први конкурентни претраживач, који је поседовао сопствене карактеристике и тагове. То је такође био први претраживач са подршком за листу каскадних стилова, који је у то време представљао непознате технике.ХТМЛ Ознаке за табеле, првобитно су биле намењене за приказивање табеларних података, међутим, дизајнери су брзо схватили потенцијал коришћења ХТМЛ табела за креирање комплексних мулти-колона и распореда који иначе нису били могући. У датом тренутку, дизајн и естетика имају примат над добром структуром, а мало пажње је посвећено семантици и веб приступачности. ХТМЛ сајтови су већ били ограничени у својим дизајнерским могућностима, а још више са ранијим верзијама ХТМЛ-а. Да би креирали сложене пројекте, многи веб-дизајнери морали су да користе компликоване структуре табела па чак и да користе празан ГИФ - слику како би направили размак у празним ћелијама табела.ЦСС правила су уведенау децембру 1996 од стране В3Ц организације како би подржала презентацију и распоред елемената; ово је дозвољавало ХТМЛ коду да буде више семантички него презентациони и на тај начин побољша веб приступачност. Године 1996 Флеш (првобитно познат као ФутуреСпласх) је развијен. У то време представљао је алат једноставног изгледа, али је омогућио веб-дизајнерима да иду и изван оквира ХТМЛ у том тренутку. Данас, Флеш је веома напредовао и развио се у веома моћан алат који има могућност да развије комплетне сајтове.

Крај првих ратова претраживача[уреди]

Током 1998 компанија Нетскејп објавила је НетскејпКомуникатор под лиценцом отвореног кода и на тај начин омогућила хиљадама програмера да учествују у побољшању софтвера. Међутим, они су одлучили да зауставе развој и почну од почетка, руководећи развој отвореног кода претраживача који се убрзо проширио на целу платформу апликација. [ 6]Пројекат Веб-стандардизације(WaSP) је формиран, а промовисао је компатибилност прегледача са ХТМЛ и ЦСС стандардима стварањем Ацид1 и Ацид2 и Ацид3 тестова. 2000 је била велика година за компанију Микрософт. Интернет Експлорер је објављен за Мак, ово је било веома значајно јер је он био први претраживач који у потпуности подржава ХТМЛ 4.01 и ЦСС 1, подизањем компатибилности бар у смислу поштовања стандарда. То је такође био први прегледач који је у потпуности подржавао ПНГ формат слика. Током овог временског периода Нетскејп је продат компанији АОЛ и то је сматрано као званични губитак рата Нетскејпа против Мајкрософта на тржишту прегледача.

Алати и технологије[уреди]

Веб-дизајнери користе низ различитих алата у зависности од производног процеса у који су укључени. Ови алати су ажурирани временом по најновијим стандардима и верзијама софтвера, али су принципи који стоје иза њих остали исти. Веб графички дизајнери користе векторску и растерску графику за креирање слика форматираних за веб или дизајн прототипа. Технологије које се користе за креирање веб-сајтова укључују стандардизоване ознаке које могу бити написане ручно или генерисани од стране ВИСИВИГ софтвера за уређивање. Постоји такође власнички софтвер базиран на додатцима (плуг-инс) који заобилази клијент верзију претраживача, то су често ВИСИВИГ, али са опцијом коришћења језика за скриптовање тог софтвера. Алати који служе за оптимизацију веб-сајта за претраживаче(СЕО), могу се користити за проверу рангирања страница и њиховом анализом предлагати побољшања. Остали алати које веб-дизајнери могу да користе укључују могућност употребе валидатора и друге алатке за тестирање употребљивости и приступачности како би осигурали да њихови веб-сајтови испуњавају смернице веб приступачности.

Вештине и технике[уреди]

Tипографија[уреди]

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

Изглед[уреди]

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

Флуид распореди су развијени око 2000, као замена за ХТМЛ табеле на бази распореда, као одбацивање заснованог [[грид дизајн]а и као дизајн принцип, као и техником кодирања, али су врло споро усвајани. Аксиоматска претпоставка је да ће читаоци имати екране на уређајима који употребљавају Виндовс, различитих величина и да не постоји ништа што би дизајнер могао да учини да то промени. Сходно томе, дизајн би требало да буде одвојен у јединице (сајдбар, блокови у садржају, подручја за рекламе, навигационе области) које се шаљу претраживачу, а које ће бити уграђене у екран-прозор прегледача. Како бровсер зна детаље о екрану читаоца (величина прозора, величина фонта у односу на прозор итд.) прегледач одрађује много бољи посао него веб-дизајнери. Упркос томе што такав приказ може често мењати релативну позицију главних јединица садржаја, много је боље када су измештени испод тела текста него по страни, а посебно је више употребљив екран од компромисног покушаја да се прикаже тешко кодирани грид елемент који се једноставно не уклапа у прозор уређаја. Конкретно, релативни положај садржаја блокова се може мењати, али сваки блок појединачно је мање погођен. Употребљивост је много боља, посебно у смислу избегавања хоризонталног скроловања.

Responsive (брзог одзива) веб-дизајн је нови приступ, заснован на ЦСС3 стандардима, и поседује дубљи ниво засебних спецификација по елементу изван каскадног стила странице, са бољом употребом ЦСС @медиа псеудо-селектора.

Квалитет кода[уреди]

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

Визуелни идентитет[уреди]

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

Корисничко искуство[уреди]

Корисници да би разумели сам веб-сајт, најважније је да разумеју на који начин он функционише. Ово укључује њихово корисничко искуство. Корисничко искуство односи се на разумевање распореда, јасних инструкција и маркирање елемената на веб-сајту. Корисници морају јасно разумети како могу да комуницирају на сајту. У односу на дужу употребу, корисници морају доживљавати корисност тог сајта, уколико желе да наставе да га посећују дуже време. Искуснији корисници који су боље упознати са коришћењем сајта, уколико доживе веб-сајт корисним, лаким за употребу и информативним, поново ће посетити сајт. Мање искусни корисници неретко ће видети предности или корисности у тим сајтовима. Веб-дизајнер треба да се фокусира на дизајн који је приступачан и подједнако разумљив искусним и мање искусним корисницима.

Види још[уреди]

Спољашње везе[уреди]