Скоро Новый 2020 Год. Во всю идет подготовка к праздникам. Надо успеть всё: не только закончить старые дела, но и запланировать новые. Самое время познакомиться с трендами веб-дизайна и разработки на грядущий год и идти в ногу со временем. Мы выделили 5 интересных тенденций.
Содержание
Тренд 1: мобильная версия сайта приобретает всё большее значение
Сайты, совсем не адаптированные под просмотр на телефонах, уже в 2019 году можно было смело назвать допотопными. Но дальше больше: процент мобильного трафика уверенно продолжает набирать обороты и уже превышает 57%. А это значит, что отдельная дизайнерская проработка мобильной версии становится всё более необходимой.
Многие клиенты веб-студий (и даже сами студии) не до конца понимают разницу между адаптивной версткой и полноценной разработкой мобильной версии сайта.
Всё просто:
| Адаптивная верстка | Мобильная версия сайта | |
| Особенность | При варианте «адаптивная верстка» дизайнер не создает отдельный макет, чтобы показать, как сайт должен выглядеть на мобильных устройствах. В его задачу входит только десктопная версия сайта. То, как пользователи увидят сайт на телефонах, прорабатывается на этапе верстки. Это и называется адаптацией. | В случае создания мобильной версии разрабатывается отдельный дизайнерский макет для телефонов. Здесь учитываются все нюансы: мобильная и десктопная версия могут быть совершенно разными. |
| Плюсы | Плюс в том, что такой подход сокращает бюджет на разработку сайта. | Позволяет учесть потребности разных сегментов целевой аудитории, специфику интересов «мобильного» трафика. Повышает конверсию. |
| Минусы | Минус этого варианта в том, что дизайн мобильной версии фактически зависит от специалиста, чья основная задача — frontend-разработка. Это значит, что вносить корректировки он будет исходя из требований Bootstrap. | Делает разработку сайта дольше и дороже. |
Вывод: специалисты по веб-разработке рекомендуют сместить акцент с дизайна для десктопов на детальную проработку мобильной версии.
Тренд 2: темная тема на сайте
Уже в 2019 году многие разработчики самых популярных приложений дают пользователю возможность выбрать «темную тему» — светлый шрифт на черном фоне вместо традиционного варианта (темный на светлом). Вокруг удобства и функциональности ведутся споры, но факт «трендовости» темной темы совершенно неоспорим.
Тенденция стала массовой с выходом 13 версии мобильной операционной системы от Apple. Другие разработчики приложений стали «подтягиваться» вслед за общественным мнением, а вслед за этим нововведение коснулось и веб-сайтов. Изначально в воздухе витали такие преимущества использования темной темы как уменьшение нагрузки на глаза и сокращение расхода батареи. Однако и то, и другое при ближайшем рассмотрении имеют множество «но»:
- Темная тема действительно снижает нагрузку на глаза, но только при отсутствии достаточного освещения. При дневном свете всё происходит с точностью до наоборот.
- Экономия заряда батареи возможна только на устройствах с дисплеем по технологии OLED или AMOLED. Тогда как большинство экранов, к которым мы привыкли, изготовлены по технологии LCD.
Но мода остается модой. Высокий процент пользователей оценил темную тему и предпочел ее традиционной версии. В некоторых браузерах можно выбрать ее на уровне настроек: в этом случае она будет отображаться на всех сайтах, где предусмотрена разработчиками.
Вывод: при разработке веб-сайтов, на страницах которых люди могут проводить много времени, наличие темной темы — весомый плюс и показатель свежести дизайна.
Тренд 3: геймификация контента и интерактивность
Всё большую популярность набирает использование игровых и интерактивных элементов на промо-страницах, посвященных самым разным тематикам. Логика здесь ясна: элементы игры делают взаимодействие с контентом в десятки раз интереснее, дарят положительные эмоции и — как следствие — обеспечивают 100% усвоение информации и повышают конверсию.
Примеры использования геймификации и интерактивных элементов:
- Квизы, позволяющие осуществлять подбор товара посредством легкого, увлекательного тестирования: в качестве «награды» за прохождение теста пользователь получает подбор идеального для себя продукта, расчет стоимости, длительности, небольшие скидки.
- С помощью «игры» можно рассказывать о своем продукте. Например, предлагать пользователю «разбирать» его прямо на веб-странице при помощи графики и анимации. Или просто выдавать новую порцию информации в качестве «награды» за увлекательное действие — например, поиск необычного элемента («пасхалки») на веб-странице.
Вывод: геймификация и интерактивность — тренд 2020 года, внедрение которого повышает конверсию за свет живого взаимодействия сайта с пользователем.
Тренд 4: сторителлинг на всю катушку
Чтобы пользователи действительно воспринимали информацию, которую до них хотят донести предприниматели, а не пролистывали страницу, ни на чем не задержавшись, её подают в самых разных видах. Один из самых эффективных — сторителлинг или рассказывание историй. Этот закон давно известен в копирайтинге: обычный коммерческий текст читают неохотно. У информации, поданной в форме истории, есть шанс.
Секрет вот в чем: воспринимая историю, человек идентифицирует себя с ее героем, сопереживает ему — в общем, активно интересуется всеми деталями происходящего. Актуальной на 2020 год тенденцией веб-разработки можно считать целые веб-страницы и веб-сайты, поданные в форме сторителлинга: к увлекательному повествованию подключается не только текст, но и дизайн.
В качестве примера подобного подхода можно привести промо-сайт мобильного приложения «Р-банк», дизайн которого сделала студия Артемия Лебедева в 2017 году. Чтобы продемонстрировать возможности приложения, была создана целая семья с двумя детьми и своей историей. Персонажи были «как настоящие» и пользовались продуктом в своей реальной, обычной жизни.
Вывод: в 2020 году такая нестандартная и эффективная форма подачи информации как сторителлинг сохраняет актуальность и способна выгодно выделить бизнес на фоне конкурентов.
Тренд 5: стремление к простоте
«Сложные» сайты с нагромождением ненужных элементов продолжают уверенно отходить в прошлое. В 2020 году всё еще актуальны «легкие» дизайны с большим количеством свободного пространства. В идеале — лаконичные и дружелюбные по отношению к посетителю. Навязчивые и всплывающие элементы уступают место удобной навигации и «упрощению жизни» пользователя (подсказкам, предупреждающим ошибки; контактной анимации).
В соответствии с этим принципом выбираются цветовые гаммы. «Пестрые» страницы давно отошли в прошлое. В моде сочетание одного-двух акцентных насыщенных цветов с нейтральными, сдержанными тонами.
Вывод: в 2020 году актуальны сайты, дизайн которых лаконичен и максимально функционален, не перегружен лишними деталями.