Антитренды в веб-дизайне: оставьте это в прошлом

Плоский дизайн

В 2015 году флэт стал откровением. Плоские иллюстрации были буквально везде. Google разработал огромные гайды по material design и научил всех упрощать. Из интерфейсов пропала чрезмерная детализация, и всё стало максимально понятным. Но на дворе уже 2021 — прошло 6 лет, и пора убирать флэт-картинки до нового витка моды.

Что делать

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

Эффективная и выгодная реклама с сервисом от МегаФона

Широкий выбор рекламных каналов, более 100 параметров по интересам, подробная аналитика и другие возможности уже ждут в Личном кабинете. А еще кешбэк 100% за запуск рекламы в первый месяц и еще 10% — каждый месяц.

Узнать больше >>

Реклама. ПАО «МегаФон». ИНН 7812014560. ОГРН 1027809169585. ERID LjN8K1P7y.

Видео на фоне

Боль всех фронтендеров и UX-еров. Видео на фоне раньше было у каждого второго сайта. И не важно, про что он был — про новую модель смартфона или рис из Италии. Считается, что видео добавляет динамики, передаёт атмосферу бренда. Но есть сразу много «но». Во-первых, быстродействие — видео сильно тормозит все процессы на сайте. Во-вторых, скука — если делать видео меньше, оно повторяется чаще и быстро надоедает. В-третьих, адаптивность — видео на мобильных устройствах часто не грузится или отображается неправильно.

Что делать

Если очень хочется поставить фоновое видео, пусть это будет не первый экран, а, например, раздел про бенефиты, где это будет в тему. Для первых экранов хорошо заходят микровзаимодействия или интерактивные детали. Но обязательно тестируйте UX, чтобы не получить высокий процент отказов из-за тяжёлой странички.

Стоковые фото

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

Что делать

Лучше использовать свои фотографии: продукта, клиентов, услуг. Нет времени на фотосессию или это просто невозможно? Используйте иллюстрации: чертежи, схемы, картинки для разных ситуаций. И старайтесь делать их оригинальными — такое всегда запоминается.

Часто стоки используют как временные «заглушки»: это быстрое и удобное решение. Но в таких случаях нужно подбирать максимально оригинальные изображения или адаптировать их с дизайнером — добавлять новые элементы, встраивать их в общий визуальный стиль.

Горизонтальный скролл

Горизонтальный скролл — классное и неожиданное решение, но на практике не всегда очевидное. Многие пользователи теряются на переходе к следующему шагу и часто просто уходят.

Есть, правда, элементы, для которых горизонтальный скролл будет в самый раз: например, если это портфолио фотографа или модели. Или блок со сториз-форматом. А вот сайт-визитку местного молокозавода лучше оформить в классическом варианте.

Что делать

Тренд последних лет, который не сдаёт позиций, — параллакс! Это анимация по скроллу. Выглядит эффектно, восприятию информации не мешает, UX не ухудшает. Идеально!

Яркие цвета

Кислотно-неоновые гаммы лучше оставить тем, кто плачет на техно. Яркие цвета кричат нашему древнему мозгу: «Внимание! Опасность!». Во-первых, это отвлекает от информации на сайте, даже если её там немного. А во-вторых, наш мозг за последний год уже настрессовал — пандемия и самоизоляция ни для кого не прошли бесследно.

Что делать

В моде естественность и натуральность, в том числе, в цветовых решениях. Акценты можно расставить с помощью контрастных, но не кричащих оттенков.

Экстремальный минимализм

Минимализм — это хорошо, но доводить до крайности точно не стоит. Кажется, что пользователь заинтересуется, захочет узнать детали. Но! На сайты люди ходят за информацией. Не нашли что-то быстро у вас — найдут у другого.

Что делать

Не нужно отказываться от минимализма, просто нельзя бросать посетителя один на один с сайтом: нужны детали, намёки и подсказки, чтобы человек понял, что нужно доскроллить или щёлкнуть. А лучше вообще не ударяться в таинственность и загадочность и общаться по-человечески.

Гамбургер-меню

Гамбургер-меню, то есть меню сайта, скрытое под стандартной иконкой из трёх горизонтальных линий — тема достаточно сложная. На десктопе это решение смотрится не очень: нужно его найти, раскрыть, выбрать нужный пункт. Слишком много действий для современного пути пользователя.

На мобильных версиях использование «бургеров» оправдывают экономией места и простой адаптивностью. Но если такое меню раскрыть, оно как раз закроет весь контент. А если есть несколько уровней вложенности, то переход по ним может быть затруднён.

Что делать

Решений много, но универсального среди них нет. Можно, например, вывести пункты меню на страницу и сделать их элементом дизайна. Использовать нижнюю панель вкладок, как сейчас модно в приложениях. Или придумать что-то своё. Главное — отталкиваться от задач и функционала сайта.

Антитренды, конечно, понятие спорное — то, что было в моде 5 лет назад, может снова вернуться, и все мы снова будем рисовать во флэте. На самом деле, главное — использовать те приёмы в дизайне, которые помогут пользователю решить его проблему, а сайту — выполнить свою задачу.

Мнение редакции может не совпадать с мнением автора. Ваши статьи присылайте нам на 42@cossa.ru. А наши требования к ним — вот тут.