CTA (кнопка действия)

Как придумать текст для CTA-кнопки?

В тексте CTA достаточно глаголом с точки зрения клиента описать, «что произойдёт после нажатия». Перед кнопкой клиент прежде всего беспокоится: «Сразу спишутся деньги?», «Начнётся звонок?»

Если после нажатия клиента может что-то смутить, коротко поясните это прямо под кнопкой. Строчка вроде «Можно просто проконсультироваться» или «Оплата — на следующем шаге» снимает сомнения.

Чем короче текст кнопки, тем лучше, но сокращать его до потери смысла нельзя. Оптимально, когда в двух-трёх словах видно и «что», и «как».

Подбирайте текст кнопки под слова, которыми говорят клиенты. В салоне вместо «Запись на процедуру» лучше «Запись на стрижку · химзавивку» — то, что клиент держит в голове, читается быстрее.

Как разделить основную и второстепенную кнопки?

Основная кнопка — это одно действие, которого вы больше всего ждёте от клиента, а второстепенная — другой путь для тех, кто ещё не решился. Например, в салоне основной может быть «Записаться», а второстепенной — «Прайс-лист».

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

Если заранее определить основную кнопку для каждой страницы, обсуждение дизайна тоже будет короче. Меняйте её по назначению страницы: на главной — «Записаться», на странице цен — «Записаться на эту процедуру», на странице с адресом — «Маршрут».

Например, у кафе основной кнопкой часто бывает «Маршрут», у мастерской — «Записаться на мастер-класс», в онлайн-продажах — «Добавить в корзину». Второстепенные — для тех, кто ещё думает: «Меню», «Посмотреть работы», «Отзывы».

Где разместить CTA-кнопку и какого она должна быть размера?

CTA размещают прямо рядом с местом, где клиент принимает решение. Типичные места — первый экран, точка после цен или описания и самый конец страницы.

Размер должен позволять точно нажать пальцем. Международный стандарт веб-доступности WCAG 2.2 устанавливает минимальную область нажатия 24×24 CSS-пикселя, а важные кнопки лучше делать крупнее. Если кнопки стоят вплотную, легко нажать соседнюю, поэтому следите и за отступами.

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

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

В каком порядке создавать CTA?

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

Чем меньше заведение, тем лучше делать основной кнопкой тот способ связи, на который вы можете ответить быстрее всего. Если в рабочее время вы часто не успеваете брать трубку, основной кнопкой лучше сделать не «Позвонить», а «Написать в KakaoTalk» или «Записаться».

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

1. 01Выпишите действия, которые приносят выручку (запись, звонок, вопрос в KakaoTalk, покупка, визит).
2. 02Самое важное из них сделайте основной кнопкой, а одно-два остальных — второстепенными.
3. 03Назначьте каждой странице одну основную кнопку.
4. 04Напишите текст кнопки глаголом с точки зрения клиента.
5. 05Разместите кнопки на первом экране, в конце описания и в конце страницы.
6. 06Понажимайте большим пальцем на телефоне и проверьте размер и отступы.
7. 07После запуска записывайте, сколько раз нажимали каждую кнопку, и дорабатывайте текст и расположение.

Как проверить, работает ли CTA?

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

По кнопке звонка видно только число нажатий, а состоялся ли разговор, нужно проверять отдельно. Если завести привычку спрашивать в заведении «Как вы о нас узнали?», цифры станет проще интерпретировать.

Меняя текст, меняйте что-то одно за раз и наблюдайте 2–4 недели. Если изменить несколько вещей сразу, трудно понять, что именно повлияло.

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

Какие ошибки чаще всего совершают с CTA?

Частая ошибка — слишком много кнопок. Если «Записаться», «Задать вопрос», «Позвонить», «KakaoTalk», «Instagram» стоят в одну строку одинакового размера, клиент порой не нажимает ничего.

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

Экран после нажатия — тоже часть CTA. Если после отправки заявки нет никакого сообщения, клиент не знает, ушла ли она, и отправляет снова или звонит. Обязательно добавьте сообщение о завершении вроде «Обычно отвечаем в течение нескольких часов».

Что спросить у веб-студии о CTA?

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

• Можете ли вы объяснить, какую основную кнопку выбрали для каждой страницы?
• Проверяете ли вы отдельно размер и отступы кнопок на телефоне?
• Будете ли вы записывать нажатия кнопок в аналитику посещений?
• Как запросить изменение текста или расположения кнопки после запуска?