Всплывающие окна: как повысить эффективность. Очевидные преимущества и недостатки настройки всплывающих окон. Кнопка «закрыть» - очень важная кнопка

On Январь 12th, 2017 .

Всплывающие окна на сайте являются весьма спорным инструментом по мнению многих. Так ли это на самом деле? Настолько ли попап плохой инструмент?

Владелец среднего сайта, увидев 98% отказов, должен задуматься над этим вопросом. Или вы думаете, что эти 98% вернутся?

Не хочу вас расстраивать в таком случае.

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

Ниже 5 практических советов, которые мы составили после анализа 350 всплывающих окошек.

1. Узнайте поведение пользователей

Как к вам приходят посетители? Как они попадают на ваш сайт? Как они перемещаются по сайту? Это вопросы, на которые надо знать ответы. Они помогут настроить exit-intent попапы (которые появляются при уходе посетителя с сайта) с более высокой конверсией.

Анализируя поведение пользователя, Вы не только получите представление о том, что может работать, а что нет. Вы также сможете использовать эти знания, чтобы понять, что хотят клиенты и что их заинтересует.

С помощью этой информации, создайте попапы с нужной целью. Цели всплывающего окна могут быть:

  • Увеличение продаж
  • Сбор базы подписчиков
  • Информирование
  • Брошенные корзины

Вот пример, зачем надо использовать аналитику. У вас есть люди, покидающие главную страницу и люди, покидающие страницы продуктов (допустим, что все они первоначально начинают с главной страницы). Один тип пользователей уже совершил какие-то действия, в то время как другие еще нет.

Вам не кажется, что к ним нужен разный подход?

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

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

Если вы используете exit-intent попап и при этом вам сложно сделать разные призывы к действию на разных страницах, тогда попробуйте использовать Google Tag Manager.

Как работает Google Tag Manager

Google Tag Manager (GTM) нужен для добавления, редактирования и/или удаления скрипта (фрагменты кода) без необходимости привлечения разработчика. Плюсы от использования ресурса (помимо того, что не нужно вдаваться в детали) – это возможность включить отслеживание конверсий, получить аналитику сайта, ретаргетинг и многое другое. В итоге GTM позволяет контролировать все скрипты (коды) без необходимости установки их на сайт.

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

Это ваш “Цифровой Контейнер” для всех фрагментов на сайте. Здесь вы можете управлять – добавлять/редактировать/удалять – все фрагменты, в которые вы хотите добавить всплывающие окна.

После установки контейнера, вам будут показаны 2 фрагмента кода. Вы должны скопировать их все на ваш сайт, на все соответствующие страницы, на которые вы хотите добавить фрагменты. Этот «контейнер» (фрагменты, который вы скопировали) должен быть вставлен в двух местах. Первый в раздел , второй — сразу после тега . Вам нужно, чтобы этот фрагмент появился на каждой странице сайта. Практически все CMS имеет плагин для GTM, что делает процесс копирования и вставки даже проще. Плагин можно использовать для того, чтобы вставить «контейнер» один раз. И он появится на всем сайте.



Теперь вам не нужно будет добавлять другие коды на сайт!

Весь код будет добавлен прямо в GTM. Чтобы добавить новый код, нажмите кнопку «Добавить новый тег». Есть много сервисов, которые интегрированы с GTM. Выберите сервис, код которого хотите установить. Или выберите “Пользовательский тег HTML”, если данного сервиса нет в списке.


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


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

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

Если вы хотите убедиться, что добавили свой контейнер правильно, используйте Tag Assistant (от Google) . Приложение будет уведомлять вас в браузере о том, что контейнер добавлен на сайт.

Google Tag Manager может творить чудеса, его возможности практически безграничны. Подробнее о GTM смотрите в учебнике Google .

2. Дизайн всплывающего окна

