Как сделать поп-ап

Pop-up — популярный, но неоднозначный инструмент маркетинга. 73% интернет-аудитории вообще не одобряют всплывающие окна. И тем не менее, коэффициент конверсии у них неплохой — 9,28%. Эти показатели говорят о том, что людей раздражают не сами всплывающие окна, а то, что они не имеют отношения к их интересам.

В этой статье разберемся, зачем нужны поп-апы, какие есть способы их создания и как веб-мастеру без посторонней помощи запустить свой первый pop-up.

Зачем нужны поп-апы

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

• Сбор контактных данных (email-адресов, номеров телефонов и т. д.). Такие поп-апы еще называют лидогенерирующими. То есть вы собираете контакты людей, которым интересно ваше предложение. Далее отправляете номера телефонов или email-адресов в отдел продаж, который доводит сделку до завершения.
• Подписаться на рассылку. Часто pop-up предлагает «что-то» взамен на контакты. Например, в интернет-магазине всплывающий popup предлагает клиенту ввести свой адрес электронной почты, чтобы получить скидку. Такие popup-окна можно увидеть на странице спортивного бренда Puma.

  

• Информирование. Цель таких окон — рассказать посетителям об акциях, скидках, важных изменениях в компании. Такие поп-апы обычно имеют яркий дизайн и содержат короткий рекламный текст. При нажатии на него пользователь переходит на страницу с деталями или с уцененными товарами.
• Удержание пользователей на сайте. Это триггерные окна, они срабатывают, когда пользователь покидает сайт. Информация в них должна быть полезной и нужной клиенту: предложение о скидке, подарок при покупка на определенную сумму. Важно, чтобы пользователя заинтересовало содержание этого popup, иначе цель не будет достигнута — он покинет сайт.
• Другие цели. Поп-апы используют не только для рекламы. С их помощью получают дисклеймеры — письменный отказ от ответственности. Также попапами называют всплывающее окно с информацией, когда пользователь зарегистрировался на платформе и еще не знаком с его функционалом.

Способы создания pop-up

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

• Специальные сервисы по созданию всплывающих форм. К ним относятся Hellobar, GetSiteControl, Keplerleads и другие. Выбор среди таких сервисов большой. Они хороши тем, что уже имеют готовые решения с шаблонами. Из недостатков — такие сервисы обычно платные.
• Сервисы рассылки со встроенным редактором всплывающих форм. К таким, например, относятся Unisender — сервис запуска pop-up и рассылок (email, sms, Viber). Unisender подходит тем, кто хочет создать pop-up для сайта, не прибегая к помощи разработчиков. Есть готовые шаблоны под разные цели: сбор контактов, продажи, акции и промокоды. Из важных плюсов — Unisender бесплатный.
• Аутсорс (сбор pop-up вручную). Вообще, можете создать поп-ап самостоятельно, если у вас есть навыки верстальщика. Если нет, найдите специалиста по верстке, который соберет попап вручную и добавит код на сайт. Из минусов — этот метод займет больше времени и скорее всего обойдется вам дороже.
• Использование плагинов. Есть различные плагины поп-апов, с помощью которых можно собрать нужное объявление. Есть отдельные плагины для WordPress, например, Ninja Popups for WordPress и Popups Generator. Из плюсов — с помощью плагинов легко самому собрать поп-ап.

Сервисы для создания всплывающих окон

Hello Bar

Hello Bar — это сервис по созданию баннеров и попапов. Имеет простой понятный в использовании интерфейс. Настройка проходит легко: нужно только ввести URL-адрес своего сайта, далее вы получаете инструкции по установке штрих-кодов и созданию медийной рекламы.

Детали

Официальный сайт: https://www.hellobar.com/

Язык интерфейса: английский

Бесплатный тариф: есть

A/B тестирование: есть

Аналитика: есть

Интеграция: есть

Отключение логотипа: платно

