Какво е реагиращ уеб дизайн?

Съдържание:

Anonim

Питали ли сте се: „Какво е отзивчив уеб дизайн?“ Отзивчивият уеб дизайн е подход, при който дизайнерът създава уеб страница, която „реагира“ или се променя сама в зависимост от вида на устройството, през което се вижда. Това може да бъде голям настолен монитор, лаптоп или устройства с малки екрани като смартфони и таблети.

Отзивчивият уеб дизайн се превърна в основен инструмент за всеки, който има дигитално присъствие. С разрастването на смартфони, таблети и други мобилни компютърни устройства, все повече хора използват по-малки екрани за преглед на уеб страници.

$config[code] not found

Тези уебсайтове трябва да вземат предвид и индекса за мобилни устройства, който бе обявен от Google през април 2018 г. Тъй като все повече малки предприятия увеличават присъствието си на мобилни устройства, техният уебсайт, електронната търговия, страницата на Google Business, страниците на социалните медии и други активи трябва да бъдат лесно достъпни във всички устройства.

Какво е реагиращ уеб дизайн?

Целта на отзивчивия дизайн е да има един обект, но с различни елементи, които реагират различно, когато се гледат на устройства с различни размери.

Нека да вземем традиционния „фиксиран“ уебсайт. Когато се гледа на настолен компютър, например, уебсайтът може да показва три колони. Но когато прегледате същото оформление на по-малък таблет, това може да ви накара да превъртите хоризонтално, нещо, което потребителите не харесват. Или елементите могат да бъдат скрити от изгледа или да изглеждат изкривени. Въздействието също се усложнява от факта, че много таблетки могат да бъдат разглеждани или в портретна ориентация или обърнати настрани за пейзажен изглед.

На малък смартфон екран, уебсайтовете могат да бъдат още по-трудни за разглеждане. Големите изображения могат да „разрушат“ оформлението. Сайтовете могат да се забавят за зареждане на смартфони, ако са тежки графики.

Въпреки това, ако даден сайт използва отзивчив дизайн, версията на таблета може автоматично да се настрои да показва само две колони. По този начин съдържанието е лесно четено и лесно за навигация. На смартфон съдържанието може да се появи като една колона, вероятно подредена вертикално. Или може би потребителят ще има възможността да плъзга нагоре, за да види други колони. Изображенията ще преоразмеряват, вместо да нарушават оформлението или да се отрязват.

Въпросът е, че с отзивчив дизайн, уебсайтът автоматично се настройва въз основа на устройството, в което зрителят го вижда.

Как действа отзивчивият уеб дизайн?

Отзивните сайтове използват течни мрежи. Всички елементи на страницата се оразмеряват по пропорция, а не в пиксели. Така че, ако имате три колони, не бихте казали точно колко широк трябва да бъде всеки, а по-скоро колко широк трябва да е във връзка с другите колони. Колона 1 трябва да заема половината от страницата, колона 2 трябва да заема 30%, а колона 3 например 20%.

Медиите, като например изображенията, също се преоразмеряват относително. По този начин изображението може да остане в неговата колона или относителен елемент на дизайна.

Свързани въпроси

Mouse v. Touch: Проектирането за мобилни устройства също повдига въпроса за мишките срещу докосването. В настолните компютри, потребителят обикновено има мишката за навигация и избор на елементи. На смартфон или таблет потребителят най-често използва пръсти и докосва екрана. Това, което може да изглежда лесно да се избере с мишката, може да е трудно да се избере с пръст на малка точка на екрана. Уеб дизайнерът трябва да вземе под внимание “докосване”.

Графика и скорост на изтегляне: Също така има проблем с графиките, рекламите и скоростта на изтегляне. На мобилни устройства може да е разумно да се показва по-малко графики, отколкото за изгледи на работния плот, така че сайтът да не се зареди завинаги да се зарежда на смартфон. За по-малки реклами може да се наложи да бъдат разменени по-големи рекламни размери.

Приложения и „мобилни версии“: В миналото може да сте си помислили да създадете приложение за уебсайта си - да кажете приложение за iPad или приложение за Android. Или ще имате мобилна версия специално за BlackBerry.

Но с толкова много различни устройства днес става все по-трудно да създавате приложения и различни версии за всяко устройство и операционна платформа.

Защо малките предприятия трябва да преминат към отговорен уеб дизайн

Повече хора използват мобилни устройства. Неотдавнашно проучване на Pew 77% от американците вече притежават смартфони през 2018 г., което е само с 35% в първото проучване на собствеността върху смартфоните на Pew Research Center, проведено през 2011 г.

Проверете трафика си и може просто да бъдете шокиран от това колко посетители стигат до уебсайта ви чрез мобилни устройства. (В Google Анализ изберете „Аудитория“ от лявата страна, след това „Мобилен“, за да видите каква част от трафика е от мобилни устройства. Можете дори да прегледате кои устройства изпращат трафика.)

Отзивчивите шаблони за дизайн сега са навсякъде, за покупка. Ако, например, имате WordPress сайт, можете да посетите уважавана галерия с шаблони като ThemeForest и да потърсите “отзивчиви теми за WordPress”. След това вашият уеб програмист може да го персонализира за вашето лого и марка.

Забележка на редактора: Тук в Small Business Trends работим по нов отзивчив дизайн. Не трябва ли?

Снимка чрез Shutterstock

Повече в: Маркетинг на съдържанието, Какво е 95 Коментари ▼