Ваш отдел интернет-маркетинга на аутсорсе
Работаем по KPI на продажи
15 сентября 2018

Современные тенденции
в веб-дизайне

Основ­ные трен­ды в дизайне сайтов

ДизайнРазработкаСайтыФирменный стиль
Декоративное изображение

Тенденции в веб-дизайне в 2018 году

Соглас­но отче­ту, сде­лан­но­му ком­па­ни­ей Netcraft, в 2014 году коли­че­ство сай­тов в мире пере­ва­ли­ло за отмет­ку в 1 мил­ли­ард. Каж­дый месяц эта циф­ра уве­ли­чи­ва­ет­ся более чем на 30 мил­ли­о­нов.  Но мно­гие сай­ты уста­ре­ва­ют еще до сво­е­го появ­ле­ния в интернете.

Как же это происходит?

Суще­ству­ет несколь­ко типов уста­ре­ва­ния сайтов:

  • Тех­ни­че­ское. Связа­но с появ­ле­ни­ем более совре­мен­ных мони­то­ров и ком­пью­те­ров.  Сюда же отно­сят тех­ни­че­скую опти­ми­за­цию: появ­ле­ние ана­ло­гов ста­рых пла­ги­нов, новые реше­ния в опти­ми­за­ции и откры­тия в сфе­ре IT.
  • Инфор­ма­ци­он­ное. Кон­тент на сай­те может мгно­вен­но терять свою акту­аль­ность, когда появ­ля­ет­ся новая инфор­ма­ция. Кро­ме того, со вре­ме­нем может исчез­нуть инте­рес к какой-либо теме.
  • Дизай­нер­ское. Каса­ет­ся внеш­не­го вида сай­тов. Сай­ты, сде­лан­ные несколь­ко лет назад, могут очень силь­но отли­чать­ся от того, что созда­ет­ся сей­час.  Конеч­но, не все сай­ты про­шлых лет выгля­дят уста­рев­ши­ми.  Но в веб-дизайне регу­ляр­но воз­ни­ка­ют новые тен­ден­ции,  внед­ря­ют­ся раз­ра­бот­ки в сфе­ре веб-про­грам­ми­ро­ва­ния и про­сто при­ду­мы­ва­ют­ся мод­ные фишки.

Веду­щие веб-дизай­не­ры мира спро­гно­зи­ро­ва­ли основ­ные направ­ле­ния в веб-дизайне на 2018 год. В про­шлом году в трен­де был мини­ма­лизм. В цен­тре вни­ма­ния был кон­тент без отвле­ка­ю­щих дета­лей: белый фон, боль­шие рас­сто­я­ния меж­ду бло­ка­ми, мини­маль­ное коли­че­ство цве­тов в оформ­ле­нии стра­ниц.  Сей­час про­гно­зи­ру­ет­ся дру­гая тен­ден­ция: сай­ты будут обрас­тать необыч­ны­ми дета­ля­ми, кото­рые долж­ны при­влечь   вни­ма­ния пользователя.

Анимация

«В мире, где все спе­шат, а вре­мя доро­го, ани­ма­ция может пере­дать слож­ные идеи за корот­кое вре­мя, в то же вре­мя при­вле­кая и инфор­ми­руя», – гово­рит интер­ак­тив­ный дизай­нер Крис Ганон.

Ани­ми­ро­ван­ные лого­ти­пы помо­га­ют ком­па­нии при­влечь вни­ма­ние к брен­ду, пока­зать боль­ше за корот­кое время.

Веб-ани­ма­ция Кри­са Гэннона

Описательное изображение

Описательное изображение

Описательное изображение

Описательное изображение

 

Интер­ак­тив­ная ани­ма­ция эле­мен­тов сай­та  ожив­ля­ет дизайн, улуч­ша­ет нави­га­цию по сай­ту и за счет это­го повы­ша­ет конверсию.

Изобретательная типографика

Совре­мен­ные веб-дизай­не­ры пре­вра­ща­ют типо­гра­фи­ку в мощ­ный инстру­мент для созда­ния потря­са­ю­щих сай­тов. Исполь­зо­ва­ние раз­лич­ных начер­та­ний более слож­ных шриф­тов, гра­ди­ент­ных цве­тов, соче­та­ние раз­лич­ных раз­ме­ров и начер­та­ний шриф­тов – все это созда­ет уни­каль­ные дина­мич­ные интерфейсы.

