Главное Свежее Вакансии Образование
Выбор редакции:
1 460 2 В избр. Сохранено
Авторизуйтесь
Вход с паролем

23 ошибки при создании поп-апов: подробный чек-лист и подсказки, как создать эффективное всплывающее окно

Мы знаем — у поп-апов не самая лучшая репутация. Но здравый смысл и тесты на реальном трафике подсказывают, что пользователи позитивно воспринимают поп-апы, появляющиеся по событию. Давайте разберем типичные ошибки и составим план создания эффективного поп-апа.

1. Сайт долго загружается из-за подключения стороннего сервиса


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

Как лучше: замеряйте скорость загрузки сайта перед добавлением поп-апов с помощью PageSpeed Insights, установите скрипт и сделайте повторный замер. Чем меньше изменятся показатели, тем лучше.

Протестируйте разные сервисы, чтобы найти оптимальный вариант.

2. Всплывающее окно появляется сразу после захода на сайт


Как лучше: дайте пользователю возможность ознакомиться с сайтом и получить пользу перед тем, как просить email или телефон. Это увеличит конверсию в подписку на 1-2%.

Чтобы выбрать оптимальное время для показа, посмотрите среднюю длительность сеанса (время пребывания на сайте) по Google Analytics или Яндекс.Метрике, и настройте отображение поп-апа через ½-⅓ от этого времени. Например, если длительность сеанса на вашем сайте составляет 60 секунд, человек будет готов взаимодействовать с всплывающим окном через 20-30 секунд после захода на страницу.

3. Поп-ап не адаптирован для мобильных


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

Как лучше:

  1. ищите сервис, в котором используется адаптивная верстка всплывающих окон;
  2. если в форме два и больше поля, располагайте их в столбик;
  3. размер поля — от 30 px, кнопок — от 42 px;
  4. проверьте, чтобы текст помещался на поп-апе при отображении на небольших экранах.

4. Механики накладываются друг на друга


Обычно кроме поп-апов на сайте используются онлайн-чаты и уведомления: web push, согласие на использование файлов cookies, возрастные ограничения. Идеально, если окна будут появляться в разное время, допустимо — если будут располагаться в разных частях окна.

Как лучше:

  1. настройте условия таргетинга для всех уведомлений в зависимости от поведения или действия посетителей сайта;
  2. проверьте, чтобы окна не накладывались друг на друга на десктопах и мобильных.

5. Окно невозможно или сложно закрыть


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

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

6. Окно всплывает повторно после закрытия


Как лучше:

  1. если человек взаимодействовал с активными элементами поп-апа (заполнял поля, отправлял данные), отключите показ при следующих посещениях сайта;
  2. для посетителей, которые закрыли окно, нажав на крестик, можно настроить повторный показ через несколько сеансов.

7. Отсутствие таргетинга


Универсальные поп-апы плохо конвертируют по трем причинам:

  1. Несвоевременный месседж: в первые 10-15 секунд на странице, во время регистрации или оформления заказа.
  2. Баннерная слепота — человек оценивает привлекательность сообщения за доли секунды. Если всплывающее окно не успевает зацепить визуалом или заголовком, его закроют.
  3. Отсутствие персонализации.

Как лучше: составьте customer journey map, чтобы понять, какие поп-апы с какими офферами будут актуальны пользователям на разных этапах взаимодействия с сайтом.

8. Форма подписки всплывает для тех, кто уже совершил целевое действие


Как лучше: исключите показ поп-апов по UTM-меткам. Если человек перешел на сайт с рассылки или залогинен в личном кабинете, у вас с 99% вероятностью есть его email и имя. Конечно, вы можете собирать дополнительные данные — номер телефона, дату рождения — но детально продумывайте условия таргетинга, чтобы не потерять лояльность навязчивыми сообщениями.

9. Некачественный дизайн


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

  1. делать цветастый, кричащий и, тем более, кислотный баннер;
  2. добавлять анимацию: мигание, пульсация и другие визуальные эффекты скорее отпугнут, чем заинтересуют;
  3. привлекать внимание агрессивным звуковым оповещением;
  4. использовать шрифты или картинки, не соответствующие стилистике бренда.

Как лучше: адаптируйте дизайн поп-апа под фирменный стиль сайта и помните: яркая картинка работает только в связке с интересным для посетителей сайта посылом.

10. Нет галочки о согласии на сбор и обработку персональных данных


Хотя регламент GDPR работает в рамках ЕС, фактически он распространяется на весь интернет. Чтобы избежать штрафа в €10 млн или 2% от оборота, позаботьтесь о законности работы с персональными данными.

Как лучше: если вы собираете номера телефонов, почты, имена пользователей и другие данные, добавьте в поп-ап:

  1. ссылку на политику конфиденциальности;
  2. непредзаполненное поле о том, что человек согласен с вашими условиями обработки данных и/или получения промоматериалов.

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

11. Больше трех полей


Соблазн собрать максимум данных за раз толкает маркетологов на создание форм-простыней. Но вместо ценной информации посетители дают отказы...

