Рекламные кампании для вашего бизнеса
Войти как пользователь
Вы можете войти на сайт, если вы зарегистрированы на одном из этих сервисов:

Тенденции веб-дизайна

Россия +7 (495) 960-65-87
Шрифт:
1 10800

Все знают про плоский дизайн. Мобайлгеддон Google подсказывает, что важно создавать адаптивные сайты. Рассмотрим тенденции веб-дизайна, чтобы вы знали, из чего выбирать.

1. Шаблоны

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

Шаблоны, которые полезно знать и использовать:

  • Бургерное меню. Хотя его критикуют, узнаваемый элемент.

  • Форма регистрации. Это набор полей, которые заполняют, или кнопки социальных сетей. Многошаговая форма также эффективна, так как разбивает процесс на этапы и помогает людям быстрее расправиться с регистрацией.

  • Бесконечный скроллинг. Все привыкли много скроллить благодаря мобильным устройствам.

  • Карточки. Представляют информацию в отдельных «контейнерах». Прямоугольная форма помогает перемещать их в зависимости от размера экрана.

  • Большие изображения. Лучше один раз увидеть, поэтому крупные HD изображения привлекают внимание. Частый шаблон – крупное изображение в первом экране, сопровождаемое карточками.
     

2. Анимация.

Анимации добавляют взаимодействию с сайтом интерактивности и развлекательности. Крупные анимации – всплывающие оповещения и паралакс. Мелкие анимации – ховер, индикаторы загрузки и т.д.

Элементы и события, которые анимируют:

  • Загрузка. Развлекает во время скучного процесса.


  • Навигация и меню. Сохраняет пространство экрана.

    nav.gif

  • Наведение (ховер). Когда пользователь не уверен в функционале, он наводит курсор на элементы, чтобы получить визуальную обратную связь.


  • Галереи и слайд-шоу. Хороший способ показать множество изображений, не перегружая внимание посетителя.


  • Движение. Мы естественно замечаем движущиеся объекты, поэтому анимация привлечет внимание к форме, CTA-кнопкам и элементам меню.


  • Скроллинг. Анимированная прокрутка страницы передает контроль в руки пользователя.


  • Фоновая анимация / видео. Добавит сайту привлекательности.

     

3. Микровзаимодействия.

Микровзаимодействия происходят постоянно и незаметно: выключить будильник на мобильном, лайкнуть фото кота в ВК. Это важная часть приложений.

Бывают активными – ввести пароль, нажать Like, пассивными – сигнал о новом сообщении.


Цели – сообщить об изменении статуса, дать обратную связь:

1) завершение действия – опубликовать статус, отправить письмо;

2) изменение настроек – громкость;

3) изменение состояния – переход в спящий режим.

4. Материальный дизайн.

Разработка Google. Используйте тени, движение и глубину, чтобы сделать дизайн реалистичнее.

 5. Адаптивный дизайн.

Переходит из разряда тенденций в стандарты.

Responsive-Design-WM.jpg

Сочетается с карточками, так как они перестраиваются в соответствии с размером экрана. 

6. Плоский дизайн никто не отменял.

Что важно: длинные тени, яркие цвета, простые шрифты, прозрачные кнопки, минимализм.


По материалам UXPin

internet-dlya-biznesa

Есть о чем рассказать? Тогда присылайте свои материалы в редакцию.


Новые 
Новые
Лучшие
Старые
Сообщество
Подписаться 
Подписаться на дискуссию:
E-mail:
ОК
Вы подписаны на комментарии
Ошибка. Пожалуйста, попробуйте ещё раз.
Поделиться 
Поделиться дискуссией:
Отправить отзыв
  • Гость
    больше года назад
    что ж вы ссылки на примеры не дали?...

    -
    -3
    +
    Ответить
    Поделиться
ПОПУЛЯРНЫЕ ОБСУЖДЕНИЯ НА SEONEWS
23 действительно эффективных совета по продвижению интернет-магазина
Гость - Троль Гуру паНгинации - Что такое паНгинация?))))
Конкурс: угадайте пятерку лидеров рейтинга «SEO глазами клиентов 2016»
Марина
1
комментарий
0
читателей
Полный профиль
Марина - Ingate i-Media SEO.RU Netpeak 1PS.RU
Анализ ссылок: сравнение многофункциональных платформ по размеру их баз
Михаил - Хватит пениться на каждый аргументированный отзыв. Это не придает вашей компании чести.
Как создать интернет-магазин: сколько стоит открытие?
Гость - да у битрикса что ни обновление - то сплошные баги. недавно знакомый обновился на лицензии интернет-магазина, про***лись заказы за последнюю неделю, слетели все связи по складам. одним словом, жопа. при этом обновился на сразу, а спустя месяц после выкатывания, надеялся, успеют все поправить
Как упростить продвижение вечными ссылками?
Coursh - Зарегестрировался. Накинули 1100 рубликов за пополнение на 10к. Очень неплохо!
Вопрос недели: почему сайт хорошо ранжируется в Google и не интересует Яндекс?
Nina S.Dzh. - У вас достаточно конкурентная тематика для рунета и по главной странице домена расположена англоязычная версия. Полагаю, в этих двух фактах вся проблема. Поскольку Яндекс в данном случае считает английскую версию сайта приоритетной, а среди ваших конкурентов в выдаче достаточно много хороших русскоязычных сайтов, то он и не ранжирует ваш сайт высоко. Грубо говоря, ему есть что предложить пользователю и без вашего сайта. На мой взгляд, в данном случае версии нужно разводить по разным доменам, русскую вешать на RU и продвигать там.
Кому и зачем нужен маркетплейс от Яндекса
Дарья Калинская
203
комментария
0
читателей
Полный профиль
Дарья Калинская - Максим, спасибо, рада, что статья оказалась полезной )
Конкурс: угадай победителя рейтинга «Известность бренда SEO-компаний»
Андрей
1
комментарий
0
читателей
Полный профиль
Андрей - Оптимизм Дэмис Кокос Ашманов и Партнеры Раш эдженси
ТОП-10 автоматизированных сервисов контекстной рекламы
Жанна Рожкова
155
комментариев
0
читателей
Полный профиль
Жанна Рожкова - Научитесь отличать рекламу от PR-активности. Если следовать вашей логике, на этом сайте (и на всех остальных информационных ресурсах в принципе) кроме рекламы ничего и нет. Так что насчет статьи от понимающего эксперта? Будем рады, если подготовите
Экспериментальное SEO: «Дырявые носочки панды»
Adrian - Испания и Португалия находятся в Европе и участвовали в чемпионате Европы. Одна из этих стран даже стала победителем. А Южная и Центральная Америка здесь при том, что там разговаривают на испанском и португальском языках. Сына, учите географию.
ТОП КОММЕНТАТОРОВ
Комментариев
910
Комментариев
834
Комментариев
554
Комментариев
540
Комментариев
483
Комментариев
373
Комментариев
285
Комментариев
262
Комментариев
203
Комментариев
171
Комментариев
155
Комментариев
137
Комментариев
123
Комментариев
97
Комментариев
97
Комментариев
93
Комментариев
80
Комментариев
70
Комментариев
67
Комментариев
60
Комментариев
55
Комментариев
52
Комментариев
49
Комментариев
45
Комментариев
44

Отправьте отзыв!
Отправьте отзыв!