Подборки

Call-to-action: гид по конверсионным призывам к действию

Дизайн, текст и лучшее место для призыва к действию

Call-to-action — это сплав текста и дизайна, который побуждает читателя совершить определенное действие.

Призыв к действию бывает в форме кнопки, картинки или ссылки. «Купить», «Получить консультацию», «Подписаться на рассылку» и «Зарегистрироваться» — всё это call-to-action.

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

Рассказываю, как писать, где размещать и как оформлять призывы к действию, чтобы добиваться высоких конверсий.

Текст 

В этом разделе будем говорить не только о формулировках, но и о сути послания. Разберём, что предложить читателю, чтобы в итоге он превратился в клиента. А также какие слова при этом использовать.

Чтобы правильно сформулировать call-to-action, задайте себе два вопроса:

  • как мотивировать посетителя нажать на кнопку;
  • что он получит после того, как это сделает.

Обычно call-to-action не ограничивается словами на кнопке. Это ещё и текст, расположенный рядом.

10 способов создать эффективный призыв к действию

Самый простой способ. Дополните фразу «Я хочу…» от имени посетителя:  скачать шаблон, попробовать сейчас, получить консультацию. 

Сформулировать от первого лица. Когда компания Unbounce заменила текст call-to-action с «Начать ваш 30-дневный пробный период» на «Начать мой 30-дневный пробный период», конверсия выросла на 90%. Ещё в одном тесте кнопка с местоимением от первого лица показал себя лучше на 25%. 

Призыв от первого лица получается более личным. Человек сам выбирает, что ему делать: «Участвую», «Хочу заказать», «Выслать мне шаблоны».

Призыв к действию от сервиса Snappa — «Создать мою графику сейчас»
Призыв к действию от сервиса Snappa — «Создать мою графику сейчас»

Сделать призыв понятным. Расскажите пользователю, что он получит, максимально конкретно. Если размер кнопки не позволяет сформулировать понятный call-to-action, расположите поясняющий текст рядом.

Примеры общих и конкретных call-to-action. Источник: Marketing Land
Примеры общих и конкретных call-to-action. Источник: Marketing Land

Показать отсутствие обязательств.  Все мы хотим получать больше, а отдавать меньше. Если человек только зашёл на ваш сайт или получил первое письмо, не стоит сразу кричать «КУПИ». Такой напор только отпугнёт. 

Постарайтесь ничего не просить у потенциального клиента, а, наоборот, дайте ему что-то полезное. Лучше прямо сейчас и без регистрации. Или хотя бы используйте более мягкие формулировки. Например, вместо «купить» —  «добавить в корзину». 

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

КиноПоиск предлагает бесплатную подписку и тут же обещает, что отказаться можно будет в любой момент, а сервис предупредит о списании денег за 3 дня. Итог — вы ничем не рискуете
КиноПоиск предлагает бесплатную подписку и тут же обещает, что отказаться можно будет в любой момент, а сервис предупредит о списании денег за 3 дня. Итог — вы ничем не рискуете

Рассказать о преимуществах. А/B тесты показывают, что call-to-action, которые подчёркивают выгоды предложения, дают лучший результат. Компании FriendBuy удалось получить на треть больше подписок, рассказав о преимуществах рассылки в call-to-action.

Понятно, что о выгодах и так говорится в тексте письма или страницы. Однако не помешает ещё раз сделать акцент на пользе для посетителя на кнопке или рядом с ней.

Ребята из «Кнопки» подробно рассказывают о том, что получит пользователь сервиса, непосредственно рядом с call-to-action
Ребята из «Кнопки» подробно рассказывают о том, что получит пользователь сервиса, непосредственно рядом с call-to-action

Предложить немедленный результат. Ждать никто не любит. Хорошо, если пользователь нажмёт на кнопку и тут же получит что-то полезное: протестирует сервис в работе, рассчитает стоимость услуг с помощью калькулятора, пройдёт тест и получит рекомендации. И всё это без просьбы оставить почту или добавить банковскую карту.

Skype предлагает организовать собрание прямо сейчас бесплатно, без регистрации и даже без загрузки приложения
Skype предлагает организовать собрание прямо сейчас бесплатно, без регистрации и даже без загрузки приложения

Использовать страх упустить что-то важное . Автор блога компании ConversionXL рассказывает, как ему удалось повысить конверсию на 330%, добавив элемент срочности к своему предложению. 

Используйте в call-to-action идею дефицита: ограниченные серии продуктов, краткосрочные акции, временные бонусы. Однако старайтесь, чтобы срочность не выглядела искусственной. Посетители очень быстро распознают обман. Когда у компании акция длится 2 недели, а потом автоматически продлевается ещё на две и так круглый год, доверие теряется.

