fbpx

Правила построения успешной CTA

Правила построения успешной CTA

Блог

В данной статье мы с вами разберем правила которые необходимо соблюдать при создании кнопок, призывов к действию, или CTA (call-to-action) как при проектировании интерфейсов, так и при верстке конкретного сайта.

Правила построения успешной CTA

Что такое CTA?

CTA (call-to-action — призыв к действию) кнопка — это кликабельный элемент который поощряет / стимулирует пользователя к действию / клику.

Правила построения успешной CTA

Цвет / форма

Для начала выберите цвет который будет хорошо виден и привлечет внимание пользователя. Выберите форму которая будет наследоваться во всех дальнейших итерациях кнопок.

Правила построения успешной CTA

Размер / отступы

От размера зависит взаимодействие пользователя с CTA. Следите за размером текста, высотой / шириной, отступами кнопки. 

Правила построения успешной CTA

Тень

Не стоит перебарщивать с параметрами теней кнопки. 

Правила построения успешной CTA

Состояния кнопки

Необходимо помнить, что у кнопки должны быть проработаны различные состояния. Это важно как дальнейшему верстальщику, так и пользователю для понимая действия CTA.

Правила построения успешной CTA

Иконка

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

Правила построения успешной CTA

Выразительность

CTA-кнопка должна выделяться на фоне остального контента.

Правила построения успешной CTA

Формулировка

CTA-кнопка должна выделяться на фоне остального контента.

Правила построения успешной CTA