Стоимость: от 0$ до 99$ в месяц

Возможности сервиса

• имеет панель отчетов для отслеживания ответов на всплывающие окна;
• можно запускать popup-окна согласно триггерам;
• есть плагин WordPress;
• позволяет добавить кнопки социальных сетей;
• есть много шаблонов, CTA-кнопок и т. д.;
• интегрируется с Mailchimp, Segment, Campaign Monitor.

Преимущества:

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

Недостатки:

• Нет детального таргетинга. Настроить можно только геолокацию, тип устройства и источник трафика.
• За определенные функции нужно доплачивать.

Getsitecontrol

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

Все тарифы Getsitecontrol имеют одинаковый функционал. Цена пакета зависит не от количества инструментов, а от просмотров поп-апов. Как только вы достигните лимита показов по своему тарифу, попапы больше не будут всплывать.

Детали

Официальный сайт: https://getsitecontrol.com/

Язык интерфейса: английский

Бесплатный тариф: 2 недели на тестирование

A/B тестирование: есть

Аналитика: есть

Интеграция: есть

Отключение логотипа: платно

Стоимость: от 9$ до 29$ в месяц

Возможности сервиса

• функция запуска всплывающего окна согласно поведенческим триггерам;
• детализированная статистика. Можно узнать, как пользователи реагируют на попапы в зависимости от их местоположения, устройства и т.д.;
• большая галерея шаблонов, есть возможность ставить прямые ссылки на виджеты;
• интеграция с Shopify, Wordpress, BigCommerce, Magento, Squarespace, Tumblr и т.д.;
• поддерживает изображения в формате GIF, есть прямой доступ к фотостоку Unsplash, откуда можно добавлять фото в pop-up.

Преимущества:

• Широкий функционал, простая панель управления всеми семью виджетами.
• Есть редактор CSS.

Недостатки:

• Вы можете запустить popup форму только на одном сайте.
• Нет конструктора с перетаскиванием элементов.

Mailmunch

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

Детали

Официальный сайт: https://www.mailmunch.com/

Язык интерфейса: английский

Бесплатный тариф: есть

A/B тестирование: платно

Аналитика: платно

Интеграция: есть

Отключение логотипа: платно

Стоимость: от 9$ до 29$ в месяц

Возможности сервиса

• доступен запуск разных видов форм;
• имеет функцию триггерных поп-апов;
• можно выгружать данные из сервиса;
• интегрирован с MailChimp, Constant Contact, AWeber, Infusionsoft, ConvertKit, Klaviyo, ActiveCampaign, GetResponse, Campaign Monitor, Zapier и др.

Преимущества:

• Бесплатная версия имеет все необходимые функции для запуска и анализа попапов.

Недостатки:

• Большая часть привлекательных шаблонов доступны только в платной версии.

PopMechanic

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

Детали

Официальный сайт: https://popmechanic.io/

Язык интерфейса: русский

Бесплатный тариф: 1 неделя

A/B тестирование: платно

Аналитика: есть

Интеграция: есть

Отключение логотипа: платно

Стоимость: от 12$ в месяц

Возможности сервиса

• интегрируется с CRM, рассылками, чат-ботами, Google Drive;
• доступны функции сегментации аудитории;
• можно выгрузить данные о клиентах в CSV формате;
• детальная статистика по каждому попапу;
• поддержка стороннего HTML-кода;
• есть кнопка вызова форм.

Преимущества:

• Быстрая настройка форм, есть готовые макеты для быстрого запуска попапов.
• Можно загрузить готовый шаблон.
• Есть партнерская программа.

Недостатки:

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

AddThis

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

Детали

Официальный сайт: https://www.addthis.com/

Язык интерфейса: английский

Бесплатный тариф: есть

A/B тестирование: есть

Аналитика: есть

Интеграция: есть

Отключение логотипа: есть

Стоимость: бесплатно

Возможности сервиса

