Как правильно оформить кнопки Call to action

Перед тем как понять, как правильно оформить Call to Action, разберемся, что такое Call to Action (CTA) или по-другому призыв к действию.

Call to Action – это элемент сайта, рекламы, банера, который подталкивает пользователя к конкретному действию. Для сайтов типичным элементом призыва к действию является кнопка. Далее рассмотрим более подробно примеры и как правильно оформить кнопки CTA.

Для какого сайта нужен CTA?

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

Что является Call to Action на сайте?

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

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

Вот несколько примеров текстов на кнопку или банер, многие из которых точно вам встречались:

• “Оставь заявку на обратный звонок”
• “Только сегодня 30% скидка”
• “Узнать подробности”
• “Купить со скидкой”
• “ЗАПИСАТЬСЯ”

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

Основные правила для Call to Action

1. Кнопка должна выделяться, контрастировать с основными элементами.

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

2. Кнопка призыва к действию должна выгодно отличаться от остальных кнопок.

На таком сайте, как интернет магазин, например, есть множество кнопок таких как “Вернутся назад”, “Отмена”, “Редактировать” и так далее. Это те действия, которые затягивают процесс покупки и они не желательны для нас, как владельцев, но совсем убрать эти кнопки мы не можем.

Поэтому наиболее желательные кнопки должны быть более яркими, более привлекательными и заметными, а остальные нейтральными, с белым/серым/нейтральным фоном с тонкой обводкой или вообще без обводки в форме текста.

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

3. Не должно быть очень много одинаковых призывов к действию.

Часто особенно на посадочных страницах (лендингах), дизайнеры любят ставить кнопку “Купи” или “Зарегестируйся здесь” в каждом блоке сайта. Не могу с точностью утверждать, что это не работает совсем, но создается четкое впечатление, что мне, как пользователю, пытаются что-то “впарить” – навязать какую-то услугу.

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

4. Избегать разных цветов кнопок.

Кроме того, что кнопка должна выделяться по цвету, она все-таки должна гармонично смотреться на вашем сайте. Цвет может быть контрастный основному или одного тона с основным, но более ярким. В большинстве случаев 2-3 разных цвета для кнопок достаточно, из них 1-2 для Call to Action.

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