«Я ненавижу всплывающие окна», «Эти всплывающие окна сводят меня с ума» и другие подобные заявления делаются, когда дизайн всплывающего окна очень плох. В попытке привлечь внимание людей, маркетологи создают всплывающие окна, которые просто раздражают.

Ваше всплывающее окно должно вписываться в тематику сайта. Оно не должно выделяться из общей концепции (вот что приводит к такому презрению к всплывающим окнам в целом).

Взгляните на это всплывающее окно от SNACK BOOM. Если вы посетите сайт, вы увидите, что всплывающие окна не напрягают. Он создан для того, чтобы стимулировать покупателей оставлять адреса электронной почты.


Это всплывающее окно SNACK BOOM сконструировано для того, чтобы соответствовать остальной части сайта

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

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


Элементы, используемые в данном всплывающем окне, отражают те же самые вещи, которые они используют на других страницах

Хорошо продуманное всплывающее окно должно быть в одном стиле со всем сайтом и не должно выделяться, как белый медведь на пляже.

Выводы : Не пытайтесь воссоздать свой бренд. Все должно быть максимально просто

3. Краткий текст

Среднее время удержания внимания пользователя на каком-то элементе - 8.25 секунд . Это немного, но достаточно, чтобы заинтересовать людей. Необходимо сократить объем текста, который вы хотите использовать.

Когда дело доходит до использования определенного количества текста, стоит посмотреть на отличный пример магазина Антука . Это яркий образец того, как небольшое количество текста может сделать больше, чем большой объем текста, “Вы хотите приобрести их со скидкой 3%?”.

Антука смогли свести текст к минимуму

Выводы : У вас слишком мало времени. Используйте ключевые слова.

4. Предложение

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

Всплывающие окна именно для того и созданы, чтобы предложить посетителю что-то интересное. Ваша задача — генерировать больше потенциальных клиентов. Чтобы оставить свои данные, клиент должен получать что-то взамен.

Вот отличный пример, как привлечь новых клиентов. Bebe разместил такое предложение.


Bebe использует силу подарка

Sport Open является образцом для создания великолепных предложений. Вместо того, чтобы предложить обычные 5-10%, они предлагают скидку 25%! Может ли каждое предприятие предложить клиентам такое щедрое предложение? Я не уверен, но они знают цену каждого клиент. Они знают стоимость нового клиента и они готовы заработать меньше сейчас, а позже получить свою прибыль.


Щедрое предложение Sport Open для тех, кто может быть заинтересован в их продукции

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

Выводы : Если вы поймете, какое предложение будет интересно для посетителей, вы будете на правильном пути. Подсказка: тестируйте сразу несколько предложений с помощью А/Б тестов, чтобы определить лучшее.

5. Призыв к действию

Даже если вы создадите прекрасные фирменные всплывающие окна с привлекательным заголовком и отличным предложением, но призыв к действию будет слабым, ваше всплывающее окно не принесет результатов. Возвращаясь к Bebe, они не только сделали отличное предложение, но и использовали правильный призыв к действию. Вместо добавления стандартного “Купить”, они использовали “Получить конверт в подарок”, который идеально совпал с предложением.

Всплывающее окно POLLMAN также привлекает клиентов. Почему? Они сделали четкий и понятный призыв к действию. Кнопка выделяется на цветном фоне. И подробно поясняет, что в итоге получит посетитель, если зарегистрируется.


POLLMAN использует красный цвет в призыве к действию

Если ваше предложение сработает, задумайтесь о том, чтобы остальные всплывающие окна сделать в том же стиле, что и это.

Вот 5 советов, как сделать этот важнейший элемент правильно.

  1. Элемент должен быть аккуратным
  2. Он должен содержать призыв к действию
  3. Добавьте ключевое слово (глагол в активной форме)
  4. Создайте ощущение срочности
  5. Сделайте там кнопку

Конвертируйте больше посетителей, привлекая их всплывающими окнами

