Последние тенденции в области веб-дизайна можно отразить в одном заключении: сайт должен быть визуально простым, оригинальным и стильным. Это же утверждение касается дизайна лендинга. Большое количество элементов, бессмысленные изображения, нагромождение шрифтов и иконок, запутанная навигация – все это ухудшает восприятие страницы и информации, которая размещена на ней. Для повышения эффективности лендинга веб-дизайнеры стремятся упростить оформление страницы. Ставка делается на минимализм в дизайне.
Дизайн лендинга – вещь сложная. Важно соблюсти необходимые пропорции и сделать все возможное, чтобы не перегрузить страницу, но при этом оставить ее интересной и работающей на достижение цели. Рассмотрим приемы, которые можно использовать при создании веб-дизайна в стиле минимализм.
Для начала надо выделить основную идею лендинга – задачу, которая стоит перед бизнесом. Для какой цели создается? Важно определить одно действие, к которому будет призывать целевая страница. Это может быть регистрация, оформление заказа, подписка, запись на семинар, отправка контактных данных и т.д. На одну страницу надо выбрать одну цель. Это залог правильного создания лендинга в стиле минимализм.
На странице не следует располагать сложных меню, социальных кнопок, баннеров. Кнопка призыва к действию должна стать самым главным элементом страницы. Все остальные составляющие необходимо приглушить, чтобы они не мешали и не отвлекали посетителя.
Важные элементы минималистичной лендинг пейдж (landing page)
Основными компонентами минималистичного лендинга являются:
1. Призыв к действию2. Информация о продукте
3. Альтернативный вариант
Грамотно выстраивается иерархия основных компонентов. В этом процессе используется визуализация. Наиболее важные элементы делаются самыми заметными и яркими.
Правила визуальной иерархии:
1. Большие элементы на landing page имеют высокую значимость, они находятся вверху иерархии.2. Элементы, расположенные слева и в верхней части страницы считаются более важными, чем остальные.
3. Более сложный с точки зрения дизайна элемент занимает высокое место в иерархии.
4. Наличие свободного пространства вокруг элемента – свидетельство высокого веса данного элемента на странице.
5. Выше в визуальной иерархии находятся яркие элементы, цвет которых контрастен к цвету основного фона.
Для создания визуальной иерархии используются такие инструменты, как цвет, размер, положение на странице.
Самый заметный элемент минималистичного лендинга – призыв к действию. Что именно вы хотите от посетителя? Может быть, он должен нажать кнопку или ввести свой e-mail, заполнить веб-форму или отправить отзыв? Четко обозначьте желаемую цель в форме кнопки призыва. Для визуального выделения кнопки используйте цвет и форму.
Информация о продукте или услуге должна быть четкой, понятной и легкой для восприятия. Придерживайтесь сжатого содержания. Вам надо быстро донести основную идею торгового предложения до потенциального клиента. Используйте короткие фразы, списки. На чтение текстового сообщения не должно уходить много времени.
Пользователи не любят изучать пространные рекламные тексты. Ограничьте объем информации, оставьте только самые важные мысли. Чем меньше времени уйдет на прочтение текста на лендинге, тем лучше.
Помимо текстового сообщения есть другие способы донести информацию до потребителя. Используйте видеопрезентацию или качественное изображение. Если вам надо объяснить потенциальным клиентам, как работает ваш продукт, разместите на странице поясняющее видео. Желательно, чтобы ролик открывался в модальном окне. Желающие его посмотрят, а тем, кто не захочет этого делать, видео не помешает воспринимать другую информацию на странице.
Примените принцип постепенного раскрытия информации к другим элементам. Например, скройте часть текста, чтобы на странице отображался первый абзац с основной идеей, а дополнительные сведения появлялись лишь после того, как пользователь развернет окно. Этот принцип можно использовать и для изображений. Размещайте на странице эскизы, при нажатии на которые посетители смогут увидеть фотографии в полном размере.