ста на сайте что это
CTA-кнопка: 10 столпов эффективности
Расскажу о первых факторах которые, по моему мнению, влияют на эффективность CTA (call to action) кнопки, она же «купить» в икоммерц-проектах.
Никаких советов и кейсов, скриншоты только для иллюстрации текста. Гипотезы каждый может построить сам и проверить их сплит-тестами.
1) Расположение
Первый экран наше всё. В зависимости от проекта, до 50% пользователей не скроллят страницу вниз. То есть, если мы располагаем главную кнопку на втором экране — то сами, своими руками, снижаем конверсию.
Проверить легко: Смотрим на каком пикселе сверху кнопка и сверяем с высотой экранов юзеров по ГА. Например, если нижний край кнопки 900-й пиксел, то 30% юзеров получают ее (или ее часть) на втором экране.
То есть, в общем случае, чем выше CTA-кнопка, тем лучше. Традиционно ее место справа т.к. пользователи правши, а контент на большинстве сайтов слева.
Пример: На сайте Ламоды сапог в первом экране виден не весь, но кнопка на месте.
2) Размер
Размер это акцент, акцент это приоритет, приоритет это что? Да — кто здесь главный. Если мы хотим продавать, то СТА-кнопка должна быть главной, то есть большого размера.
Но, не слишком большого, чтобы не выпадать из дизайна и не занимать половину экрана.
На сайте Yoox нет сомнений какой элемент интерфейса главный.
3) Цвет
Что мы имеем здесь. Хорошо, если он контрастный, то есть отличается от цвета основных элементов сайта. Но, выпадение его из дизайна создает ощущение кичливости. Именно поэтому я не считаю универсальными и лучшими оттенки красного/оранжевого (что принято в среде юзабилистов). Но, в некоторых случаях, они действительно работают, все зависит от дизайна сайта.
На сайте Вайлберрис кнопка контрастирует с дизайном и не случайно оранжевая.
4) Текст (содержание)
На сайте Утконос решили вообще обойтись без текста. Хорошее решение? Не думаю.
5) Форма
В этом пункте сильная привязка к дизайну сайта, но в общем случае прямоугольную форму можно считать предпочтительной, она наиболее распространена и комфортна для пользователей.
На сайте Боско кнопка круглая, это непривычно. Я бы проверил ее на эффективность.
6) Интерактивность / тактильность
Как хорошо порой поиграть с кнопкой наведением мыши. Раз, два, три навел и вот — ты ее уже нажал. Редкий случай? Нет, это работает. Поэтому по оверлею меняем цвет, увеличиваем шрифт или еще каким-то образом меняем кнопку. И это правильно!
Еще можно по дать всплывающую подсказку, это тоже интерактивность.
Букинг.ком по наведению предлагает нажатием на кнопку перейти к новому шагу.
И, конечно, если кнопка выпуклая, то при нажатии ее лучше вдавливать, это и есть тактильность. Поэтому объемная кнопка с тенью обычно предпочтительней плоской.
7) Повторение
Если у нас простыня контента (например, лендинг), то кнопку хорошо повторить. Почему? Чтобы для ее нажатия не надо было много скроллить вверх. И еще, чтобы напомнить пользователю зачем мы все это на странице ему показываем — чтобы он купил.
На сайте Онлайнтурс вверху страницы кнопка и внизу такая же.
8) Качество исполнения
Отдельный пункт, который и так понятен, но не всегда реализован. Некрасивая, кривая кнопка нажимается реже, даже если весь сайт еще ничего. Это барьер, который никому не нужен и убирается легко любым толковым дизайнером.
Кроме того, хорошая кнопка вокруг имеет отступ, это увеличивает ее самостоятельность и выделяет из всего контента. Плохая — липнет к краям и другим объектам.
Блёклые, шаблонные кнопки из 90-х на сайте Никса, сразу видно делали программисты.
9) Изменяемость
При перезагрузке или скроллинге вниз и кнопа меняет цвет. В какой-то момент она цепляется за экран. Кому от этого плохо? — Никому. Привлекает внимание? — Да.
Прием для сплит-теста годится, пробуем.
10) Взаимосвязь с другими CTA-кнопками
Самый сложный момент. Не могу дать правил, но если у нас рядом с основной кнопкой другие, то они друг на друга влияют и это надо учитывать. Нет ничего хуже двух похожих рядом, это пессимизирует обе, снижая их CTR.
На сайте BEBAKIDS они чуть разные по размеру, но уж очень похожи.
Заключение
Факторов много (описал основные), все влияют по отдельности, а их комбинация влияет вместе. Думаю, что каждый понимает как это отражается на конверсии — прямо и непосредственно. Я повышал за счет этого продуктивность в 1,5 раза и больше. В любом случае, над ней стоит хорошенько поработать.
СТА как мощный инструмент для продвижения бизнеса: яркие примеры удачного написания призывов к действию
Хотите больше подписчиков на своем профиле в Instagram или Facebook? Привлечение больше клиентов и увеличение продаж? Вы не получите их без правильного призыва к действию (call to action, СТА).
Чтобы максимизировать эти конверсии, увеличив объем продаж и окупаемость инвестиций, давайте вместе углубимся в CTA и рассмотрим беспроигрышные инструменты для продвижения бизнеса.
Подумайте о том, сколько раз вы подписывались на разные интернет-ресурсы в своей жизни. Каждая из этих регистраций, вероятно, является результатом эффективного призыва к действию (CTA).
Подумайте об этом: если бы вас не привлекал дизайн CTA, вы, вероятно, использовали бы гораздо меньше приложений и веб-сайтов, чем в данный момент. Поэтому направить посетителей через процесс покупки, используя стратегические CTA, крайне важно на пути к успеху.
CTA означает призыв к действию, это часть веб-страницы, E-mail рассылка, реклама (баннер) или контент, который побуждает аудиторию что-то делать. В маркетинге CTA помогают бизнесу превратить посетителя в потенциального клиента. CTA могут выполнять различные действия в зависимости от цели контента:
Так что же такое призыв к действию простыми словами? Это фраза, которая используется для того, чтобы точно сказать пользователю, какое действие и как его выполнить. Это может быть просто два слова («Купить сейчас») или предложение или два («Любите учить языки и хотите узнать больше? Подпишитесь сейчас, чтобы никогда не публиковать сообщения!»), И это может быть простой текст с гиперссылка или кликабельная кнопка.
Многие компании просто вставляют в объявление CTA типа «подписать» и надеются, что этого достаточно для повышения конверсии.
Они тратят кучу времени, энергии и денег на создание своих рекламных, социальных сетей, блогов и кампаний по электронной почте, а затем “вставляют” заранее провальный призыв к действию. И естественно терпят неудачу.
Поэтому просто “для галочки” CTA не нужен; требуется только сильный и убедительный, который стимулирует людей действовать.
Призыв к действию имеет две основные цели: рассказать кому-либо о том, что он должен делать, и дать ему мотивацию для этого.
Ниже приведено несколько примеров типов CTA, которые вы можете использовать в маркетинге:
Зарегистрироваться (Sign up)
В этом типе CTA аудитории может быть предложено подписаться на бесплатную пробную версию, онлайн-курс, будущее мероприятие или даже программный продукт. Все зависит от контекста CTA на рекламу или веб-сайт.
Попробуй бесплатно (Try for free)
Почти каждый сайт компании имеет бесплатное пробное предложение. Каждый из них является разновидностью CTA, что позволяет продемонстрировать продукт, прежде чем клиент решит, стоит ли он того, чтобы купить.
Начать (Get Started)
Этот CTA может управлять различными типами поведения для компании, от бесплатной пробной версии до опыта виртуальной реальности.
Узнать больше (Learn more)
Иногда все, что вам нужно, это дать вашим потенциальным клиентам немного больше информации, чтобы они были готовы что-то купить. Вот для чего этот CTA.
Присоединяйтесь к нам (Join us)
Вы управляете онлайн-сообществом? Ваш продукт построен на сотрудничестве между пользователями? Вы можете разместить CTA «Присоединяйтесь к нам» где-нибудь на вашем сайте.
CTA: Sign up for free (Подпишись бесплатно)
Dropbox всегда заключал в себе простой дизайн с большим количеством пространства. Даже графика на их домашней странице тонкая и простая.
Благодаря этому простому дизайну и пространству синяя кнопка с призывом к действию выделяется среди всего остального на странице. Поскольку CTA и логотип Dropbox одного цвета, посетитель может легко интерпретировать этот CTA как «Зарегистрироваться в Dropbox». Это один из эффективных инструментов для продвижения.
CTA: Join Free for a Month (Присоединяйся бесплатно на месяц)
Какое одно из основных опасений пользователей, прежде чем совершить что-то, например, подписаться? Что будет неудобно / невозможно отменить подписку, если им это не понравится. Netflix подавляет этот страх в зародыше с помощью опции «Отменить в любое время» прямо над CTA «Присоединяйся бесплатно на месяц». Рискну предположить, что одно только такое “заверение” увеличило регистрацию. Кроме того, вы снова заметите, что красный цвет основного и дополнительного CTA здесь соответствует цвету логотипа Netflix.
СТА: Give Prezi a try (Попробуйте Prezi)
CTA: Countdown Clock (Часы обратного отсчета)
Ничто так не заставляет кого-то действовать, как напоминающий тикающий таймер. После небольшого количества времени, проведенного на домашней странице blogging.org, новых посетителей приветствует всплывающее CTA с «ограниченным предложением времени», сопровождаемое таймером, который отсчитывает время от двух минут.
Это классическое использование психологической тактики под названием дефицит, которая заставляет нас придавать большее значение редким и ограниченным в количестве вещам. Ограничение времени, когда кто-то должен заполнить форму, заставляет людей хотеть заполнить ее и потребовать свое предложение, пока это возможно.
CTA: What We Do (Что мы делаем)
Не может не импонировать образовательный подход IMPACT, когда они бросают вызов посетителям узнать, чем занимается компания, прежде чем подтолкнуть их к дальнейшим действиям. Этот призыв к действию особенно интригует, потому что они даже не используют глагол действия, но им все же удается соблазнить людей щелкнуть мышью.
CTA: Launch (Do Not Press) Запуск (Не нажимать)
CTA: Find out when we have more (Узнай, когда у нас будет больше)
Но то, что у вас закончился товар, не означает, что вы должны прекратить его продвижение.
Brooks Running использует умный призыв к действию, чтобы гарантировать, что их клиенты не покинут веб-сайт только потому, что их любимой обуви нет в наличии. На скриншоте ниже вы можете видеть, как Brooks рекламирует потрясающий кроссовок с CTA: «Узнай, когда у нас будет больше». “Волшебная” кнопка превращает плохие новости в возможность удерживать клиентов. Без этого клиенты, скорее всего, забыли бы об обуви и заглянули в другое место.
Когда вы нажимаете на синюю кнопку CTA, изображенную ниже, Brooks направляет вас на страницу, с которой вы можете написать компании. Этот код побуждает Brooks автоматически предупреждать посетителя, когда обувь, которую он хочет, снова становится доступной.
CTA: Sign up to drive | Start riding with Uber (Зарегистрируйтесь, чтобы ехать | Начните кататься с Uber)
Uber ищет двух совершенно разных людей, которые могут зарегистрироваться на своем сайте: райдеров и водителей. Обе персоны ищут совершенно разные вещи, и тем не менее, веб-сайт очень хорошо связывает их вместе с большим видео, воспроизводимым на заднем плане, показывающим райдеров и водителей Uber, которые хорошо проводят время в разных точках мира.
Еще один не менее примечательный CTA наверху страницы: «Make money driving your car «(Зарабатывай на своей машине). Здесь это звучит по-народному (на понятном языке).
CTA: Go Premium | Play Free (Играть бесплатно)
CTA: Continue with Facebook | Sign Up (Продолжить с Facebook | Подписаться)
Хотите подписаться на Pinterest? У вас есть несколько вариантов: зарегистрироваться через Facebook или по электронной почте. Если у вас есть учетная запись Facebook, Pinterest хочет, чтобы вы сделали это в первую очередь.
Эти примеры призыва к действию показывают, что наличие сильного, преднамеренного, хорошо продуманного CTA может вдохнуть новую жизнь в ваши кампании, увеличить продажи или сдвинуть бизнес с мертвой точки. Отсутствие оного может потопить даже самый лучший контент.
Также важно помнить, что CTA не следует просто держать в кампании PPC или просто фаршировать ими электронную рассылку; они должны использоваться в максимально возможном количестве видов маркетингового контента.
Обратите внимание на примеры призыва к действию в этой статье и следуйте инструкциям по написанию собственного идеального СТА, наблюдая за положительным воздействием на ваш бизнес.
Что такое СТА и с чем его едят
Тем, кто занимается в сети продажами, термин «Call-to-action» приходилось слышать не раз. В переводе на русский язык СТА означает «призыв к действию». Элемент, который обязательно должен присутствовать на продающей странице сайта.
Наихудшим способом оформить СТА станет призыв из серии «Позвоните нам». Так делать нельзя. Для того, чтобы призыв к действию по-настоящему работал, важно предлагать пользователям нечто, что может их заинтересовать. К примеру, если СТА будет представлять собой предложение подписаться на рассылку, которую будет полезно читать, скачать важное программное обеспечение или учебник в электронном варианте.
С призывами к действию можно постоянно экспериментировать, необходимо добиваться повышения их кликабельности. Эксперименты могут касаться не только формы СТА, но также его дизайна, места, в котором он будет расположен. Рано или поздно вы поймете, какие именно призывы на вашем сайте собирают наибольшее число переходов.
Рано или поздно призывы к действию будут приводить ваших посетителей на так называемые страницы «приземления». Именно здесь посетители постепенно становятся важными лидами. Что должна включать в себя целевая страница?
— Интересные заголовок, а также подзаголовки, которые позволят понять, о чем идет речь на странице сайта. Важно, чтобы подзаголовки давали некую ценную информацию, способствующую прочтению текста страницы полностью. Они должны привлекать посетителей.
— Не забывайте о размещении на странице поддерживающих изображений. Это важно не только для дизайна, но и способствует продвижению сайта.
— Не забудьте о размещении веб-формы, которую пользователям необходимо будет заполнить для осуществления заказа, регистрации или скачивания предложенного продукта.
Новости Барнаула
Опросы
Спецпроекты
Прямой эфир
«Зеркальную» СТО для ремонта автомобилей построят на пустыре на пр. Строителей в Барнауле
Проект здания на пр. Строителей, 133 / Фото: «Мастерская Золотова»
Станцию техобслуживания автомобилей возведут на пр. Строителей, 133, напротив магазина «Знак». Сейчас территория огорожена забором и заброшена: на участке растут деревья и кустарники, есть полуразрушенный фундамент. Проект здания представляли на градсовете 17 декабря. Эксперты были рады тому, что пустырь благоустроят, и согласовали проект.
СТО с акцентами
Возвести административное здание на участке планировали ещё несколько лет назад. Собственник земли заказал проект у «Мастерской Золотова», построил фундамент. Но затем территорию продали. Новый владелец решил построить совершенно иное здание и обратился к архитекторам, выполнявшим первый проект.
«Планируется завершение строительства здания СТО автомобилей. Функция здания сохранена, назначение сохранено. Часть фундамента можно использовать. Объект выполнен в этих же габаритах. Площадка имеет въезд со стороны проспекта Строителей», – отметил руководитель «Мастерской Золотова» Владимир Золотов.
На первом этаже СТО, кроме пунктов ремонта автомобилей, запроектирован магазин, на втором – административные помещения, кабинеты. По словам Золотова, архитектурный акцент здания сделан на северный угол, так как именно он воспринимается при движении по проспекту Строителей.
«СТО является частью городской застройки, поэтому мы посчитали нужным придать вид общественного здания. Всю функцию спрятали во двор, чтобы шины не были видны, фасады выполнили в виде зеркального остекления, с хорошими облицовочными материалами, с акцентом на угол», – сказал Золотов.
«Пустырь исчезнет»
Проект выполнен на высоком уровне, отметили члены градсовета. Они спросили архитектора лишь о том, на каком расстоянии от здания располагаются железнодорожные пути, и будет ли оно подсвечено в ночное время.
Владимир Золотов сообщил, что объект удалён от рельсов на четыре-шесть метров, подсветка здания предусмотрена. Других вопросов к эскизам не было, комиссия похвалила проект и единогласно его согласовала.
«К градостроительному решению вопросов вообще нет, всё грамотно сделано. Надо поддержать», – предложил руководитель СРО «Союз архитекторов и проектировщиков Западной Сибири» Сергей Шадрин.
«Я не понимаю, как люди будут зарабатывать деньги на таком красивом здании автосервиса. Если люди рискуют, идут, надо обязательно поддержать», – согласился депутат барнаульской гордумы Евгений Носенко.
«Здорово, что этот пустырь наконец-то исчезнет», – резюмировал заместитель главы администрации города по градостроительству и земельным отношениям Андрей Фёдоров.
130+ формулировок CTA
Активный глагол + Яркое оформление |
СТА может быть в виде креативного словосочетания, также, для усиления, перед призывом, может быть ценностное предложение. Вот пример продающего блока из письма магазина Citrus:
Чтобы помочь вам подобрать ключ к высоким конверсиям email-маркетинга, мы собрали 130+ примеров СТА в зависимости от типа оформления и места размещения в письме.
50 универсальных СТА для eCommerce
1. Смотреть обзор.
2. Просмотреть товары.
3. Открыть товары.
4. Перейти.
5. Смотреть коллекцию.
6. Выбрать товары.
7. Напишите нам.
8. Вперед.
9. За скидками.
10. За [ночными/праздничными/летними/звездными] скидками.
11. К товарам со скидкой.
12. Получить секретную скидку.
13. К акционным товарам.
14. Поймать растаявшие цены.
15. Все акционные товары.
16. Узнать больше акций.
17. За покупками.
18. Найти ближайший магазин.
19. Купить в рассрочку.
20. Оформить заказ.
21. Заказать.
22. Выбрать другой товар.
23. Выбрать свой гаджет.
24. Стать обладателем [Apple Iphone XR 64 Gb].
25. Выбрать [конструктор].
26. Хочу.
27. Выбрать и купить.
28. Примерить онлайн.
29. Узнать, что сегодня.
30. Просмотреть.
31. Больше [товар/ТМ] для [детей/женщин/мужчин] (например, INTERTOP: Больше Geox для детей).
32. Оформить заказ.
33. Просмотреть всю витрину.
34. Купить для нее/Купить для него.
35. Больше предложений.
36. Успейте купить.
37. Участвовать в розыгрыше.
38. Заглянуть в другие категории.
39. Начать поиск подарков.
40. Порадовать деток.
41. Найти свои [L.A.P.T.I.]
42. Оформить заказ/предзаказ.
43. Начать шоппинг.
44. Скорее купить новинки.
45. Выбрать образ.
46. Купите образ.
47. Беру!
48. Подобрать варианты.
49. Нужно брать.
50. Купите стили с Instagram.
Рассылки с тестированием CTA
Гармоничное оформление
Линия шоколадной диеты выдержана во всех блоках письма:
Кроме прямого призыва “Начать…”, в письме использован триггер любопытства, специально для тех, кто так и не решился его приобрести после блока с доказательствами пользы шоколада.
Учимся у Ив Роше
Открываем 10 писем подряд и видим, что они всё время используют разные призывы. Нет никаких навязчивых “Купи”.
Примеры формулировок СТА:
50 СТА для продажи услуг
1. Получить скидку.
2. Забрать свою скидку.
3. Использовать промокод на 20% скидки.
4. Хочу с подарками.
5. Присоединиться.
6. Узнать цену.
7. Получить доступ.
8. Узнать больше.
9. Смотреть сейчас.
10. Забронировать место.
11. Оставить заявку.
12. Подобрать самостоятельно.
13. Спросить на Facebook.
14. Хочу стать участником [тренинга/розыгрыша].
15. Хочу участвовать.
16. Выбрать лучший пакет для участия со скидкой 30%.
17. Оформить участие в тренинге прямо сейчас!
18. Забрать билет за 2019 грн!
19. Зайти в комнату вебинара.
20. Хочу [ставить цели правильно/овладеть ораторским искусством/…].
21. Нажмите, чтобы узнать больше.
22. Принять участие.
23. Прокачать свои знания.
24. Довериться профессионалам.
25. Мгновенный доступ к материалам.
26. Принять участие в online-встрече.
27. Присоединиться к [трансляции/группе].
28. Протестировать платформу в деле.
29. Получить консультацию эксперта.
30. Я буду участвовать!
31. Открыть для себя [. ].
32. Оставить заявку.
33. Найти свой идеальный [тур/тариф].
34. Подобрать [тур/тариф].
35. Больше информации.
36. Узнать больше.
37. Изучить программу [тура/встречи].
38. Воспользоваться возможностью.
39. Действовать!
40. Торопитесь, предложение заканчивается через [таймер].
41. Оформить [заявку/кредит/. ] за 20 секунд.
42. Заказать [выезд мастера/консультацию эндокринолога].
43. Послушать подкаст.
44. Перейти к кейсу.
45. Заполнить опрос.
46. Поделиться мнением.
47. Стартовать вместе с [. ].
48. Выбрать время приема.
49. Записаться на [. ].
50. Провести время в [. ]
Оформление СТА
Примеры гифок мы обязательно добавим в конце статьи как бонус к материалу. А пока пойдем по порядку.
1) Текст-ссылка
Примеры такого оформления стали встречаться реже, но при удачном дизайне они не теряют свою эффективность по сравнению с альтернативными способами оформления.
2) СТА-кнопка
Позволю себе ошибиться в статистике, но хотя бы одна кнопка есть в 99,9% рассылок моего почтового ящика. Кто-то призывает просто “Посмотреть” или “Купить”, кто-то подходит к задаче более творчески.
Например, письмо в стиле “вечеринки” от интернет-магазина Киевстар. Маркетологи обыграли идею с ожиданиями Черной пятницы и единой тематической линией соединили текст письма, иллюстрации и призывы на кнопках. СТА умышленно продублировано, чтобы повысить число конверсий.
Прогрев аудитории к черной пятнице также сделал Фокстрот. Призыв “Подготовиться к шопингу” мягко переводит читателей на сайт, где каждый может что-то присмотреть для себя.
Является ли креатив стопроцентным залогом достижением цели? Нет, конечно. В рассылке издательства МИФ используется обычный СТА “Купить”, но альтернативность вариантов осуществления покупки повышает вероятность продаж.
Не стоит пренебрегать привычными для пользователя кнопками. К ним относятся пиктограммы соцсетей и визуализация ссылок на скачивание приложений. Эти элементы настолько узнаваемы, что не вызывают сомнений о том, какие ссылки стоят за знакомыми картинками.
3) Призыв-баннер
Пара примеров из рассылки магазина “Антошка”:
Или другой пример от Citrus с баннером-призывом: “Выбери своего робота!”
Пример из рассылки интернет-магазина Sea-tools:
4) Гиф+Баннер с СТА
А вот и обещанные гифки. Динамичность и креативность gif-изображений способствуют повышению вовлеченности читателей. Такие рассылки выглядят ярко и современно.
В этом блоке не обойтись без примеров от Цитруса:
Как всегда, яркими и интересными рассылками радует Антошка:
Gif-СТА от европейского интернет-магазина:
Оригинальных идей можно подсмотреть в письмах Comfy:
5) Gif+кнопка
К яркому оформлению призыва к действию относится и следующий пример:
Двигающийся курсор вдвойне привлекает внимание к кнопке СТА и стимулирует читателя выполнить нужное действие.
Вместо выводов оставляем мини чек-лист по добавлению СТА в email, чтобы повысить их эффективность:
Чтобы каждый ваш призыв был услышан читайте также статью: CTA: 10 лучших практик, которые не подведут. Конверсий вам, да побольше!)