• интеграция с популярными приложениями CMS (Google AMP и WordPress);
• можно выбрать, кому показывать всплывающее окно на вашем сайте: новым посетителям, вернувшимся или всем;
• есть настройки источников трафика;
• можно выгрузить данные в формат CSV;
• адаптивный дизайн;
• есть функция учета интересов и геолокации пользователя.

Преимущества:

• Платформа полностью бесплатная.
• Быстрый и легкий запуск попапа.
• Простой интерфейс, подробная аналитика, много инструментов редактирования.

Недостатки:

• Мало шаблонов.

Sumo

Сервис Sumo заточен под сбор email-адресов. Через платформу также можно установить на сайт различные формы и виджеты. Бесплатный тариф имеет хороший набор функций: вы можете таргетироваться, проводить анализ кампаний, работать над дизайном форм. Плюс нет ограничений по количеству адресов.

Детали

Официальный сайт: https://sumo.com/

Язык интерфейса: английский

Бесплатный тариф: есть

A/B тестирование: есть

Аналитика: есть

Интеграция: есть

Отключение логотипа: платно

Стоимость: 39$ в месяц

Возможности сервиса

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

Преимущества:

• Бесплатная версия предоставляет огромный набор функций по редактированию popup.

Недостатки:

• Доступен только один макет для попапа.

Optimonk

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

Детали

Официальный сайт: https://www.optimonk.com/

Язык интерфейса: английский

Бесплатный тариф: есть

A/B тестирование: есть

Аналитика: есть

Интеграция: есть

Отключение логотипа: платно

Стоимость: от 29$ в месяц

Возможности сервиса

• есть интеграция с почтовыми сервисами;
• есть выбор различных видов окон;
• есть редактор drag-and-drop, HTML и JavaScript;
• работает функция запуска popup-окна, боковых панелей и липких полос.

Преимущества:

• Система распознает новых посетителей и вернувшихся, поэтому легко настроить персонализированные предложения.
• Имеет детальную аналитику с ключевыми показателями эффективности.
• Бесплатный тариф имеет неограниченное количество кампаний с условием просмотра страниц до 5000.

Недостатки:

• Модель ценообразования OptiMen основана на количестве просмотров страниц. Это может сделать инструмент слишком дорогим для среднего и малого бизнеса.

Plerdy

Plerdy — продвинутая платформа по созданию всплывающих окон. Можно запускать попап-окна по заданному сценарию. Для работы с платформой навыки верстки и программирования не потребуются.

Детали

Официальный сайт: https://www.plerdy.com/ru/

Язык интерфейса: русский

Бесплатный тариф: есть

A/B тестирование: есть

Аналитика: есть

Интеграция: есть

Отключение логотипа: платно

Стоимость: от 23$ до 79$ в месяц

Возможности сервиса

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

Преимущества:

• Можно создать сразу два pop-up на одной странице.

Недостатки:

• Есть ограничения по трафику и на использование с Duck Duck Go в Google Chrome.
• На бесплатном тарифе урезаны функции.

Leadgenic

Leadgenic — сервис с простым понятным интерфейсом. Есть бесплатная CRM. Настроить кампанию в Leadgenic проще, чем в других системах благодаря русскому языку интерфейса.

Детали

Официальный сайт: https://leadgenic.ru/

Язык интерфейса: русский

Бесплатный тариф: есть

A/B тестирование: платно

Аналитика: есть

Интеграция: есть

Отключение логотипа: платно

Стоимость: от 23₽ в сутки

Возможности сервиса

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

Преимущества:

• Возможность вставки своего HTML-кода.

Недостатки:

• Мало инструментов. Платформа подойдет для создания простых попапов.
• Расширенный таргетинг платный.

JumpOut

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

Детали

Официальный сайт: https://makedreamprofits.ru/jo/video/trial/

Язык интерфейса: русский

Бесплатный тариф: есть

