• Този имейл адрес е защитен от спам ботове. Трябва да имате пусната JavaScript поддръжка, за да го видите.
  • 0988 310 711

Интернет термини за сайт при изработка на сайтове

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

За съжаление голяма част от интернет сайтовете не са проектирани за такъв тип малки екрани, често те са ограничени в размера на компютърен дисплей или в най-добрия случай към лаптопен екран. Тенденцията за потребление на мобилен интернет ще надмине този на десктоп използване на Интернет в рамките още на тази година. С нарастването на потреблението на мобилен интернет идва въпросът как да се изгради уеб сайт, подходящ за всички видове екрани на потребителите. Отговорът на този въпрос е свързан с използването на адаптивен (отзивчив) уеб дизайн.

Какво е адаптивен или responsive дизайн ?

Responsive design или на роден един адаптивен дизайн е технологията, която прави възможно автоматичното преоразмеряване и преструктуриране на блокове и елементи от един сайт. Например от смартфон потребителите ще виждат съдържанието показано в един изглед от една колона; от таблет може да показва същото съдържание в две колони, но в две колони, а от лаптоп - в три колони. Адаптивен дизайн е практика на изграждане на уеб сайт, подходящ за работа на всяко устройство и всеки размер на екран, без значение колко е голям или малък, дали е мобилен или настолен.

Адаптивен или наречен още отзивчив дизайн е съвременен подход за създаване на уеб страници, с използването на гъвкави оформления, гъвкави снимки и различни медийни стилове спрямо размера на екрана. Целта на отзивчив дизайн е да се изградят уеб страници, които спрямо размера на екрана на посетителя автоматично да промени оформлението на сайт и съответно разположението на блоковете със съдържание. Тези промени са динамични, т.е. в реално време и са обект от уеб програмирането на самия уеб сайт.

Как действа адаптивния дизайн ?

Идеята е много проста - сайта се конструира в проценти от екрана. Всички елементи в страницата се обозначават в размер от общия екран, а не пиксели. Приема се че екрана е 100% и на всеки елемент му се задава ширина от този екран. Например ако имате ляво меню и дясно съдържание може да се зададе в следния ред: лявото меню да заема 25% от екрана, а дясната част с основното съдържание останалите 75%. Това е ОК за лаптоп, настолен компютър или пък таблет, но за смартфон може да е доста сбит текста в това разделение. Тук на помощ идва възможността да се проектира дизайна така, че ако екрана е по малък от 360 пиксела /което е валидно за смартфоните/ то лявата колона която е обозначена от 25% ширина или да бъде скрита и да не се визуализира за да може съдържанието от 75% да заеме целия екран за лесна четимост или пък другия подход - и двете колони да се преоразмерят на 100%, но да се заредят една под друга. Гъвкавостта е основното предимство на адаптивния дизайн. На практика след основния код и стил за визуализация на екрана се прави допълнителен код който указва кой елемент какъв процент да заема от екрана при различните му размери.

Друг пример на действие на респонзивния дизайн е ако си представите една начална страница на сайт с три колони. Всяка една колона от тях би следвало да бъде оразмерена като ширина 33% докато екрана е с размер на лаптоп или настолен компютър. Ако екрана бъде таблет, то в кода на сайта може да се укаже вече всяка колона да е с ширина 50% така че текстовете разположени в тези блокове да са по-видими в самия екран. При екран на сматфон колоните следва да станат със ширина 100% подредени една под друга. Ако не бъде приложена технологията на адаптивния дизайн при смартфон сайта ще изглежда като буболечка, за да се прочете даден текст трябва да се "увеличи" видимостта в една област и с издърпване наляво и надясно да се възприема целия сайт. Което прави невъзможно на практика приятното разглеждане на сайта. Изображения също се преоразмеряват автоматично спрямо размера на екрана.

 

Виц за отмора

Какво казва детето на програмист, като се роди?
Hello World!

Виолета и Син ООД, офиси: България, София и Русе, GSM 0988 310 711
Предмет на дейност: Уеб дизайн и темплейти за сайтове. Изработка на уеб сайтове. Изграждане на мобилни сайтове. Изработване на фирмени и корпоративни сайтове. Пълна организация и направа на онлайн магазини.