Скидка 47% по 23 июня — хорошая мотивация успеть. Правда возникает вопрос, насколько при такой большой скидке обоснована цена этой программы
Скидка 47% по 23 июня — хорошая мотивация успеть. Правда возникает вопрос, насколько при такой большой скидке обоснована цена этой программы

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

Интересная подача общего количества аккаунтов в форме графика у сервиса для управления проектами и задачами. Сразу понятно, что сервис работает много лет и пользуется популярностью
Интересная подача общего количества аккаунтов в форме графика у сервиса для управления проектами и задачами. Сразу понятно, что сервис работает много лет и пользуется популярностью

Добавить цифры и гарантии. Это популярные приёмы копирайтинга, которые работают и для call-to-action. Попробуйте использовать их, чтобы мотивировать посетителей нажать на кнопку.

1500 руб. за 45 писем? — Да это совсем недорого
1500 руб. за 45 писем? — Да это совсем недорого

Покреативить. Почему бы и нет. Однако обязательно тестируйте такие призывы. Если креатив мешает пользователю понять, что вы ему предлагаете, call-to-action вряд ли будет хорошо работать.

Онлайн-кинотеатр предлагает продолжить просмотр или вернуться к скучной жизни. Выбор очевиден
Онлайн-кинотеатр предлагает продолжить просмотр или вернуться к скучной жизни. Выбор очевиден

Какие слова использовать в call-to-action

Лучше выбирать сильные глаголы, ориентированные на действие, и избегать слов-трений, которые подразумевают какие-либо обязательства:

Хорошо  Лучше избегать
Получить
Узнать
Открыть
Скачать
Рассчитать
Начать
Заработать
Попробовать
Заказать
Купить
Подписаться
Вложить
Пожертвовать
Поддержать
Зарегистрироваться

Много подходящих для call-to-action слов можно найти в списке, который составлен на основании нескольких исследований:

Источник: CoShedule

Дизайн

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

Формат

Призыв к действию оформляют в виде ссылки, картинки или кнопки. Самый эффективный вариант — кнопка: 

У большинства пользователей клик ассоциируется с кнопкой.Однако это не значит, что теперь все call-to-action должны быть в форме кнопок. Картинки и ссылки полезно использовать в качестве дополнения. Эти форматы активно применяют в email-маркетинге:

  • В рассылках есть риск, что картинки будут отключены. И всё же изображения вызывают эмоции и тем самым побуждают к действию. Поэтому в письмах картинки делают кликабельными.
  • Призывы к действию в форме ссылки размещают в тексте письма, а некоторые и вовсе заменяют им кнопку.
Максим Ильяхов предлагает подписаться на новую рассылку с помощью обычной ссылки
Максим Ильяхов предлагает подписаться на новую рассылку с помощью обычной ссылки

Вывод: Размещайте call-to-action на кнопках. Картинки и ссылки используйте дополнительно.

Цвет

Цвет кнопки значительно влияет на конверсию. Консультант Мэтью Вудворд протестировал несколько цветовых комбинаций и обнаружил, что разница между худшим и лучшим вариантом составляет 10%. Лучший вариант принёс на 850 лидов больше.

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

Зелёную кнопку хорошо заметно на синем фоне
Зелёную кнопку хорошо заметно на синем фоне

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

Размер

Чем больше кнопка, тем она заметнее. А ещё на большой кнопке легко помещается более понятный и конкретный призыв к действию.

Не просто «Купи контроллер», но «Стань лучшим игроком»
Не просто «Купи контроллер», но «Стань лучшим игроком»

Особенно важно выбрать подходящий размер call-to-action для мобильных. Здесь это напрямую влияет на удобство. Раздражает, когда приходится целиться, чтобы попасть по кнопке. 

Исследование показало, что наиболее предпочтительная высота кнопок для мобильных устройств находится в диапазоне от 42 до 72 пикселей (11-19 мм). Оптимальный вариант — 60 px (16 мм).

Вывод: Используйте большие кнопки, особенно для мобильных.

Анимация

Любое движение привлекает внимание. Когда кнопки моргают, увеличиваются, перемещаются или меняют цвет, они становятся заметнее.

Однако здесь очень легко переборщить. Навязчивая циклическая анимация будет мешать пользователям сосредоточиться на остальном контенте. Это раздражает. Поэтому лучше избегать цикличности. Вместо этого запускайте анимацию кнопки при загрузке, прокрутке или наведении курсора. Или же делайте большой промежуток между циклами.

Лёгкое изменение оттенка кнопки при наведении курсора привлекает внимание и в то же время не выглядит навязчиво
Лёгкое изменение оттенка кнопки при наведении курсора привлекает внимание и в то же время не выглядит навязчиво