A/B тестирование: есть

Аналитика: есть

Интеграция: есть

Отключение логотипа: есть

Стоимость: от 199₽ до 999₽ в месяц

Возможности сервиса

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

Преимущества:

• Гибкий таргетинг.
• Наличие партнерской программы.

Недостатки:

• Сложный перегруженный интерфейс.

OptinMonster

OptinMonster поддерживает все популярные типы pop-up: лайтбоксы, геймифицированные виджеты, плавающие окна и опросы. Имеет гибкие инструменты настроек, можно добавить свои шаблоны и вставить в форму свой HTML/CSS/JavaScript код.

Детали

Официальный сайт: https://optinmonster.com/

Язык интерфейса: английский

Бесплатный тариф: нет

A/B тестирование: есть

Аналитика: есть

Интеграция: есть

Отключение логотипа: платно

Стоимость: от 9$ до 49$ в месяц

Возможности сервиса

• имеет функцию запуска popup согласно поведению пользователя: выход с сайта, прокрутка страницы загрузка файла и т. д.;
• имеет конструктор перетаскивания, позволяющий легко создавать и настраивать всплывающие окна;
• расширенные критерии сегментации, есть ограничения по частоте показов;
• интеграция с Zapier, Marketo, Salesforce и другими платформами.

Преимущества:

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

Недостатки:

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

Privy

Privy — сервис создания всплывающих окон. С его помощью можно собирать электронные адреса и запускать геймифицированные pop up. Бесплатный тариф имеет лимит в 100 почтовых контактов и не позволяет таргетироваться.

Детали

Официальный сайт: https://www.privy.com/convert

Язык интерфейса: английский

Бесплатный тариф: есть

A/B тестирование: есть

Аналитика: есть

Интеграция: есть

Отключение логотипа: есть

Стоимость: от 15$ до 45$ в месяц

Возможности сервиса

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

Преимущества:

• Есть возможность сегментации посетителей сайта.
• Хорошее обслуживание клиентов.

Недостатки:

• Ограниченная отчетность. Для полноценного анализа надо вручную экспортировать данные и анализировать с помощью других инструментов.
• Пользовательский интерфейс довольно сложный в понимании.
• Есть ограничения по количеству контактов во всех тарифах.

Picreel

Picreel — многофункциональное программное обеспечение для конвертации всплывающих окон. Платформа имеет более 100 шаблонов всплывающих окон и порядка 700 интеграций.

Детали

Официальный сайт: https://www.picreel.com/

Язык интерфейса:английский

Бесплатный тариф: 30 дней

A/B тестирование: есть

Аналитика: есть

Интеграция: есть

Отключение логотипа: нет

Стоимость: от 29$ в месяц

Возможности сервиса

• настройки триггеров показа;
• большая библиотека шаблонов;
• функция персонализации рекламы;
• наличие тепловых карт и отчетов по воронке конверсий;
• более 700 интеграций со сторонними инструментами, такими как HubSpot, Mailchimp, Zapier, Wix и др.

Преимущества:

• Есть инструменты для отслеживания пути пользователя на сайте. Доступна функция записи сеанса.
• Гибкие настройки фильтров анализа.
• Хорошая работа саппорта.

Недостатки:

• Для новичков приборная панель может быть сложной в использовании.
• SEO-аудит можно провести только в отрезке в 30 дней.

Гайд: как создать всплывающее окно

С помощью конструктора или сервиса запусков всплывающих окно легко создать pop up, даже если вы раньше никогда этого не делали. Рассмотрим как сделать попап на примере Getsitecontrol.

Шаг 1. Перейдите во вкладку Widgets (виджеты) и в правом левом углу выберите «Start the template» (запустить шаблон). Создание попап с нуля происходит через кнопку «Create from scratch», она находится прямо под «Start the template».

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