Как лучше: один поп-ап — одно действие. Для форм подписки допустимо делать до трех полей: например, запрашивать имя, email и номер телефона.

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

12. Поля без плейсхолдеров, валидации и маски ввода номера телефона


Как лучше:

  1. В каждое поле добавить подсказку для заполнения, которая исчезает при клике. Например, «example@gmail.com» в случае запроса email.
  2. Email валидировать соответственно стандарту RFC 2821.
  3. В поле номера телефона добавить маски ввода для всех стран, с которых предположительно может идти трафик.

13. В случае ошибки нет подсказки, что не так и как это исправить


Подсказки для заполнения и валидация не спасают от ошибок. Если данные неверны, избегайте сообщений «Ошибка 548» или «Что-то пошло не так» — они запутывают пользователей.

Как лучше:

  1. Выводите сообщение в том месте, где была допущена ошибка.
  2. Объясняйте человеческим языком, что система или человек сделал не так, и как это исправить. Например, «Email не должен содержать русских букв», если пользователь ввел email кириллицей.

14. В случае ошибки данные с правильно заполненных полей удаляются — нужно начинать заново!


Как лучше:

  1. Валидируйте поля в два шага — сразу после заполнения на стороне клиента, а потом на сервере в момент отправки формы. Это уменьшит процент ошибок.
  2. Если ошибка допущена, дайте возможность откорректировать конкретное поле, сохранив корректно введенные значения.

15. Предложение не несет ценности для посетителей сайта


Скидки и акции греют душу, но далеко не в каждом бизнесе потенциальных клиентов настолько легко «купить».

Как лучше: в рамках А/В теста проверьте реакцию пользователей на материальную выгоду (скидку) и мотивационную (результаты исследования, чек-лист, гайд, подборку инструментов). Также попробуйте геймификацию: возможность получить секретный приз или предсказание.

16. Не ясна выгода


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

Как лучше: четко и ёмко опишите выгоду, которую пользователь получит в обмен на контактные данные или подписку на чат-бота. Например, «Подпишись на нас в Telegram, чтобы узнавать о скидках на час раньше остальных».

17. Можно взять скидку или ценный контент, ничего не отдавая взамен


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

Как лучше: делитесь пользой в обмен на персональные данные или подписку. И не забудьте отсеять халявщиков: если серьезную скидку можно получить в обмен на email, люди начнут вводить фейковые почты. Чтобы избежать сбора некачественной базы, настройте Double Opt-in или запрашивайте номер телефона.

18. Много текста


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

19. Нет CTA


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

Как лучше: сделайте призыв к действию заметным, выделите его цветом и размером на фоне других визуальных элементов поп-апа. Текст должен содержать короткие глаголы: «Хочу чек-лист», а не «Скачивание чек-листа».

20. Нет благодарности после подписки


Если поп-ап не ведет на посадочную или в чат-бота, позаботьтесь о том, что увидит пользователь после выполнения целевого действия.

Как лучше:

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

21. Нет статистики по каждому отдельному поп-ап


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

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

Например, в 13chats по каждому отдельному поп-апу отображается количество:

  1. просмотров виджета;
  2. вовлеченных в диалог посетителей;
  3. диалогов;
  4. подписчиков чат-бота, собранных конкретным сценарием.

22. Поп-ап сделан раз и навсегда


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

23. Полученные с помощью формы данные нужно вручную копировать для передачи в CRM или сервис отправки рассылок


Как лучше: чтобы уменьшить объем рутины, используйте выгрузку CSV или автоматическую передачу в сервис рассылок, CRM и базы компании. Например, у нас в 13chats готова интеграция с сервисом для автоматизации маркетинга SendPulse.

И немного инсайдерской информации: в разработке нативная интеграция 13chats с AmoCRM и Битрикс24 для тех, кто ценит автоматизацию и сквозную аналитику.

Выводы


Поп-апы — полезный сервис для лидогенерации, сбора базы для рассылки, повышения конверсии сайта, информирования и получения обратной связи. Конверсия в 1-2% считается нормальной, но правильная настройка может увеличить эффективность всплывающего окна до 10-20%.

5 секретов эффективного поп-апа:

  1. таргетинг и техническая настройка;
  2. цепляющий визуал;
  3. актуальный и емкий оффер;
  4. ценность для ЦА;
  5. призыв к действию ради получения выгоды.

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

Это бесплатно и ни к чему вас не обязывает.

+1
В избр. Сохранено
Авторизуйтесь
Вход с паролем
Комментарии
SendPulse
SendPulse автоматически увеличивает открываемость маркетинговых email рассылок
удаленный пользователь
Отличный гайд! Спасибо 13chats)
Ответить
13chats
Онлайн-сервис для автоматизации коммуникации и продаж
Выбрать файл
Блог проекта
Расскажите историю о создании или развитии проекта, поиске команды, проблемах и решениях
Написать
Личный блог
Продвигайте свои услуги или личный бренд через интересные кейсы и статьи
Написать

Spark использует cookie-файлы. С их помощью мы улучшаем работу нашего сайта и ваше взаимодействие с ним.