Вывод: Не переусердствуйте с анимацией.

Окружающее пространство

Для начала освободите как можно больше места вокруг кнопки. Пустое пространство поможет сделать акцент на call-to-action и подчеркнёт значимость призыва к действию.

Направить взгляд посетителя на call-to-action помогут изображения и другие элементы дизайна. Компании Helzberg Diamonds удалось увеличить кликабельность на 26%, когда она добавила к призыву стрелочку. Также для этой цели подойдут фотографии людей, которые смотрят или показывают в сторону call-to-action.

Аккуратная стрелочка направляет взгляд посетителя на простую форму с кнопкой
Аккуратная стрелочка направляет взгляд посетителя на простую форму с кнопкой

Вывод: Выделите call-to-action c помощью пустого пространства или других элементов дизайна.

Расположение

Разберём, где лучше всего разместить call-to-action и стоит ли ограничиваться одной кнопкой.

Выше или ниже «линии сгиба»

Наверняка многие слышали, что размещать кнопку лучше выше «линии сгиба», т.е. на первом экране. Логика очевидна. Не все добираются до конца страницы или письма.  По исследованиям Nielsen Norman Group, 80% времени на сайте посетители рассматривают первый экран.

И всё же бывают ситуации, когда кнопка, расположенная внизу, работает лучше. По данным компании Kissmetrics, кнопки в конце страницы показывают себя эффективнее, если предложение сложное и предполагает серьёзные инвестиции: обучение, строительство дома, сложное ПО, лечение. Так, более длинная и подробная страница для клиники Sierra Tucson с кнопкой в конце показала конверсию в два раза выше, чем короткая с кнопкой на первом экране.

Вывод: Если у вас сложный продукт или услуга, которые требуют высокого уровня доверия, попробуйте разместить призыв к действию ближе к концу страницы или письма.

Справа или слева

Многие размещают кнопку сразу под заголовком в верхнем левом углу экрана. И это работает, потому что сюда посетители смотрят в первую очередь. Такой расклад подтверждают паттерны просмотра страниц. Например, F-паттерн и зигзагообразный паттерн. 

Есть ещё диаграмма Гутенберга, которая советует размещать call-to-action в правой нижней области экрана, или в зоне выхода. Однако на практике такое встречается редко.

Вот для мобильных версий есть смысл протестировать кнопку, расположенную немного правее от центра. Большинство людей правши. Когда держишь телефон в правой руке, удобнее нажимать на кнопки, которые находятся справа.

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

Всплывающие окна

Ещё один эффективный  способ разместить call-to-action на сайте — использовать всплывающие окна, или попапы

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

Главное здесь — придумать ценное предложение и определить наиболее подходящее время для показа.

Милая собачка от UniSender не даёт мне уйти с сайта без бесплатной email-стратегии. Правда надпись на кнопке немного не соответствует призыву. Лучше бы смотрелось что-то вроде «Получить мою email-стратегию»
Милая собачка от Unisender не даёт мне уйти с сайта без бесплатной email-стратегии. Правда надпись на кнопке немного не соответствует призыву. Лучше бы смотрелось что-то вроде «Получить мою email-стратегию»

Вывод: Используйте попапы, чтобы предложить посетителям что-то полезное.

Один vs много

Самый простой способ решить проблему с выбором подходящего места для кнопки — разместить несколько call-to-action. Так часто и делают: добавляют кнопку на каждые 2-3 экрана, а также в начале и в конце страницы или длинного письма.

Чтобы не показаться навязчивым при таком подходе, лучше использовать разные формулировки call-to-action. Однако менять стоит только текст, но не суть призыва. Иначе есть риск запутать посетителей.

Два одинаковых по сути призыва к действию от Ecwid — «Создать магазин» и «Регистрация»
Два одинаковых по сути призыва к действию от Ecwid — «Создать магазин» и «Регистрация»

Если хотите чтобы призыв к действию всегда оставался в зоне видимости, закрепите область экрана с кнопкой. Тогда пользователь сможет быстро найти call-to-action, когда созреет принять решение.

Можно ли использовать разные призывы к действию

Иногда на сайтах встречаются call-to-action с разным посылом. Обычно их добавляют, чтобы ориентироваться на посетителей на разных этапах воронки продаж или из разных сегментов.

Два призыва от Skyeng не конфликтуют друг с другом, так как рассчитаны на разные сегменты — на школьников и взрослых

И всё же лучше использовать разные call-to-action не параллельно, а последовательно. Если клиент только что купил ваш товар, предложите ему подписаться на социальные сети или рассылку. Круто, если сообщение будет адаптировано под конкретный продукт.

