8 принципов дизайна, лежащих в основе целевых страниц с высокой конверсией
Опубликовано: 2020-05-08Итак, вы открыли для себя Divi и отправились на поиски создания веб-сайта. Но когда веб-сайт заработал, вы обнаружили, что, хотя он выглядит великолепно, вы не достигли поставленных целей по конверсии.
Это не значит, что вам следует отказаться от своих усилий. Несмотря на то, что Divi позволяет вам пропустить все обучение, которое вам нужно сделать, чтобы создать красивый веб-сайт, вам все равно необходимо понимать принципы создания преобразующего дизайна.
Для этого вам нужно изучить основные принципы и попробовать реализовать их на собственном веб-сайте. Конечно, вам нужно будет некоторое время поэкспериментировать с приложением, и проведение A / B-тестирования поможет вам добиться этого быстрее. Однако без этих принципов вы поймете, что делать с веб-сайтом, чтобы он дольше конвертировался.
Проблема в том, что достижение идеального коэффициента конверсии для целевых страниц для большинства - непростая задача. Не существует волшебной формулы, которая позволила бы повысить коэффициент конверсии целевой страницы с 0% до 50%.
Однако повышение коэффициента конверсии вашего веб-сайта на 100% или даже 300% не является чем-то необычным, если вы подойдете сами. Даже если он вырастет с 1% до 3%, это будет на два лида больше на сто посетителей, что может изменить правила игры для вашего бизнеса.
Единственное, что вам нужно сделать для достижения этих результатов, - это изучить некоторые общие правила, которые позволят вашим целевым страницам стать более прибыльными.
В этом посте вы откроете для себя восемь принципов дизайна, которые помогут сделать ваши целевые страницы более эффективными.
Дизайн для людей
Аудитория каждого бизнеса разная. Это разные люди, они хотят от продукта разного, по-разному думают. Вам нужно узнать все о себе, чтобы донести до них то сообщение, которое они должны услышать.
Если вы еще не разработали личность покупателя, вам нужно сделать это для целевой страницы. Новичкам лучше проверить всю статью, но если вы уже немного знаете о покупателях, вот где вы можете найти информацию о своей аудитории.
- Аналитика Google и Facebook.
- Поиск намерений в Google по ключевым словам.
- Ищу общественное мнение на Reddit и Quora.
- Изучение профилей пользователей в социальных сетях.
- Проведение личных собеседований.
Теперь проведение личного собеседования может оказаться излишним для большинства малых и средних предприятий. Вам не нужно заходить так далеко с исследованием клиентов, первых четырех методов более чем достаточно для обновления вашей целевой страницы.
Самое главное - каждый лендинг проектировать под свою аудиторию. Вы проводите две отдельные маркетинговые кампании для потенциальных клиентов с высокой ценностью на протяжении всей жизни и для покупателей со скидкой? У вас не может быть такой же посадки
Последовательность
Этот совет может звучать как «не перепутайте». Ну, вроде как. Вам необходимо, чтобы дизайн и сообщение целевой страницы соответствовали дизайну и содержанию ссылки на источник.
Некоторые целевые страницы получают трафик из результатов поиска, некоторые - из платной рекламы. Если в вашем случае последнее, убедитесь, что баннер, сообщение и дизайн целевой страницы соответствуют друг другу.
Если есть большая разница, пользователи могут подумать, что это афера. Но выглядеть злоумышленником - это не единственное, о чем вам следует беспокоиться. Если сообщение несовместимо между ссылкой на страницу и самой страницей, многие лиды просто откажутся, потому что не найдут то, что ищут.
Минимализм
Этот принцип дизайна полезен не только при создании современного искусства. Это также очень полезно для разработки целевых страниц.
Дело в том, что целевая страница не предоставляет посетителям столько информации, сколько вы можете. Речь идет об оптимизации конверсии. Чем меньше на странице дополнительных элементов, тем лучше.
Убедитесь, что на странице нет отвлекающих факторов, а пользователи попадают прямо в раздел с призывом к действию.
Этот веб-сайт НПО минимален. Прямая линия наверху немного подсказывает, что нужно прокрутить вниз, чтобы увидеть больше.

Источник: звонки из Калифорнии
Но вам не обязательно быть полным вычурным минималистом на своей целевой странице, как эта калифорнийская неправительственная организация. Вы можете просто сохранить минимальное количество элементов, как Shopify.

источник: shopify
Когда лиды не засыпаны призывами к действию и отвлекающими факторами на целевой странице, они прочитают ту небольшую информацию, которую вы им даете, и продолжат прокрутку.
На переднем плане
Этот принцип дизайна настолько прост, что вы уже используете его в своей повседневной жизни. Рассматривайте свою целевую страницу как учебник для студентов. Вся информация в книге важна, но самые важные части выделены желтым маркером, который трудно не заметить.
Используйте цвет фона и шрифта, размер и форму шрифта, а также пустое пространство для выделения наиболее важных элементов страницы на передний план.
Простейший пример выделения на передний план - увеличение размера подзаголовков и придание им другого цвета.

Также распространенной практикой является придание важным CTA контрастным цветом.

Поймать внимание
Когда новый потенциальный клиент попадает на страницу из объявления, у вас есть небольшой промежуток времени, чтобы привлечь его внимание. Некоторые источники утверждают, что таймфрейм составляет всего 2,6 секунды. Как привлечь внимание незнакомца менее чем за 3 секунды? Вот четыре предложения.

