Как заставить посетителя действовать по вашему сценарию?
Сегодня поговорим о CTA кнопках (английская аббревиатура: “call to action” — призыв к действию).
Отбросьте все свои стереотипы о навязчивости, неэффективности и рассеивании внимания посетителя. Выделите 5 минут на чтение этой статьи, чтобы научиться увеличить кликабельность этого элемента минимум в 2 раза.
“Нажми на кнопку, получишь результат…”
Кнопка призыва к действию один из наиболее эффективных инструментов увеличения трафика, наращивания клиентской базы, конверсии, обратной связи и прочих форм взаимодействия с посетителями сайта.
Обратите внимание на ресурсы, которые вы посещаете. Ни один сайт не обходится без предложений: “позвонить”, “купить”, “записаться”, “подписаться”, “поделиться” и т. д. Весь интерфейс сайта, вся архитектура заточена на то, чтобы правильно подготовить клиента: показать полезный текст, красивый фото и видео-контент, предложить формы для делового и развлекательного интерактива. В тот момент, когда Вы уже “обработаны” и чуть было не забыли зачем сюда пришли, такой элемент помогает напомнить, направить и открыто призвать к действию. На сайтах призыв преподносится в форме специальной кнопки. Такие кнопки, при условии подходящего дизайна и правильного текста, могут мгновенно нарастить количество переходов и увеличить конверсию.
Что даёт СТА (call of action button)?
- Прирост трафика;
- Вовлечение;
- Продажи.
Где применяется?
- Веб-страницы
Почему cta кнопка не работает?
Есть определенные правила расположения ключевой информации и call to action или призыва к действию. Условно всю веб-страницу можно разделить горизонтальной линией примерно пополам, эта линия называется “линией сгиба”. Основная информация, такая как: логотип, номер телефона располагают сверху, заголовок чуть ниже по центру. Все это должно быть видно посетителю без необходимости прокручивать страницу вниз. По общему правилу, основная кнопка call to action должна располагаться тоже выше этой условной «линии сгиба». Логика примерно такая: вы попадаете на страницу и глаз должен сразу увидеть ключевой посыл.
В последнее время все больше разработчиков предлагают альтернативные варианты размещения таких кнопок. В том числе и ниже линии сгиба. Здесь стоит ориентироваться на содержимое страницы, интерфейс и поведенческие факторы посетителей. Если кнопка «выпадает» не в то время, не в том месте она не только не сработает, но и может стать навязчивым и раздражающим элементом для пользователя.
Лайфхаки для выбора удачного расположения
- Лучше всего добавить кнопку призыва к действию рядом с подходящим по смыслу текстом или аудиовизуальным контентом;
Таким элементом можно логически закончить или углубить текст (“узнать больше”, “купить”, “перейти” и т д);
Не привязывайтесь к «линии сгиба», смотрите на верстку, логику и архитектуру;
Не пытайтесь мотивировать человека на действие, если предстоящий или рядом стоящий контент не подготавливает его к этому действию;
Подумайте о кнопке, которая ненавязчиво перемещается вместе с прокруткой содержимого или повторяется вверху и внизу страницы. Возможно, это отличное решение, которое поможет не ломать голову куда ее ставить.
Неудачная формулировка призыва
Весь секрет CTA заключается в их кликабельности. Количество кликов зависит от того, что на ней написано. Правильно подобранный и составленный текст — 70% успеха.
Вот классические примеры исправления формулировок и мгновенного эффекта:
“Начни свой 30-ти дневный бесплатный период” исправили на “Начать свой 30-ти дневный бесплатный период”, кликабельность увеличилась на 90%.
“Создать аккаунт” заменили на “Создать аккаунт и начать” — платежи увеличились на треть.
Основные правила:
- Точное описание действия и соответствие действия результату. Посетители часто относятся к таким элементам с недоверием и боятся, что переход приведет к неожиданным и заранее не описанным последствиям. Не стоит укреплять эти страхи и отпугивать потенциальных клиентов. Подумайте, как кратко и емко описать то, что произойдет, если посетитель нажмет на кнопку.
Старайтесь уйти от обезличенности. «Положить в мою корзину» лучше, чем «В корзину». «Купить в 1 клик» лучше «Купить» и т д.
Правильно, интересно и заманчиво сформулируйте призыв, исходя из тематики содержания страницы.
Посмотрите небольшой гид по темам. Он не даст решения на все случаи жизни, но может стать основой мозгового штурма.
Для подписки и регистрации:
- Хотите узнавать первыми?
- Понравился материал?
- Бесплатная рассылка
- Давайте общаться!
- Подписывайтесь
- Присоединяйтесь
- Подпишитесь
- Зарегистрируйтесь и узнайте, получите, участвуйте и т. д.
Расшаривание
- Интересно?
- Понравилось?
- Хочешь, чтобы твои друзья узнали?
- Поделись
- Сохрани
- Сделай репост
- Жми
- Ставь лайк и т. д.
Комментарии
- А вы что думаете?
- Поделись мнением
- Оставь комментарий
- Не согласны?
- Согласны и т. д
Запрос информации
- Написать менеджеру
- Узнать расценки
- Уточнить размер скидки
- Есть ли в наличии?
- Спросить эксперта и т. д
Рассчет стоимости
- Заказать рассчет
- Перейти в калькулятор
- Начать бесплатный просмотр и т. д.
Покупка, заказ
- Купить в 1 клик
- Оформить заказ
- Доставить по адресу
- Купить со скидкой
- Купить по низкой цене и т. д.
Скачивание
- Скачать сейчас
- Скачать бесплатно
- Скачать быстро
- Скачать безопасно
- Сохранить себе
- Загрузить в компьютер и т. д.
Просмотр всего текста
- Дочитать
- Читать полностью
- Продолжение здесь
- Кликнуть для продолжения чтения
- Полная версия и т. д.
Строка поиска
- Поищем?
- Что ищем?
- Что будем искать?
- Найти на странице и т. д.
Сохраните себе, вдруг пригодится.
- Некликабельный дизайн
Для того, чтобы дизайн был кликабельным необходимо соблюсти следующие правила: оптимальный размер, цвет, форма и качественное исполнение.
Про размер. Ему нужно быть подходящим. Кнопка не должна потеряться среди содержимого страницы, но при этом не занимать половину зоны просмотра. Подходящий размер кнопки cta (call 2 action) определяется путем проб и ошибок.
Про цвет. От него многое зависит.
Еще один, ставший классикой пример, как смена цвета виджета с голубого на зеленый увеличила продажи на 30%. Здесь стоит ориентироваться на ассоциации и аналогии. Например, действие: “переход”, “звонок” и т д., лучше сочетается с зеленым цветом (по аналогии со светофором). Красный цвет яркий и броский, всегда привлекает внимание, но может ассоциироваться с тревогой, запретом, остановкой и т д. Слишком бледное цветовое решение «сотрет» кнопку со страницы. Слишком яркое — может не вписаться в общий дизайн. Гармония, баланс и глубокий ассоциативный анализ — вот то, что вам потребуется для правильного подбора цветового решения “call 2 action”.
Немного о форме. По форме нет единого решения, кто-то настаивает на том, что прямоугольная и квадратная форма лучше всего подходит для кнопки призыва к действию. Есть и противоборствующий лагерь «ненавистников острых углов», которые считают, что такие геометрические фигуры отпугивают посетителя. Сторонники этой точки зрения настаивают на круглых и овальных формах, считается, что они более подходящие и кликабельные. Рекомендуем опираться на дизайн страницы и общее восприятие композиции. Кажется, что нет ничего более прекрасного, чем полное сочетание цвета, форм и композиционного баланса. Попробуйте, вам понравится.
А теперь о качестве исполнения. Достоверно неизвестно в какой момент на вполне адекватных сайтах стали появляться CTA — “пришельцы из ЭВМ 90-х гг”, но в определенный период они прямо заполонили весь рунет. Пиксельные, мутные, размазанные элементы выглядели жутко и не выполняли своей привлекающей функции.
Совет: Потратьте время, силы и деньги на качественное исполнение кнопок — призывов к действию, оно того стоит. Если такой возможности нет, не делайте, так будет лучше.
В завершении блока о дизайне call to action, примеры:
Итак, мы рассмотрели что такое CTA кнопки, зачем они нужны, как правильно расположить их на странице и как они должны быть оформлены.
Основные тезисы:
- Правильная кнопка призыва к действию работает на повышения кликабельности, увеличения конверсии и вовлечение аудитории;
- CTA необходимо правильно расположить на странице, не всегда стоит руководствоваться правилом «линии сгиба» и располагать элемент строго в верхней части страницы, иногда стоит прибегнуть к подвижным вариантам и дубляжу кнопки внизу и вверху страницы;
- Стоит потратить время и силы на формулировку самого призыва и создание подходящего, качественного дизайна.
- Еще раз посмотрите наш гайд по темам, там можно найти источники вдохновения, которые могут подойти вашему ресурсу.
- Доверьтесь профессионалам, так вы сможете сэкономить энергию, силы и время для ведения своего бизнеса, не отвлекаться на смежные задачи.
Не существует идеальных правил оформления этого инструмента, необходимо тщательно подбирать и постоянно тестировать варианты, только так можно достигнуть отличных результатов.