Теперь, когда вы знаете, что нужно использовать, настала очередь действовать. Всплывающее окно может увеличить конверсию сайта до 20%.

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

Ваши шаги:

1. Получить представление о поведении пользователей

2. Создать простой дизайн для всплывающего окна

3. Текст должен быть коротким и не содержать ненужных слов

4. Убедитесь в том, что вы предлагаете что-то ценное (спросите себя, завлекло бы вас это “предложение”)

5. Создайте релевантный призыв к действию

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

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

KEPLER LEADS — это инструмент, который помогает увеличить конверсию сайта с помощью всплывающих виджетов. Начните улучшения, делая из посетителей сайта подписчиков и клиентов. Попробуйте сегодня !

Как повысить эффективность всплывающих окон?

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

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

Давайте более детально рассмотрим, как работают всплывающие окна, почему они эффективны и как этого достигнуть. В этой статье мы обсудим такие моменты:

  • Почему всплывающие окна работают
  • Особенности правильно всплывающих окон
  • Нужный момент показа

Итак, начнем.

Когда работают всплывающие окна

Для начала стоит признать такой факт: «целевая аудитория не всегда себя ведет так, как нам того хотелось бы. Посетители сайта, уходили, уходят и будут уходить».

Причин этой вечной проблемы может быть уйма:

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

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

Всплывающие окна работают если они:

  • релевантные;
  • своевременны;
  • интересны;
  • значимы;
  • привлекательны.

Почему всплывающие окна работают:

  1. решают проблему выбора. Сегодня перед потребителем стоит многочисленный выбор, перед ним слишком много опций, много факторов для сравнения. На данный момент, интернет - магазины предоставляют клиентам фильтры, которые должны упрощать покупку, и из-за них очень часто перед покупателем возникает слишком много вариантов. Всплывающие окна дают правильные ориентиры;

Перегрузи мозг посетителю - он ушел.

  1. одно существенное предложение - один лендинг. Благодаря такому мудрому решению, страницы сосредотачивают на себе 100% внимания. Всплывающее окно, как очень деликатный воспитанный продавец, предлагает свое содействие в нужном месте, в нужное время. Оно помогает пользователю сосредоточиться на чем-то одном и принять правильное решение;
  2. всплывающее окно - единственное предложение, а сайт - очень, очень много функций . Всплывающие окна нарушают стандартную последовательность действий, задерживая посетителей на сайте и побуждая выполнить целевое действие;
  3. частота их повторений, обеспечивает желаемый результат. Предположительно, прежде чем совершить целевое действие, пользователь должен увидеть заманчивое предложение несколько раз, идеально - 7 раз. При таком раскладе всплывающие окна работают в перспективе на будущее. Даже если посетитель с первого раза не совершил целевое действие, у него в памяти останется Ваше яркое (!) предложение.

Зацепили интерес пользователя - он остался на сайте и сделал то, что Вам нужно.

Особенности правильно всплывающих окон:

  • для продаж . В данном случае активация всплывающего окна оптимальна для главной страницы или страницы с прайс-листом;
  • для лидогенерации . Рекомендуется размещать всплывающие окна на информационных и посадочных страницах сайта;
  • для растущего трафика на страницах с низкой конверсией. Следует размещать всплывающие окна на страницах о доставке, гарантии и оплате, на блогах.

Нужный момент показа

Если у Вас есть действующие скидки, спец.предложения, расскажите о них при входе на сайт. Хороший пример, сайт LaModa:

Для всех остальных случаев нужно подобрать самый подходящий момент.

Как оформить всплывающие окна

Оптимальный размер всплывающего окна при входе на сайт 500х300 или 740х500 пикселей, при выходе с сайта - 900х700 пикселей;

СТА-кнопка должна выделяться и быть очень заметной, на фоне картинки и текста;

Минимум информации - максимум сути. Текст должен быть лаконичным, хорошо читаемым, привлекать внимание. Это формула успеха.