- Используйте движение (мы неохотно на него реагируем) или человеческие лица над складкой
- Объясните свое предложение одним предложением, которое вы на первом плане
- Подстегните интерес, возможно, предложив бесплатную пробную версию
- Покажите важную статистику или цифру
Эта целевая страница Airbnb выполняет три пункта из списка.

источник: Airbnb
У него дружелюбное лицо, которое автоматически привлекает внимание. Следующее, что видит человек, - это предложение заработать. Когда Airbnb показывает им ежемесячную оценку, компания полностью привлекает внимание.
Сетки и визуальная коммуникация для UX Writing
Хороший дизайн веб-сайта более или менее однороден. Хорошая подача - нет. Учитывайте все свои знания об аудитории и составьте сообщение, которое убедит пользователей совершить конверсию. Используйте социальные факторы, боли и ценности ваших клиентов, о которых вы узнали.
Однако не пишите сочинение из 1000 слов о том, почему ваш продукт хорош. Будьте максимально краткими и используйте сетки, чтобы структурировать то, что вы хотите сказать.
Возможно, вы уже знаете этот принцип дизайна, потому что он есть в каждом фреймворке и шаблоне, включая Divi. Вот сетка из трех столбцов, которую использует Shopify.

источник: shopify
Вот сетка с двумя столбцами с целевой страницы Airbnb.

источник: Airbnb
Сетки могут показаться немного скучными, потому что их используют все, но это одна из немногих вещей, которые помогают донести вашу точку зрения, так что это компромисс. Если простая сетка со значками и текстом кажется вам слишком скучной, добавьте в нее пустое пространство и другой вид переднего плана. С Divi вы можете проектировать на ходу и добиться того, чтобы узор сетки выглядел правильно.
Еще один важный принцип дизайна, который вы можете использовать при написании UX, - это визуальная коммуникация. Написание UX включает не только текст. Используйте изображения, анимацию или видео, чтобы объяснить, что ваш продукт может сделать для покупателя.
Вот минималистичный и смелый пример от калифорнийской неправительственной организации.

Источник: звонки из Калифорнии
Легкое преобразование
Люди, которые проектируют обычные магазины, не заставляют покупателей прыгать через обруч, чтобы платить за продукты. Также не следует требовать от клиентов прохождения 10-минутного процесса регистрации для совершения покупки. Фактически, чем больше полей формы у вас на целевой странице, тем меньше конверсий вы получите.
Сохраняйте количество движений, которые нужно сделать человеку, чтобы преобразовать как можно меньше, и сделайте призыв к действию предвзятым и очень очевидным. Если вы предлагаете своего рода бесплатную пробную версию, вам может понадобиться только одна кнопка CTA. В конце концов, предложение уже требует очень небольших усилий.
Если вы этого не сделаете, оставьте второй вариант на тот случай, если пользователь еще не готов к конвертации. Выбор должен быть не между «да» и «нет», а между «да» и «да», но позже.
Использование чат-бота в качестве резервного CTA - тоже отличная идея.

Изучите, как люди взаимодействуют с дизайном
Если начать с этих принципов и узнать больше о рекомендациях Google UX, это станет прочной основой для конвертирующего веб-сайта. Однако, если вы хотите преуспеть в качестве дизайнера, вам следует изучить, как пользователи взаимодействуют с тем, что вы разрабатываете. Тем более, если на карту поставлены сотни тысяч долларов дохода.
Как ты это делаешь? Вы можете начать с изучения того, как веб-сайт будет выглядеть с точки зрения вашего клиента.
Используйте инструмент разработчика Chrome или Firefox, чтобы изменить размер окна браузера, чтобы увидеть, как меняется дизайн на экранах разного размера. Ваш веб-сайт ориентирован на клиентов из разных уголков земного шара? Для лучшего тестирования следует дополнительно использовать VPN. Например, существует множество VPN для Mac, Android и других. Это поможет вам не терять клиентов.
Это также поможет вам увидеть, насколько быстро он загрузился бы, если бы вы были гостем из Японии или Новой Зеландии. Если ваши серверы расположены только в США, у посетителей из других стран может быть более длительное время загрузки, а это не то, что вам нужно.
Наконец, вам нужно посмотреть, как реальные люди взаимодействуют с вашим сайтом. Создайте несколько версий целевой страницы и используйте инструмент разделения Divi, чтобы увидеть, что работает лучше всего.
Чтобы получить еще больше информации, воспользуйтесь инструментом тепловой карты, например Hotjar, чтобы увидеть, где люди щелкают мышью и наводят на нее указатель мыши. Если ваш призыв к действию не привлекает того внимания, которое вы хотели, это признак того, что вам нужно улучшить.
Последние мысли
Эти восемь принципов дизайна будут иметь большое значение для улучшения ваших целевых страниц. Но не прекращайте учиться только потому, что вы узнали восемь из них. Узнайте больше о принципах дизайна целевых страниц, обновите свои знания о дизайне пользовательского интерфейса, узнав, как создавать фоны параллакса в Divi, чтобы привлечь внимание ваших потенциальных клиентов.
Лучшее изображение через PureSolution / Shutterstock.com
