Идеальный Landing Page. Создаем продающие веб-страницы

Все просто: для повышения доверия человек на картинке должен смотреть на пользователя, для привлечения внимания к форме он должен смотреть на форму. Простой лайфхак: направление взгляда легко меняется в «Фотошопе».

Как выбрать изображение, чтобы на 100 % попасть в цель?

Воспринимая любой объект, человек подсознательно пропускает его через фильтр, сложившийся тысячелетия назад: можно ли это съесть, может ли это съесть меня и можно ли с этим заняться сексом (продлить род).

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

Может быть, вы обращали внимание на то, какой бешеной популярностью пользуются кулинарные сайты?

Еда привлекает людей на инстинктивном уровне. Если вы совсем запутались и не знаете, какое оформление сайта выбрать, то преподнесите свое УТП как вишенку на торте.

Показать суть

При тестировании этих двух форм регистрации на игровом сайте (рис. 5.49) правый показал конверсию на 36 % выше, чем левый. Молодые люди, геймеры, очень хотели увидеть, что там будет дальше, поэтому оставляли заявку с большей охотой и подключались к этой онлайн-игре.

Рис. 5.49. Показать суть

Самое важное из главы 5

• Для визуализации лендинга используйте прототипирование.

Удобнее всего создавать прототип в программе Balsamiq. Обратите пристальное внимание на юзабилити еще на этапе макета.

• Учитывайте основные принципы дизайна.

К ним относятся: легкость и простота восприятия, удобство, функциональность, наглядность и логика. Следите, чтобы ваш дизайн не противоречил этим принципам.

• В дизайне действуют законы социального соглашения.

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

• Размер шрифта – не менее 12 пикселов.

Всегда выделяйте прямую речь курсивом, избегайте красного цвета в заголовках и включенного режима Caps Lock, синий цвет и подчеркивание – только для ссылок. Не запутывайте посетителей.

• Первый экран – то, что обязательно увидят ваши клиенты.

Обязательные элементы первого экрана: логотип, дескриптор, заголовок (выгода), подзаголовок (дополнительная выгода), кнопка или форма заказа, тематическая фотография.

• Критерии идеальной формы регистрации.

Кнопка должна быть уникального цвета (заметна на расстоянии двух метров от монитора), к заполнению предлагайте не более 2–3 полей, все поля – с валидацией и маской ввода.

• Триггеры – выгоды клиента, оформленные визуально.

Триггер можно оформить как в виде текста, так и значками. Это зависит от выбранной вами концепции дизайна. Используйте не более четырех элементов.

• Оформляйте отзывы и кейсы правильно.

Обязательные элементы: заголовок, несущий выгоду, важное выделено жирным шрифтом, прямая речь написана курсивом, есть ссылка на соцсеть или контакты персонажа, обозначены его статус и/или должность.

• Оформление продукта.

Блок с описанием продукта легко оформить по схеме: заголовок, фотография продукта, краткая характеристика, кнопка Заказать.

• Комплектации продукта и сравнение с конкурентами.

Комплекты и сравнение с конкурентами лучше всего оформлять в виде таблицы. Соблюдайте последовательность от дорогого к дешевому, визуально выделите выгодное предложение (рамка другого цвета).

Домашнее задание

Создать прототип лендинга в программе Balsamiq.

Дополнительные материалы к главе 5

Шаблоны технического задания дизайнеру в формате Balsamiq и PNG, из которых вы легко создадите свою посадочную страницу.

Скачайте сейчас по ссылке http://convertmonster.ru/lpbook/free.

Глава 6. Подготовка к запуску

Формула движения к покупке

Здесь представлена общая формула движения к покупке для всех, абсолютно всех типов клиентов. Во всех рекламных кампаниях, на всех рекламных носителях, будь то лендинг, реклама в сети «ВКонтакте», контекстная реклама, реклама на билбордах, реклама на визитках, реклама на листовках, раздаваемых в метро, абсолютно любая реклама может быть построена согласно формуле AIDA.

Что означает эта формула?

А – Attention (англ. «внимание»). В первую очередь ваше информационное сообщение должно привлекать внимание. Если вы не смогли зацепить внимание клиента вашим рекламным материалом, то вся рекламная кампания испорчена.