Шаг 3. После того, как выберите нужный шаблон, можно приступить к его редактированию. Вы можете изменить заголовок, рекламный текст и добавить фото. Редактор текста имеет примерно тот же набор функций, что и документ Word, то есть вы можете написать текст курсивом, подчеркнуть его, добавить активный линк, изменить цвет и т. д.

В редакторе также можно указать размер pop-up, изменить содержание полей и вместо картинки добавить GIF.

Шаг 4. После того, как описание popup будет готово, можно переходить к настройкам таргетинга. Вкладка находится в верхней панели.

1. В настройках таргета указываете сайты, на которых хотите запустить всплывающее окно.
2. В разделе «Display widget if» указываете ГЕО, устройства, визиты (показывать всем посетителям, только новым людям на сайте и т. д.).
3. Указываете показ виджетов. По умолчанию установлен автоматический режим, но вам доступны и триггерные показы:
   • глубина прокрутки;
   • бездействие;
   • время на странице;
   • время на сайте;
   • виджет всплывает, когда посетитель собирается покинуть страницу.
4. Указываете время показов.

   

Шаг 5. Переходите ко вкладке «Notifications». Здесь можете указать адрес электронной почты, на которую будут приходить уведомления, когда пользователи будут совершать целевое действие. Также есть возможность установить автоответчик прямо в Getsitecontrol.

Шаг 6. Перейдите во вкладку «Integrations». Здесь можно добавить сервисы, с которыми вы хотите интегрировать свои поп-апы. Например, доступна интеграция с Google Analytics.

Шаг 7. Сохраните все внесенные изменения. Сделать это можно, нажав кнопку «Save» в правом верхнем углу.

Перед запуском, можете нажать на предпросмотр. В главном меню Getsitecontrol вам будет доступна статистика.

Правила эффективного поп-апа

Если правильно собрать поп-ап, то можно увеличить конверсию и удержать пользователей на сайте. Для это нужно придерживаться правил:

• Пишите только о главном. В хорошо продуманном поп-апе не должно быть больше двух предложений. Люди почти никогда не читают детали, поэтому кратко и лаконично укажите суть оффера и призыв к действию. Самое важное можно подчеркнуть жирным шрифтом.
• Не скрывайте значок «закрыть». Пользователи негативно реагируют на ситуации, когда не могут отключить поп-ап. Обычно они ждут несколько секунд, уходят с сайта, а вы не получаете нужные контакты. Поэтому лучше не прятать значок «закрыть», так у вас будет больше шансов добиться целевого действия.
• Не запускайте поп-ап при входе на сайт. Это раздражает пользователей, и они сразу покидают сайт. Это приводит к тому, что вместе с потенциальным клиентом вы теряете и позиции в поисковой выдаче. Поисковики сейчас учитывают поведенческие факторы, и быстрый уход пользователя с сайта служит сигналом, что страница не интересна читателям. Из-за этого поисковые системы убирают сайт из ТОП-выдачи.
• Не используйте призыв к действию преждевременно. Пока пользователь не познакомился с вашим продуктом, он вряд ли согласится оставить свои контакты. И поп-ап скорее всего будет закрыт сразу же, как только появится на экране. Если вы решите запустить его повторно этому же пользователю, он скорее всего посчитает рекламу навязчивой и покинет сайт.

За какие pop-up ваш сайт могут заблокировать

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

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

Примеры продающих popup

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

Цвет поп-ап

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

Поп-ап с инфоповодом

Обычно такие всплывающие формы рассказывают об акциях, связанных с конкретными днем. Например, Черная пятница, рождественские скидки и т. д.

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

Поп-апы под гейминг

Это окна, которые предлагают пользователю сыграть в игру. Самый популярный вид «геймифицированный» pop-up — это вращающееся колесо удачи. Он привлекает внимание пользователя и стимулирует его совершить целевое действие.

Что такое гейминг-вертикаль, как лить трафик в 2022 году можно узнать из нашей статьи.

Заключение

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