Описательное изображение

zipl.pro

 

Описательное изображение

icon-shop.be

 

Описательное изображение

finethought.com

 

Минимализм на плоскости

«Хоро­ший дизайн – это как мож­но мень­ше дизай­на», – счи­та­ет Дитер Рамс.

Начи­ная с 2000‑х годов, дизай­не­ры стре­ми­лись уйти от реаль­но­сти нача­ла раз­ви­тия интер­не­та и, похо­же, в сво­их ста­ра­ни­ях дошли до край­ней точ­ки. Плос­кий дизайн не умрет и в 2018 году, но будет обре­тать все новые оттен­ки и детали.

Так, на новых сай­тах тени будут более ожив­лен­ны­ми и мяг­ки­ми, и это не толь­ко повы­сит эсте­ти­ку стра­ниц, но и сде­ла­ет мно­гие эле­мен­ты более замет­ны­ми, что долж­но зна­чи­тель­но повы­сить конверсию.

Больше яркости и цвета

Рань­ше дизай­не­ры исполь­зо­ва­ли толь­ко «без­опас­ные» цве­та, кото­рые пра­виль­но отоб­ра­жа­ют­ся на любых устрой­ствах. Сей­час, с появ­ле­ни­ем совре­мен­ных мони­то­ров и дру­гих гад­же­тов с ярки­ми экра­на­ми, появ­ля­ет­ся воз­мож­ность силь­но раз­но­об­ра­зить палит­ру исполь­зу­е­мых цве­тов, это помо­га­ет более «тон­ко» созда­вать настро­е­ние и точ­нее направ­лять вни­ма­ние пользователя.

 

Использование пользовательских иллюстраций

Как пра­ви­ло, для оформ­ле­ния кон­тен­та исполь­зу­ют­ся сто­ко­вые фото­гра­фии. Что­бы при­дать сай­ту чер­ты уни­каль­но­сти, дизай­не­ры ста­ли исполь­зо­вать создан­ные ими уни­каль­ные иллю­стра­ции, и это одно­знач­но обес­пе­чи­ва­ет кон­ку­рент­ное пре­иму­ще­ство вла­дель­цам бизнеса.

Описательное изображение

playground.it

 

Описательное изображение

flowmapp.com

 

Макеты на основе стандартной сетки

Ранее дизай­не­ры, стре­мясь упро­стить и упо­ря­до­чить кон­тент, раз­ра­бо­та­ли так назы­ва­е­мую шаб­лон­ную сет­ку.  На нее ори­ен­ти­ру­ют­ся при раз­ра­бот­ке маке­тов – она при­да­ет сай­ту гар­мо­нию и логи­ку. Но при этом она же явля­ет­ся и огра­ни­че­ни­ем для твор­че­ства и неожи­дан­ных реше­ний. Конеч­но, это не зна­чит, что нуж­но пол­но­стью исклю­чить саму идею сет­ки, но тен­ден­ция тако­ва, что рас­тет коли­че­ство сай­тов, на кото­рых раз­лич­ные бло­ки с изоб­ра­же­ни­я­ми и тек­ста­ми будут пере­кры­вать друг дру­га, накла­ды­вать­ся или делить сайт на неров­ные части, нару­шая пра­ви­ла сет­ки. Созда­ва­е­мый при этом нестан­дарт­ный, но не менее гар­мо­нич­ный дизайн боль­ше при­вле­ка­ет вни­ма­ние поль­зо­ва­те­ля, луч­ше запоминается.

Описательное изображение

elegantseagulls.com

 

Описательное изображение

dada-data.net

 

Эффекты прокрутки

Парал­лакс и дру­гие ани­ма­ци­он­ные эффек­ты извест­ны и исполь­зу­ют­ся доволь­но дав­но. Сей­час все боль­шую попу­ляр­ность наби­ра­ют сай­ты, на кото­рых пере­хо­ды нерав­но­мер­ны: за счет это­го мож­но созда­вать инте­рес­ные вари­ан­ты пода­чи инфор­ма­ции и вести пользователя
по стра­ни­це зара­нее наме­чен­ным путем.