« Шеф-редактор блога GetGoodRank, веб-аналитик, блоггер.
Всплывающие окна - не лучший метод удержания пользователей и повышения конверсии. Предлагаем алгоритм повышения эффективности данного маркетингового инструмента»

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

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

Разбираемся, какие всплывающие окна работают, почему они эффективны и приводим чек-лист правильных окон.

В этом выпуске:

  • Какие всплывающие окна работают
  • Почему всплывающие окна эффективны
  • Чек-лист правильных всплывающих окон

Какие всплывающие окна работают

Никто не хочет признавать факт:

пользователи покидали, покидают и будут покидать сайты. Их не остановить.

Причин этому масса: пользователя не заинтересовало предложение, страница не отвечает на вопрос (низкая релевантность), пользователя что-то отвлекло, страница не оптимизирована под мобильное устройство, пользователь получил, что хотел, но его цель не совпадает с целью страницы (к примеру, пользователь уточнил характеристики уже купленного товара на странице коммерческого сайта).

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

  • своевременно
  • релевантно
  • несет ценность для пользователя

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

Почему всплывающие окна работают?

1. Всплывающее окно решает проблему выбора

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

Этот же парадокс объясняет эффективность лендингов.

Один лендинг - одно обоснованное предложение.

Коэффициент внимания на таких страницах достигает 100%.

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

Страница - много опций для выбора, всплывающее окно - одно предложение

2. Нарушает привычный алгоритм действий

Техника называется «разрушение паттерна». Весьма проста. Заключается в действии, которое нарушает привычный ход действий посетителя. Пользователь знает, что по нажатию на «крестик» он покинет сайт. Если в этот момент появится правильное всплывающее окно, пользователь:

  • задержится на сайте
  • выполнить предлагаемое действие

3. Техника повторения

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

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

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

Люди инстинктивны. Мы склонны выбирать те алгоритмы поведения, в которых мы действуем на автопилоте. Нарушение «автопилотного» алгоритма поведения привлекает внимание и заставляет пользователя поступить иначе.

Чек-лист правильного всплывающего окна

1. Цель запуска

Продажа, лидогенерация, распределение трафика…. и прочие

Для продаж оптимальным местом активации всплывающего окна становится главная страница, страница с прайс-листом или ценами (карточка товара), корзина.

Для лидогенерации всплывающие окна рекомендуют активировать на главных страницах, информационных страницах, посадочных страницах сайта.

Для распределения трафика со страниц с низкой конверсией активируйте всплывающие окна на страницах о компании/о нас, информационных страницах (о доставке, гарантии, оплате), на страницах блога.

2. Момент показа

Если у вас есть скидки, спецпредложения, акции, покажите всплывающее окно на входе, как это делает LaModa:

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

3. Оформление всплывающего окна

  • Оптимальный размер всплывающего окна на старте посещения, равно как и по прошествии определенного времени - 500х300 или 740х500 пикселей (рекомендации Unbounce)
  • Оптимальный размер всплывающего окна на выходе с сайта - 900х700
  • СТА-кнопка должна выделяться на фоне изображения, текста и других элементов дизайна окна
  • Пустое пространство - обязательное условие для любого всплывающего окна. Текст становится читаемее, информация легче усваивается.
  • Не более двух полей для заполнения - всплывающее окно упрощает действие по максимуму. Не загружайте пользователя развернутой анкетой. Имя и контакт - этого абсолютно достаточно.

4. Оформление текста

Заголовок - большой, легко читаемый шрифт, привлекающий внимание, отделен от основного текста отступом.

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

5. Суть предложения

СТА-кнопка - ясно ли пользователю, что произойдет после нажатия кнопки? Понятна ли пользователю суть предложения?

Ограничения по количеству/времени - ясно ли пользователю, что предложение ограничено?

«НЕ!» - используется ли в тексте отрицание? В коротком тексте не рекомендуется использовать отрицания. Они создают психологические барьеры для принятия решения.

