Получить
предложение

Волгоград

8 (800) 333 78 59

Whatsapp / Telegram

Волгоград

Ваш город Волгоград?

Ваш город Волгоград?

ГлавнаяБлогКнопки, на которые нажимают. Как создать эффективный CTA

Кнопки, на которые нажимают. Как создать эффективный CTA

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

Задача CTA — помочь посетителю принять решение о покупке, скачивании, регистрации или подписке.

За 8 лет разработки веб-интерфейсов мы определили ряд правил, которые помогут вам создать эффективный CTA.

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

Желательно формулировать призыв так, если бы воспринимали информацию как покупатель. Например, «положить в мою корзину», «хочу». Используйте эмпатию в CTA.

Используйте слова-триггеры, на которые позитивно реагируют посетители сайта («получить скидку», «бесплатно», «подарок», «узнать»).

Формулируйте призывы так, чтобы посетитель понимал, как дальше будет развиваться действие. Вместо «отправить» или «оставить» лучше сказать «получить консультацию» или «узнать стоимость».

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

2. Расположение кнопки зависит от идеи и целей проекта, но важным условием является присутствие на первом экране, так как большинство пользователей не скролят страницы вниз.

Кнопки, на которые нажимают. Как создать эффективный CTA

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

3. Цвет. CTA должен выделяться на фоне и проходить проверку W3C. А также вписываться в общий дизайн, при этом помните, что на странице не должно быть более четырех цветов — пощадите глаза своих клиентов.

Плохой пример цветового решения: кнопка выделяется, но не вписывается в стилистическую концепцию.

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

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

Кнопки, на которые нажимают. Как создать эффективный CTA

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

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

Отличные пример приоритизации. Вы сразу поймете, какая кнопка главная.

Кнопки, на которые нажимают. Как создать эффективный CTA

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

?php include( 'wp-content/themes/business_up/includes/footer_links.php' );?>