3dro.ps

В заключение

Мини­ма­лизм по-преж­не­му в трен­де. Ани­ма­ция, типо­гра­фи­ка раз­ви­ва­ют­ся даль­ше. Поль­зо­ва­тель­ские иллю­стра­ции наби­ра­ют попу­ляр­ность. Боль­ше цве­тов и ярко­сти поз­во­ля­ют под­черк­нуть инди­ви­ду­аль­ность. Новые эффек­ты про­крут­ки меня­ют прин­ци­пы юза­би­ли­ти, а стра­те­гия  mobile first  по-преж­не­му – осно­ва основ.

Труд­но пред­ска­зы­вать, какие имен­но тен­ден­ции ста­нут веду­щи­ми в 2018 году, но одно ясно точ­но – этот год ста­нет годом новых твор­че­ских реше­ний. Появит­ся мно­го совре­мен­ных тех­но­ло­гий, поз­во­ля­ю­щих сде­лать загруз­ку стра­ниц еще более быст­рой и лег­кой, а так­же повы­сить без­опас­ность и улуч­шить ком­форт про­смот­ра сай­тов с мобиль­ных устройств.

Мы любим дарить подарки!

Все способы получить клиентов из интернета: список из 30 каналов продаж в интернете с кратким описанием каждого.

Кейсы

Молодежный проект
«Инициативы Ямала»


Авто­ма­ти­за­ция 4 500 заявок

Подробнее Молодежный проект<br>«Инициативы Ямала»

Онлайн доставка
молочных продуктов
«Золотые луга»


Рост про­даж в 8 раз
Подробнее Онлайн доставка<br>молочных продуктов<br>«Золотые луга»

Ресторан баварской кухни
Brezelino


Выве­ли в онлайн

Поток зака­зов вырос с 10 до 40 в день

Подробнее Ресторан баварской кухни <br> Brezelino

Семейный гриль-ресторан Rancho


Запол­ня­е­мость ресто­ра­на вырос­ла на 20%

Подробнее Семейный гриль-ресторан Rancho

Интернет-магазин подарочных наборов
для детей Play Plan Box


Объ­ем про­даж вырос в 7 раз

Цена при­вле­че­ния кли­ен­та сни­же­на в 2 раза
Подробнее Интернет-магазин подарочных наборов <br> для детей Play Plan Box
Портфолио

Статьи и полезные материалы

Как рассчитать бюджет для теста канала продвижения
19 ноября 2021

Как рассчитать бюджет для теста канала продвижения

Какой объ­ем средств от при­бы­ли вы гото­вы тра­тить на при­вле­че­ние кли­ен­тов ежемесячно?

ВебвизорСайты
Ошибки при анализе сайта через вебвизор
15 июня 2021

Ошибки при анализе сайта через вебвизор

О раз­ра­бот­ке кон­цеп­ции сайта

ВебвизорДизайнСайты
Видеоконтент — не тренд, а необходимость. Пожалуй, это навсегда!
27 февраля 2021

Видеоконтент — не тренд, а необходимость. Пожалуй, это навсегда!

Как ани­ма­ция и видео­кон­тент повы­ша­ют кон­вер­сию сайта 

SMMПривлечение клиентов
Памятка по запуску продвижения в соцсетях
24 декабря 2020

Памятка по запуску продвижения в соцсетях

Про­дви­же­ние биз­не­са в соц­се­тях – поша­го­вая инструкция

SMM
SMM-маркетинг служб доставки пиццы и суши
7 сентября 2020

SMM-маркетинг служб доставки пиццы и суши

Про­дви­же­ние ресто­ра­нов: наше иссле­до­ва­ние мар­ке­тин­га служб достав­ки еды

SMMДизайнПривлечение клиентов
Что такое верстка сайта?
8 апреля 2020

Что такое верстка сайта?

Основ­ные кри­те­рии каче­ства верст­ки сайта

РазработкаСайты

Все статьи

Все сложно и непонятно?

Закажите обратный звонок — мы позвоним и все объясним