Привлеките внимание за счет дизайна, или принцип 3w!

Источник изображения

Мы живем в эру, в то время, когда привлечение внимания само по себе стало редким – и потому дорогим – товаром. Информация не может к самоорганизации, вот из-за чего столь ответствен верный дизайн целевой страницы, создающий визуальную иерархию элементов и завлекающий внимание визитёра к самому серьёзному содержимому вашего лендинга (CTA-элемент, заголовок, лид-форма).

Целевая страница не должна сбивать с толку, показывая «все и сходу». Вместо этого взору пользователя обязан мгновенно раскрываться ясный «визуальный путь», ведущий его к 3 главным частям предлагаемой ему информации.

Итак, ознакомимся с новейшей концепцией представления информации, именуемой «принцип 3W»:

  • What? Что предлагает ваша страница? (суть оффера)
  • Why? Из-за чего это принципиально важно? (в чем сокровище предложения)
  • Where? Куда дальше идти пользователю? ( призыв к действию)

Сейчас были совершены масштабные научные изучения по обнаружению удержания и механизмов захвата способов и визуального внимания, которыми дизайн целевой страницы может напрямую оказывать влияние на ее конверсию. Ниже мы разглядим дизайнерские приемы, благодаря которым сможем организовать подачу контента посадочной страницы в полном соответствии с «принципом 3W».Привлеките внимание за счет дизайна, или принцип 3w!

Аналогия с офисом

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

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

  • Муха на писсуаре, либо 5 правил убеждающего веб-дизайна
  • Как применять правила дизайна для повышения конверсии

Что такое визуальный беспорядок?

Вы не содержите собственный офис в подобном состоянии, мы уверены. А как обстоит дело с целевой страницей?

Мы только что принимали участие в отыскивании мнимого документа в визуально «загрязненном» офисе – сейчас мы знаем, что такое «визуальный шум» (Visual noise). Так вот, данный самый визуальный шум для вашей целевой страницы есть смертельным ядом и не редкость 2 видов:

  • Украшения: в офисе это броская окраска стен, растения, картины, сувениры, на целевой же странице таковыми являются логотипы, талисманы, изображения и знаки доверия.
  • «Хлам»: в офисе это – стикеры, исчирканные чашки и листки блокнота с кофейной гущей; на целевой странице – вторичные офферы, параллельные рекламные кампании, не связанные с оффером изображения, внешние ссылки и т. п.

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

Все это так, но брендирование ни при каких обстоятельствах не должно вытеснять из центра зрительского внимания уже упоминавшиеся нами «3W». Но как мы сможем убедиться, что брендинг не отвлекает визитёра от призыва и ценностного предложения к действию? Ответ таков: внедрив научно обоснованные методы привлечения внимания в фактически процесс конверсии.

Недавние изучения в Массачусетском технологическом университете установили, что визуальный беспорядок на web-странице не только затрудняет ориентацию, но и снижает точность идентификации «3W», содержащихся на ней. По данным этих изучений, «избыточные и/либо дезорганизованные элементы затрудняют визуальный поиск, что влечет за собой падение конверсии».

Иначе говоря через чур громадная «изменчивость» цветов, текстур и размеров формирует воздух непредсказуемости, каковая в конечном итоге рассеивает внимание визитёра и и увеличивает коэффициент отказов.

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

  • Чем больше выбор, тем ниже конверсия

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

Отсутствие иерархии и переполненность элементами разрушают «визуальный путь» к упомянутым «3W»: взор пользователя легко бессмысленно бродит по странице. Панель навигации в верхней части страницы есть единственным выходом из этого визуального водоворота, но шрифт через чур мелок, дабы привлечь интерес пользователя.

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

Рекомендации:

  • Держите вашу целевую страницу в большем порядке, чем ваши офисные помещения: организуйте содержимое так, дабы заголовок, призыв и ценностное предложение к действию всегда были перед глазами визитёра.
  • Избегайте трансформации шрифтов, текстур и цветов. Поразмыслите о последовательности и предсказуемости при организации информации на вашем сайте/целевой странице – через чур всевозможный дизайн тревожит пользователя. броские и храбрые цвета, фактуры и шрифты должны быть зарезервированы для ваших заголовка и CTA-элемента – все другое должно быть приглушенным и равномерным.
  • Убедитесь, что ваша страница соответствует «принципу 3W» при сохранении минимально нужного брендинга.

Да, вот тут возможно трудиться 😉

Как без лишних упрочнений улучшить дизайн целевой страницы

Кроме того располагая научными данными и результатами сплит-тестов, самый умелый дизайнер может совершить ошибку. По данным, взятыми в 2006 году исследователями из университета Копенгагена на протяжении тестов по отслеживанию перемещения глаз (айтрекинг), дизайнер может предугадать лишь 46% элементов страницы, на каковые пользователи обратят внимание, тогда как сами пользователи не забывают лишь 70% от того, что они в действительности видели.

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

Рекомендации:

  • Предварительное тестирование!
  • Удостоверьтесь в надежности страницу на соответствие «принципу 3W».
  • Поменяйте элементы на странице местами, поэкспериментируйте с оттенками цвета и контрастностью. А на данный момент ваша страница еще соответствует «принципу 3W»?
  • Протестируйте ее снова. Не забывайте, что основное на странице – это заголовок, призыв и ценностное предложение к действию (3W)!
  • Анатомия совершенной целевой страницы
  • Как цвет воздействует на покупательскую активность?
  • Мастерство сочетания цветов — броский путь к высокой конверсии

Запустите рекламную кампанию за пара мин., применяя опытные лендинги LP Store!

Высоких вам конверсий!

По данным www.unbounce.com

Случайные статьи:

Мобильный дизайн макет сайта. Как заработать дополнительный кэш


Подборка похожих статей:

riasevastopol