С каждым годом увеличивается темп жизни, а вместе с ним растет и количество информации. Пользователи тратят все меньше времени на изучение сайтов, при этом число требований к ним возрастает. Инструменты привлечения внимания, которые были в топе еще год назад, теряют свою эффективность. Чтобы оставаться в тренде и создавать сайты под ключ , привлекающие клиентов, во время работы веб-дизайнерам стоит учитывать основные тенденции 2017 года. Какими они будут? Рассмотрим в этой статье.
Тенденции дизайна сайтов 2017:
- Одностраничные сайты
Эта тенденция становится все более распространенной, благодаря мобильным устройствам. Вся информация размещена на одной странице, которую удобно пролистывать на телефоне или планшете, не используя клики.
- Скроллинг
По-прежнему отличное решение для сайтов с однотипным контентом. Но не стоит забывать, что он добавляет вес странице и усложняет поиск среди уже пройденного материала, поэтому не рекомендуется для создания интернет-магазинов. Для оптимизации работы можно использовать совмещение классической навигации и скроллинга.
- Минималистичный дизайн
- Яркие цвета
Популярность ярких красок растет. Используйте больше палитр и оттенков, если желаете идти в ногу с модой. Для создания свободы пространства и ощущения воздуха можно использовать контрастные оттенки. Различные оттенки и градиенты цветов помогут лучше различать содержимое, которое они выделяют.
- Типографика
Шрифты по-прежнему являются сильным графическим элементом и играют одну из главных ролей в создании эстетики веб-страницы, вытесняя собой другие элементы. Хороший красочный заголовок также отлично смотрится с экранов планшетов и смартфонов и помогает донести информационное сообщение до пользователя.
- Анимация
Небольшие анимационные элементы и интерактивный дизайн приковывают внимание, делают сайт интереснее и улучшают взаимодействие пользователя с ним. А развитие JavaScript-библиотек позволяет упростить создание подобных страниц.
- Видео
На смену широкоформатным фоновым фотографиям приходит широкоформатное видео. Как и анимация, оно не только вызывает интерес со стороны пользователя, но и позволяет оживить страницу. Здесь главное использовать качественное изображение, соответствующее общей стилистике сайта. Видео помогает не только привлечь внимание зрителя, но и дает возможность донести до него информационное сообщение, например, рассказать о компании.
С каждым годом растет число сайтов, удивляющих и восхищающих новыми фишками в оформлении. Два года назад мы разместили переводную о трендах в веб-дизайне 2015. Что изменилось с тех пор? По-прежнему делается акцент на качественной графике и минимализме, крупных шрифтах и интерактивных элементах (например, скрытое меню). Однако технологии не стоят на месте, и веб-дизайнеры экспериментируют с динамикой, анимацией, расположением объектов на экране при этом не в ущерб производительности сайта. Предлагаем вашему вниманию обзор трендов, которые, по традиции, задают наши западные коллеги.
1. Принцип «mobile-first»
Название принципа говорит само за себя: дизайн разрабатывается, прежде всего, с учетом удобства просмотра на экранах мобильных устройств. Этот принцип не нов, но так как более 60% пользователей выходят в интернет именно со смартфонов, он стал определяющим в этом году. Поскольку экраны мобильных устройств имеют малые размеры, дизайнеры предусматривают максимально информативное, но при этом эффектное отображение контента. То же самое касается текстов - воде и пустым фразам в концепции «mobile-first» нет места.
2. Иллюстрации «от руки»
Это прекрасный способ оригинально передать идею или настроение. Нарисованные от руки иллюстрации уникальны, вносят разнообразие и нотки неформальности во взаимодействие пользователя с сайтом, делают дизайн теплым и дружественным.
Пример иллюстрации с сайта dropbox.com
Талантливые иллюстраторы могут создать изображения, которые наилучшим образом будут соответствовать бренду и фирменной стилистике, с их помощью можно добиться глубокой персонализации.
3. Анимация
Дизайнеры постепенно отходят от использования только статичных изображений и ищут новые способы вовлечения аудитории, чтобы выделиться на фоне других. Брендам нужна персонализация, и анимация, во многом благодаря развитию HTML5, CSS и jQuery, играет здесь не последнюю роль.
Анимация может быть реализована по-разному: от необычной полосы состояния загрузки, которая скрасит ожидание, до изменения внешнего вида объекта при наведении курсора. Также встречается полноэкранная анимация, которая является центральным элементом, фокусирующим внимание пользователя.
Но анимацию надо использовать взвешенно, чтобы углубить взаимодействие пользователя с сайтом, а не отпугнуть его. Ведь никто не захочет ждать просмотра основного контента, пока будет загружаться нелепая и бесполезная анимация - все должно выглядеть естественно, уместно и не отвлекать.
4. Смелые цвета
До недавнего времени специалисты рекомендовали использовать в дизайне лишь «веб-совместимые» цвета - те, которые не вызывают раздражения и не дают нагрузки на зрение. Сегодня все меняется - при грамотном использовании смелые цвета творят чудеса, превращая обычные сайты в яркие, сочные и запоминающиеся.
Пример использования смелых цветов на spotify.com
Яркие цвета - это способ персонализации в условиях глобальной моды на минимализм в дизайне. Вероятно, дизайнеры будут и дальше экспериментировать с палитрами, создавая уникальные градиенты и всплески цвета.
5. Необычный скроллинг и параллакс
В прошлом дизайнеры старались самую важную информацию разместить в части страницы, которую пользователь видит сразу после перехода на сайт. Сегодня же сложно определить, какая часть страницы будет «видимой», ведь переходы осуществляются с устройств с разным разрешением дисплея. Поэтому нужен другой подход.
Скроллинг, изначально необходимый для перемещения по странице вниз и вверх, сегодня креативно используется дизайнерами. При умелой реализации он становится универсальным инструментом подачи контента. Так, можно автоматически настроить показ и остановку видео или анимации при прокрутке, появление текста и изображений и т.п.
6. Асимметричные шаблоны
2016 год прошел под влиянием сетчатых шаблонов, а в 2017 году наметилась тенденция к использованию асимметричных и «рваных» шаблонов. Несмотря на то, что в подавляющем большинстве бренды предпочитают традиционные и понятные карточные UI-шаблоны (ведь они логичны и просты для ориентации), некоторые все же начинают экспериментировать для того, чтобы выделиться и отстроиться от конкурентов.
Пример асимметричного дизайна (isaidicanshout.com)
Асимметричный дизайн, созданный умелыми руками, отлично подходит для привлечения внимания к определенным частям страницы. Благодаря разным размерам шрифтов и расположению элементов можно правильно расставлять акценты на странице и направлять пользователей в нужное русло.
7. Тени
Сами по себе тени - это далеко не новшество в веб-дизайне. Одно время они были популярны, потом о них забыли. В чем же тогда тренд? В использовании огромных, порой даже гипертрофированных теней, отбрасываемых изображениями при наведении курсора.
Глубокие тени при наведении курсора на изображения (abduzeedo.com)
Такой подход позволяет в плоском шаблоне акцентировать внимание на активном элементе и вовлечь во взаимодействие. При этом создается эффект глубины - по таким изображениям приятно просто водить курсором.
8. Большие и жирные шрифты
Типографика - это еще один способ персонализации. Распространение устройств с высоким разрешением экранов делает шрифты читабельными и хорошо различимыми, поэтому дизайнеры все чаще экспериментируют с ними.
Пример использования крупного шрифта (bigyouth.fr)
9. Ультраминимализм
Минимализм давно стал определяющим трендом в веб-дизайне. Но некоторые идут дальше, убирая с сайтов любые намеки на декор, оставляя лишь самые важные для пользователей элементы.
Абсолютный минимализм (mathieuboulet.com)
В приведенном примере есть только указание «Scroll», ссылка на раздел «О Себе» и ссылки на профили в соцсетях. Далее при прокрутке уже идет портфолио дизайнера.
10. Микс горизонтального и вертикального текста
Изменение привычного горизонтального расположения текста «освежает» сайт и мотивирует прочитать, что же там написано.
Пример необычного направления текста (takewhatyoucancarry.com)
Обратите внимание, что микс сделан грамотно - здесь нет лишних сбивающих с толку элементов. Слово «take» написано вертикально - этого достаточно для фирменной подачи контента.
11. «Модуляция»
В этом случае текст должен контрастировать с фоновыми изображениями, чтобы они не сливались.
13. Двухцветность
В основе дизайна сайта лежит 2 базовых цвета. Смотрится это стильно и современно. Например, сайт Australian Design Radio выдержан именно в таком стиле:
14. «Геометрические» шрифты
В этом случае шрифты сочетаются с разнообразными геометрическими формами. Для этой цели подходят шрифты вроде Futura, ITC Avant Garde и Proxima Nova.
Пример использования «геометрических» шрифтов (hugeinc.com)
Выразительности, напористости и даже некой агрессивности сайту можно придать, используя очень жирные шрифты указанных выше семейств.
Подводим итоги
В 2017 году дизайнеры будут пытаться внести в привычный минимализм штрихи индивидуальности. Кто-то будет делать это с помощью цвета, кто-то - с помощью шрифтов, а кто-то - с помощью необычного расположения блоков.
При разработке и утверждении дизайна не забывайте главное правило - он должен быть удобен для пользователя и мотивировать совершить целевое действие. Уверены ли вы в производительности вашего ресурса. Об этом вам может рассказать отчет проведенного аудита сайта в службе “Персональный менеджер” SeoPult. Помимо аудита дизайна и юзабилити вы получите развернутый анализ технической составляющей, семантики, позиций по отношению к конкурентам и т. п. Все это поможет вам улучшить сайт и повысить его эффективность как инструмента продаж.
Каждый год мы узнаем что-то новое о дизайне и 2016 год не исключение. Статья, которую мы написали в прошлом году имела такой успех, что мы решили сделать некоторые прогнозы на 2017 год, так что давайте начнем!
Вышла новая статья → ← Читай и вдохновляйся!Тренды дизайна находятся под влиянием СМИ, технологий, индустрии моды и, в последнее время юзабилити. Тренд проявляется медленно, постепенно, проникая во все направления дизайна, а затем исчезает точно таким же образом. В основном дизайн тренды существуют не более чем один или два года. Дизайн в 2017 году продолжит тренды, которые появились в 2016 с добавлением некоторых новых изменений, это чувство хорошо известно и знакомо, и вы, возможно, заметили его в последние пару лет. Основное влияние остается за Google’s Material Design, с небольшими изменениями.
Какие тренды в веб-дизайне нас ждут в 2017 году
01. Полу плоский дизайн (Semi Flat Design)
Последние несколько лет плоский flat дизайн был самым популярным на рынке веб-дизайна, но теперь, под влиянием Material Design, он становится все более одномерным. Этот переход начинается с некоторых легких теней, что делает его полу плоским дизайном. Эволюция flat дизайна из стиля минимализм переходит в новые развивающиеся технологии. Плоский дизайн еще есть, но он претерпел некоторые улучшения.
Плавное затенение добавляет глубину и сложность, не разрушая ощущения плоского дизайна. Это новая функция добавлена во flat тренд и продолжит развиваться в 2017 году.
Проект: Resourсe | UI/UX Tool for Web Services
Авторы: Ruslan Latypov; LS Graphics; Anton Mishin; Valery Gurkov
Проект: Listener’s Playlist
02. Движущиеся фотографии (Cinemagraphs)
Синемаграфия это не те GIF анимации, которые мы видим в интернете по всюду. Синемаграфия — это все еще изображения с незначительными элементами движения. Эта техника делает простое фото более реалистичным.
03. Больше 3D (More 3D)
3D определенно движется в нашу сторону, и мы будем видеть это влияние во всех областях дизайна. С технологиями VR/AR быстро наращивается темп, эта область развивается довольно быстро.
Проект: LUV.IT
Проект: Open Annual Awards
Проект: Air Max ’17
Проект: NIKE F.C. | 3D Golden balls in the real world
Проект: Better You Brand
04. Анимации (Animations)
Анимация все больше и больше присутствует в web-дизайне, формат может быть любым — WebGL CSS, GIFs, SVG или видео. Анимация была одной из самых важных трендов веб-дизайна прошлого года, не стесняйтесь ее использовать.
Проект: Nickelodeon Kids Pick The President
Проект: AR Virtual Fitness Coach App
Проект: ZH OURO- Rio 2016
05. Одностраничные сайты/лендинги (Landing pages)
В 2017 году мы увидим рост одностраничных сайтов из-за их потенциала для целей маркетинга и их способности лучше таргетировать посетителей.
Если вам понадобится лендинг, то можете заказать его у меня →
06. Геометрические фигуры, узоры, линии и круги (Geometric Shapes, Patterns, Lines and Circles)
Этот тренд начался в 2016 году и безусловно продолжится в 2017. Вы можете персонализировать свой сайт, просто добавив некоторые современные фигуры, или плоские, или с мягкой тенью.
Проект:
Проект: DRAP.agency Branding
Проект: Pfizer — Active and 50+ for The New York Times
07. Смелые, яркие цвета (Courageous Colors)
Используйте яркие цвета чтобы выделиться. Material и flat дизайн хорошо сочетаются с яркими цветами. Вы можете использовать цветовую палитру, представленную Google, чтобы выбрать и сочетать цвета, которые вы хотите.
Проект: Edris — Logo Designed by MiLo
Проект: Rendered - Responsive Demo Website for Adobe
Проект: b2mach
08. Инновационный скроллинг и параллакс (Innovative Scrolling and Parallax)
Это отличная визуальная идея, которая добавит уникальности любому сайту. От параллакса из нескольких слоев к видео параллаксу, все возможно с плагином D.ex Multilayer Parallax (многослойный параллакс). Этот продукт разработан полностью студией Milothemes под руководством Loredana Papp и Mihai Baldean. Он доступен для покупки на Envato Market / codecanyon.net
Это WordPress плагин, который позволяет делать прекрасные Parallax блоки с более чем одним слоем. Будьте креативными и объединяйте слои в любом стиле, котором захотите. Мы сделали 12 различных примеров в гайде плагина, чтобы упростить ваше первое знакомство с прекрасным миром параллакса. Поиграйте со слоями!
09. Цветовые переходы/градиенты (Color Transitions)
Градиенты — один из главных трендов прямо сейчас. Транд начал набирать популярность с 2016 и продолжает быстро расти, после того как большие бренды, например Инстаграм решили изменить свое лого и картинки из одного цвета в многоцветный переход (градиент). От логотипов до кнопок или наложений на изображения (picture overlays), этот тренд по всюду.
10. Просмотры с мобильных устройств, адаптивный дизайн (Mobile Browsing (Responsive Design))
2015 и 2016 года привели к значительному увеличению просмотров с мобильных устройств. Планшеты и смартфоны теперь более приоритетны для просмотра веб-сайтов, они превосходят настольные компьютеры и ноутбуки — и этот тренд продолжается. Любой веб-сайт, который не имеет адаптивного веб-дизайна необходимо обновить как можно скорее!
Проект: Responsive Website Animation
11. Графика и иллюстрации сделанные на заказ (Custom Graphics and Illustrations)
Стоковые фотографии все еще довольно популярны, но наметился новый тренд в 2016 и будет продолжать расти в 2017 году: использование выполненной на заказ графики и иллюстраций. Если вы хотите уникальный красивый сайт, что любой посетитель вас запомнил, сотрудничайте с digital дизайнерами. Таким образом, меньше стоковых фото и больше оригинальных, уникальных изображений.
12. Креативно используйте нейтральное пространство и сетку (Creative Use of Neutral Space and Grid)
Последние года веб-дизайн был более расположен к упорядоченным, организованным столбцам и сеткам, но в 2016 году мы могли наблюдать значительный сдвиг в сторону нерегулярных слоев и ультра-современный дизайн.
13. Рассказывайте истории (Storytelling)
Веб-сайты в настоящее время начинают рассказывать истории, чтобы расположить к себе клиента. Людям, как правило, больше запоминаются истории, нежели чтение простой (сухой) информации.
Подробнее видео про сторителлинг от Бизнес молодости:
14. Постепенная загрузка контента (Lazy Loading)
Lazy Loading задерживает загрузку изображений на длинных веб-страницах, это позволяет информации появляться в определенной точке во время прокрутки вниз, что уменьшает время загрузки страницы.
15. Разделенный контент (Split Content)
Сплит контент сейчас популярен в адаптивном вебдизайне, это разделение экрана на 2 или более части. Такой сплит-экран сайта покажет зрителю несколько одинаково важных сообщений в одном блоке сайта. Этот тренд появился в 2015, но в 2017 году она будет расти и дальше и, скорее всего, его вы увидите на многих сайтах.
16. Формы на всю ширину (Full-Screen Forms)
Нет необходимости переходить на другую страницу для заполнения формы, поскольку новые сайты используют формы, растянутые на всю ширину, которые подстраиваются под адаптивный дизайн.
17. Видео по всюду (Videos Everywhere)
Видео контента стало больше за последний год, и люди стали более требовательны к высокому качеству видео. Видеоролик на сайте может быть коротким и поставлен на автоповтор, показывая продукт или масштабный кинематографический проект, который будет держать зрителя, вовлеченным в историю.
Проект: Hillsong
18. СЕО — важно! (SEO is Important)
СЕО является очень важным для сайта, так что красивый сайт без хорошего SEO останется в аутсайдерах.
19. Скрытая навигация (Hidden Navigation)
Гамбургер-меню создает много споров за и против, о том, как трудно для пользователей найти меню, но одно можно сказать точно — эта тренд останется, и люди в конечном итоге привыкнут к такому меню.
20. Маленькие детали дизайна (Tiny Design Details)
Фокус на деталях очень важен в этом году. Мелкие детали такие как навигационные точки и т.д. Фокус на мелких деталях сделает работу законченной.
Проект: Barometa — Next-generation Job Platform
21. Тренды в дизайне логотипов (Logo Design Trends)
21.1. Минимализм (Minimalist)
Все крупные бренды переходят к более простому, минимальному дизайну, и эта тенденция останется.
21.2. Нарисованные от руки (Hand drawn)
Этот тренд в центре внимания в течение последних лет, такой стиль отлично подходит для «хипстерского» бизнеса. Его используют для парикмахерских (barbers), кафе, ресторанов, искусства и крафтовых вещей.
21.3. Negative space
Это старый тренд, но в последние несколько лет мы видим, как он набирает обороты, и будет расти в 2017 году, так что определенно стоит к нему присмотреться.
21.4. Cropping
Более минималистично, чем этот тренд не бывает. Показывает только то, чего достаточно указать в логотипе, чтобы узнать компанию, и больше ничего.
21.5. Геометрия (Geometric)
Этот тренд из разряда Old school, но это один из тех стилей, который точно никогда не умрет.
21.6. Художественные линии (Line art)
Этот тренд популярен среди бизнеса нового поколения
Авторы: Sam Healy
; Andrea Schlaffer ; Jacek Janiczak
21.7. Паттерны, узоры (Pattern)
Паттерны — новый тренд, и это повторение является необычным способом, чтобы сделать бизнес запоминающимся и выделить его среди конкурентов. Это оригинальное направление может также использоваться в презентации логотипов.
Авторы: Nick Edlin; Stanislav Aleynikov; Lucas Gil-Turner
21.8. Анимированные логотипы (Animated logos)
Motion дизайн сегодня востребованный тренд, и мы можем его наблюдать во всех областях дизайна.
Авторы: Javier Miranda Nieto; The Woork Co
21.9. Винтаж (Vintage)
Винтажный стиль все еще в игре. Даже если этот тренд популярен в течении продолжительного времени, ему все еще есть что сказать.
Авторы: Роман Додонов; Mingo Ideas Up; Will Try Further
21.10. Цветовые переходы (Color Transitions)
Градиенты везде в этом году — и логотипы не исключение.
21.11. Иллюстрации в логотипах (Illustrations in logos)
Иллюстрации — хороший способ сделать уникальный и индивидуальный логотип для бизнеса. Они становятся все более популярными в этом году.
Авторы: Bodea Daniel; Jacek Janiczak
21.12. Фотография в логотипах (Photography in logos)
Сочетание картинки с типографикой сейчас очень популярно. Они очень хорошо работают вместе, и это создает контраст между ними.
22. Тренды в типографике (Typography Trends)
22.1. Большая, яркая и красивая типографика (Big, bold & beautiful typography)
Типографика, может быть, наиболее важный элемент в создании потрясающего дизайна. В этом году типографика будет смелой (жирным начертанием) и большой с выраженными заголовками.
Авторы: Alexander Laguta
Авторы: Quim Marin
Проект: Baugasm Series — Pack 4
22.2. Градиенты/цветовые переходы в типографике (Color transitions in typography)
Градиенты, без сомнений, это тренд сегодня, и вы найдете его также в типографике.
22.3. Визуальная иерархия (Visual hierarchy)
Иерархия в типографике важна в любом направлении дизайна. С помощью размера и ширины шрифта может легко обозначить, какие слова или заголовки являются приоритетными, так что используйте этот фактор при создании своих текстов. Вы также должны помнить, что вы можете достичь понятной визуальной иерархии с помощью расположения и цвета текста.
22.4. Tiny Typography (Мелкая типографика)
Очень маленький текст обычно окружен противоположным по цвету пространством, но вы можете создать визуальную разницу между цветом или картинкой, чтобы выделить текст. Вы можете также использовать анимацию, чтобы помочь тексту выделиться.
Авторы: Slava Oleinik; Bahaa Samir; Witty Digital
Проект: Baugasm Series — Pack 4
22.5. Анимация в типографике (Animated Typography)
Анимация сейчас используется везде, и типографика не исключение. Если вы используете моушн программы, то не прогадаете в этом году.
Проект: Gotham Pro Animated Typeface Free
22.6. Типографика с фотографией (Typography meets photography)
Сочетание между текстом и фотографией может дать отличный результат. Посмотрите на эти прекрасные примеры.
22.7. Геометрические формы и типографика (Geometric shapes and typography)
Геометрические формы могут хорошо сочетаться с типографикой, чтобы получить красивый вариант.
22.8. Шрифтовые сочетания (Font pairing)
Используйте два или более шрифта вместе. Это еще в тренде в 2017.
———————————
Ни для кого не секрет, что IT-индустрия развивается семимильными шагами. Новые технологии, новое железо, новые проекты. Не обошло стороной все это и веб-разработку. Сейчас уже далеко не те сайты, что были хотя бы пару лет назад. Довольно много вещей изменилось, и сейчас чуть подробнее.
Использование видео-фона
Казалось бы, фон уже давно используется. Но по-настоящему значимым фрагментом интерьера сайта он стал только в этом году. У многих пользователей вызывает настоящий «вау»-эффект.
Пример неплохой реализации видео-фона — http://globalmonitoring.ru/
Parallax-эффект
Еще одна, казалось бы, зажиточная концепция, но применяться начала повсеместно лишь недавно. Если кто не знает, это способ добавить объемные слои на сайт, заставить их двигаться как нужно вам. Иным словом, придать больше интерактивности.
Пример — https://www.grabandgo.pt/
JavaScript и библиотеки
Кстати об интерактивности. Вы видели в 2017 году хотя бы один сайт без js? я нет. И дело даже не в самом js, а в его библиотеках. Да, jQuery — крутая штука, но все топовые фронтендеры уже перешли на react.js, angular.js, vue.js и прочие библиотеки. Я и сам собираюсь в будущем изучать одну из них (вероятно, vue.js).
А куда вы хотели без js? Все эти прыгающие элементы, затемнения, плавные переходы и прочее — это все удобно реализовать через скрипты.
Адаптивность
То, о чем стоит поговорить отдельно, и мы обязательно поговорим. Адаптивный дизайн сайта — это тенденция даже не 2017 года. Это всеобщая тенденция последних лет. Я, будучи пользователем одной из фриланс-бирж рунета, ежедневно вижу заявки типа: «Создать адаптивный сайт» или «Сайт уже есть, нужен адаптив» и прочее. Люди понимают, что сейчас человечество гораздо больше времени проводит в смартфонах, нежели за компьютером, поэтому создание адаптивного сайта (с принципом Mobile First) — очень важная составляющая создания сайта в принципе.
Боты
Наверное, самый интересный пункт данной статьи — боты. Сейчас простые страницы мало кому нужны. Всей подавай интерактивности, живности сайту. Бот — своего рода помощник, который очень активно используется уже сейчас. Наиболее простые примеры — боты вконтакте и телеграм, которые сами отсылают вам какую-либо информацию по запросу или же без него. Это очень удобно для администраторов сообщества, где работает бот. Все быстро, красиво и автоматизированно.
Учитывая активное развитие технологий, наше общение с компьютером делается всё более естественным, и появляется возможность диалогового общения при помощи голоса. Поэтому будущее за голосовыми помощниками, но это уже следующее поколение приложений.
Кнопка призыва к действию должна являться ключевым элементом на любой странице. Сейчас довольно часто применяют слишком яркие раздражающие цвета. Но для акцента на кнопке СТА в 2017 году все чаще будет применяться простая анимацию, она не так раздражает, однако отлично выполняет свою функцию – привлечения внимания.
Помните, что главное не переборщить! Используйте в анимации плавные движения через несколько секунд, они привлекают внимание, но при этом не сильно раздражают. Мы рекомендуем добавить кнопку с призывом к действию в хэдер сайта для лучшего эффекта. И не только на сайте, добавляйте такие кнопки и в ваши рассылки!
Крупные фото, а тем более видео – всегда привлекают внимание. Более того сам видео сюжет может по-настоящему заинтересовывать посетителя.
Если это фоновое видео, то тогда вы имеете два в одном – это одновременно и фото и видео. Так как видео в качестве фона до сих применяют сравнительно редко, они сразу вызывают интерес.
Стремитесь к созданию УБЕЖДАЮЩИХ видео роликов. Реальные люди в вашем видео должны создавать ощущение достоверности, искренности, подлинности. Обязательно используйте разные тактики: отзывы клиентов, аргументированные ответы на возможные возражения и демонстрацию продуктов.
При помощи таких роликов, вы намного сможете быстрее преодолеть любые сомнения клиентов и закрыть сделку.
Тренд №4 для дизайна сайтов в 2017 г. – скроллинг в качестве основного вида навигации
В 201г скроллинг уже получил широкое распространение. Он сделал информацию более значимой. Теперь пользователи с удовольствием скролят длинные тексты, вместо того, чтобы переходить по ссылкам и ждать перезагрузку страниц.
Важная информация в шапке сайта, такая как основное навигационное меню, номер телефона или кнопка обратного звонка закрепляется и всегда доступна без дополнительных действий.
Скроллинг помогает плавно рассказать интересную историю, показать много фото и тем самым побороть сомнения пользователей и побудить к совершению конверсии.
Грамотно спланированная посадочная страница приглашает клиентов в тщательно продуманное путешествие, ведущее к конверсии, не заставляя раздумывать, делая выбор пути.
Предлагайте сопутствующие и похожие товары, а также выгодные акции в процессе оформления заказа, чтобы увеличить средний чек. На сопутствующие товары в e-commerce приходится от 10 до 30% дохода. Помните, что продать новому клиенту в десять раз сложнее, чем тому, кто уже готов оплатить.
При помощи всплывающего окошка, вы можете удержать клиента, когда он уже собирается покинуть сайт. Но здесь очень важно чувство меры, так как многие пользователи начали их ненавидеть.
Но если творчески подойти к созданию таких уведомлений и ничего не требовать взамен, например, предложить бесплатную доставку, записать код купона или скачать бесплатную пробную версию, то такой подход нем вызывает раздражения.