После покупки камеры клиенту сразу предлагают новый call-to-action:«Чтобы получать советы о том, как использовать вашу камеру по полной, подпишитесь на рассылку»

После покупки камеры клиенту сразу предлагают новый call-to-action:«Чтобы получать советы о том, как использовать вашу камеру по полной, подпишитесь на рассылку»

Факторы, влияющие на call-to-action

Я постаралась собрать в статье наиболее общие рекомендации по дизайну, тексту и размещению call-to-action. Однако даже эти советы будут работать не у всех, так как оптимальный вариант призыва к действию зависит от многих факторов.

Сфера бизнеса 

Тут всё просто. «Купить производственную линию» и «купить рубашку» — разные вещи. У этих продуктов различные циклы продаж, и это влияет на call-to-action. 

Согласно исследовательскому проекту Persado, для ритейла, ИТ-компаний и финансовых организаций подходят разные призывы к действию. Для финансовой сферы оказались эффективными «наблюдательные» call-to-action (Посмотреть предложение), а для ИТ — «исследовательские» (Попробовать сейчас). 

Интересно, что в сфере B2B более 70% небольших компаний вообще не используют call to action.

Call-to-action: гид по конверсионным призывам к действию 18
Прикольно, когда при формулировке call-to-action используют слова из конкретной сферы бизнеса. Не «оставить заявку», а «вызвать врача»

Путь клиента 

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

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

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

Как составить карту пути клиента

Особенности посетителя

Исследование 330 тыс. различных кнопок показало, что персонализированные call-to-action работают эффективнее обычных на 200%. Персонализированные призывы к действию, адаптируются под конкретного посетителя, с учётом его предыдущих покупок, положения в воронке продаж. Более того, в некоторых случаях показатель конверсии достигает 45%. И это неудивительно, потому что при таком подходе call-to-action соответствует уровню интереса и знаний посетителя. 

Легче всего настроить персонализированные call-to-action для посетителей и клиентов, у которых есть личный кабинет. Можно использовать специальный сервис, вроде Marketing Hub, который будет менять кнопки в зависимости от статуса клиента, прошлых покупок и других параметров.

Вот так меня встречает сервис для управления проектами Basecamp. «Добро пожаловать назад. Войдите в свой аккаунт»
Вот так меня встречает сервис для управления проектами Basecamp. «Добро пожаловать назад. Войдите в свой аккаунт»

В рассылках всё ещё проще — достаточно создать несколько писем с разными призывами для разных сегментов.

Используемое устройство

Выше я уже рассказывала про особенности дизайна и размещения call-to-action для смартфонов:

  • Кнопки стоит делать покрупнее.
  • Располагать call-to-action лучше на первом экране и правее от центра.

Кроме того, для пользователей мобильных устройств можно добавить специальные призывы. Например, call-to-action звонка, когда номер набирается по клику.

Как улучшить call-to-action

Итак, call-to-action зависит от многих факторов. Так как же определить, что сработает именно для вас? Для начала создайте какой-нибудь вариант call-to-action, следуя советам из статьи. А потом приступайте к его последовательному улучшению, используя простой алгоритм:

  1. Определите, насколько хорошо работает текущий вариант call-to-action. Измерьте не только клики, но и конверсию. Согласно исследованиям, самый высокий CTR у кнопки ещё не гарантирует высокую эффективность.
  2. Проанализируйте поведение пользователей. Посмотрите тепловую карту, чтобы понять, как часто посетители нажимают на кнопку и что отвлекает их внимание. Изучите записи сеансов, чтобы увидеть, как посетители смотрят сайт, где останавливаются, с какого места уходят. 
  3. Сформулируйте гипотезы на основе проведённого анализа. Подумайте, какой call-to-action будет работать лучше. Может, разместить его в другом месте? Изменить текст? Или вообще поменять суть предложения?
  4. Выберите гипотезу и проведите А/Б тест с помощью любого удобного инструмента. Например, Roistat, Google Optimize или Unbounce. Проверять лучше один параметр. Например, только цвет или только размещение. Удобно, что тот же Unbounce сам выберет наилучший вариант из предложенных и вам не придётся ничего менять вручную.
  5. Повторите 4 шаг с другой гипотезой.

Призыв к действию — гораздо больше, чем просто ещё один элемент страницы или письма. Call-to-action — это итоговый результат, на который работает весь остальной контент.

Согласно Wingify почти 30% тестов, которые запускают их пользователи, это тесты call-to-action. Изменить призыв к действию быстро, а конверсия при этом может вырасти значительно. Переписываешь текст призыва с «Заказать информацию» на «Получить информацию» и клики растут на 40%. Или перекрашиваешь кнопку и получаешь на 21% больше лидов.

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