Владелец среднего сайта, увидев 98% отказов, должен задуматься над этим вопросом. Или вы думаете, что эти 98% вернутся?

Не хочу вас расстраивать в таком случае.

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

Ниже 5 практических советов, которые мы составили после анализа 350 всплывающих окошек.

1. Узнайте поведение пользователей

Как к вам приходят посетители? Как они попадают на ваш сайт? Как они перемещаются по сайту? Это вопросы, на которые надо знать ответы. Они помогут настроить exit-intent попапы (которые появляются при уходе посетителя с сайта) с более высокой конверсией.

Анализируя поведение пользователя, Вы не только получите представление о том, что может работать, а что нет. Вы также сможете использовать эти знания, чтобы понять, что хотят клиенты и что их заинтересует.

С помощью этой информации, создайте попапы с нужной целью. Цели всплывающего окна могут быть:

  • Увеличение продаж
  • Сбор базы подписчиков
  • Информирование
  • Спасение брошенных корзин

Вот пример, зачем надо использовать аналитику. У вас есть люди, покидающие главную страницу и люди, покидающие страницы продуктов (допустим, что все они первоначально начинают с главной страницы). Один тип пользователей уже совершил какие-то действия, в то время как другие еще нет.

Вам не кажется, что к ним нужен разный подход?

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

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

Если вы используете exit-intent попап и при этом вам сложно сделать разные призывы к действию на разных страницах, тогда попробуйте использовать Google Tag Manager.

Как работает Google Tag Manager

Google Tag Manager (GTM) нужен для добавления, редактирования и/или удаления скрипта (фрагменты кода) без необходимости привлечения разработчика. Плюсы от использования ресурса (помимо того, что не нужно вдаваться в детали) - это возможность включить отслеживание конверсий, получить аналитику сайта, ретаргетинг и многое другое. В итоге GTM позволяет контролировать все скрипты (коды) без необходимости установки их на сайт.

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

Это ваш “Цифровой Контейнер” для всех фрагментов на сайте. Здесь вы можете управлять - добавлять/редактировать/удалять - все фрагменты, в которые вы хотите добавить всплывающие окна.

После установки контейнера, вам будут показаны 2 фрагмента кода. Вы должны скопировать их все на ваш сайт, на все соответствующие страницы, на которые вы хотите добавить фрагменты. Этот «контейнер» (фрагменты, который вы скопировали) должен быть вставлен в двух местах. Первый в раздел, второй - сразу после тега. Вам нужно, чтобы этот фрагмент появился на каждой странице сайта. Практически все CMS имеет плагин для GTM, что делает процесс копирования и вставки даже проще. Плагин можно использовать для того, чтобы вставить «контейнер» один раз. И он появится на всем сайте.

Теперь вам не нужно будет добавлять другие коды на сайт!

Весь код будет добавлен прямо в GTM. Чтобы добавить новый код, нажмите кнопку «Добавить новый тег». Есть много сервисов, которые интегрированы с GTM. Выберите сервис, код которого хотите установить. Или выберите “Пользовательский тег HTML”, если данного сервиса нет в списке.

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

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

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

Если вы хотите убедиться, что добавили свой контейнер правильно, используйте Tag Assistant (от Google) . Приложение будет уведомлять вас в браузере о том, что контейнер добавлен на сайт.

Google Tag Manager может творить чудеса, его возможности практически безграничны. Подробнее о GTM смотрите в учебнике Google .

2. Дизайн всплывающего окна

«Я ненавижу всплывающие окна», «Эти всплывающие окна сводят меня с ума» и другие подобные заявления делаются, когда дизайн всплывающего окна очень плох. В попытке привлечь внимание людей, маркетологи создают всплывающие окна, которые просто раздражают.

Ваше всплывающее окно должно вписываться в тематику сайта. Оно не должно выделяться из общей концепции (вот что приводит к такому презрению к всплывающим окнам в целом).

