Как улучшить юзабилити лендинга

Маркетинг и дизайн интерфейса неразрывно связаны. Даже «тонна» трафика уйдет впустую и не принесет продаж, если целевая страница не убеждает пользователей и ее неудобно просматривать. 

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

Отсутствие оффера на первом экране

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

Пример как НЕ надо делать

Пример плохого улучшения юзабилити

Мало того, что здесь нет оффера. Вы узнаете, чем занимается компания только на 4(!) экране. Страница создана для заказа диванов, но почему-то от посетителей это скрывают. Блок «О нас» на посадочной странице органично смотрится во второй части, когда пользователь понял суть предложения и хочет подробнее узнать о поставщике. Но самая критичная ошибка Birka — компания рассказывает о себе набором штампов, и ни слова (!) не сказано, что они делают мягкую мебель. Удивительное безрассудство)

Вот простой пример каким должен быть первый экран:

Пример хорошего юзабилити лендинга

Заголовок сообщает не просто характер услуги, а измеримый результат, выгоду потенциального клиента.

Избыток информации

Быть или не быть «простыне»? Споры по этому поводу не утихают, при этом дело не в количестве, а в «коэффициенте полезного действия» информации. Ее должно быть ровно столько, чтобы убедить пользователя на целевое действие (звонок или заявка через лид-форму). Не злоупотребляйте терпением клиента: не стоит выкладывать гору материалов какие вы хорошие на голову посетителя. 

Пример как НЕ надо делать

Как улучшить юзабилити лендинга с помощью информации

Хорошее начало: стильный дизайн, понятный оффер. А дальше ... 27 (!) блоков, в том числе 9 форм захвата. Полную версию вы можете посмотреть на странице компании Realstones. 

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

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

Отсутствие акцента на кнопке CTA

Неважно какого цвета кнопка CTA (call-to-action). На конверсию влияет не цвет, а контрастность кнопки по отношению к фону страницы.

Неудачный пример:

Неудачный пример юзабилити лендинга

Не сразу увидишь призыв «Shop» в складках пиджака) 

Хороший пример:

Хороший пример юзабилити лендинга

Интересно, что в Европе все больше в ходу прозрачные кнопки (с подсветкой при наведении курсора). Пример блога Hubspot, где призыв к подписке отлично выделяется:

Как увеличить юзабилити лендинга с помощью кнопки

Как видите, все дело в правильном размещении. 

Перегруженность первого экрана

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

Неудачный пример магазина Jimmy Choo, где 5 визуальных блоков и 2 слайдера.

Перегруженность первого экрана ухудшает юзабилити

Многочисленные исследования по онлайн-психологии говорят, что большой выбор вызывает стресс, а слайдер просто «убивает» конверсию.

Отвлекающие факторы

Помните принцип «скользкой горки» Шугермана в продающих текстах? Он в полной мере относится к лендингам, где любая «лазейка» на сторону может увести пользователя от целевого действия.

Враг №1 — кнопки социальных сетей (с переходом на сообщество компании). «Интересно, а что у них там?» — думает посетитель, просматривает группу, а затем с большой долей вероятности уходит почитать френд-ленту. Здесь вы можете увидеть пример как удаление кнопок соцсетей увеличило конверсию на 12%. 

P.S. То, что работает на 99 других лендингах, может не сработать у вас. Тестируйте каждое новшество, чтобы улучшить юзабилити, каждый элемент, который вляет на конверсию, и высоких вам продаж!