Взгляните на это всплывающее окно от SNACK BOOM. Если вы посетите сайт, вы увидите, что всплывающие окна не напрягают. Он создан для того, чтобы стимулировать покупателей оставлять адреса электронной почты.

Это всплывающее окно SNACK BOOM сконструировано для того, чтобы соответствовать остальной части сайта

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

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

Элементы, используемые в данном всплывающем окне, отражают те же самые вещи, которые они используют на других страницах

Хорошо продуманное всплывающее окно должно быть в одном стиле со всем сайтом и не должно выделяться, как белый медведь на пляже.

Выводы : Не пытайтесь воссоздать свой бренд. Все должно быть максимально просто

3. Краткий текст

Среднее время удержания внимания пользователя на каком-то элементе — 8.25 секунд . Это немного, но достаточно, чтобы заинтересовать людей. Необходимо сократить объем текста, который вы хотите использовать.

Когда дело доходит до использования определенного количества текста, стоит посмотреть на отличный пример магазина Антука . Это яркий образец того, как небольшое количество текста может сделать больше, чем большой объем текста, “Вы хотите приобрести их со скидкой 3%?”.

Антука смогли свести текст к минимуму

Выводы : У вас слишком мало времени. Используйте ключевые слова.

4. Предложение

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

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

Вот отличный пример, как привлечь новых клиентов. Bebe разместил такое предложение.

Bebe использует силу подарка

Sport Open является образцом для создания великолепных предложений. Вместо того, чтобы предложить обычные 5-10%, они предлагают скидку 25%! Может ли каждое предприятие предложить клиентам такое щедрое предложение? Я не уверен, но они знают цену каждого клиент. Они знают стоимость нового клиента и они готовы заработать меньше сейчас, а позже получить свою прибыль.

Щедрое предложение Sport Open для тех, кто может быть заинтересован в их продукции

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

Выводы : Если вы поймете, какое предложение будет интересно для посетителей, вы будете на правильном пути. Подсказка: тестируйте сразу несколько предложений с помощью А/Б тестов, чтобы определить лучшее.

5. Призыв к действию

Даже если вы создадите прекрасные фирменные всплывающие окна с привлекательным заголовком и отличным предложением, но призыв к действию будет слабым, ваше всплывающее окно не принесет результатов. Возвращаясь к Bebe, они не только сделали отличное предложение, но и использовали правильный призыв к действию. Вместо добавления стандартного “Купить”, они использовали “Получить конверт в подарок”, который идеально совпал с предложением.

Всплывающее окно POLLMAN также привлекает клиентов. Почему? Они сделали четкий и понятный призыв к действию. Кнопка выделяется на цветном фоне. И подробно поясняет, что в итоге получит посетитель, если зарегистрируется.

POLLMAN использует красный цвет в призыве к действию

Если ваше предложение сработает, задумайтесь о том, чтобы остальные всплывающие окна сделать в том же стиле, что и это.

Вот 5 советов, как сделать этот важнейший элемент правильно.

  1. Элемент должен быть аккуратным
  2. Он должен содержать призыв к действию
  3. Добавьте ключевое слово (глагол в активной форме)
  4. Создайте ощущение срочности
  5. Сделайте там кнопку

Конвертируйте больше посетителей, привлекая их всплывающими окнами

Теперь, когда вы знаете, что нужно использовать, настала очередь действовать. Всплывающее окно может увеличить конверсию сайта до 20%.

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

Ваши шаги:

1. Получить представление о поведении пользователей

2. Создать простой дизайн для всплывающего окна

3. Текст должен быть коротким и не содержать ненужных слов

4. Убедитесь в том, что вы предлагаете что-то ценное (спросите себя, завлекло бы вас это “предложение”)

5. Создайте релевантный призыв к действию

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

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

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



Есть вопросы?

Сообщить об опечатке

Текст, который будет отправлен нашим редакторам: