Всплывающие окна на сайте: как заинтересовать ваших пользователей

AdmiraДизайн, О сайтах и блогах4 Comments

Всплывающие окна на сайте: как заинтересовать ваших пользователей

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

Но, каким бы ни было отношение  к попапам, этот инструмент эффективный и имеет место быть, но нужно уметь его правильно использовать. =)

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

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

Всплывающие окна на сайте

Попандер (Pop-Under) – когда при переходе на сайт появляется баннер, но не мешает посетителю взаимодействовать с сайтом.

Всплывающие окна на сайте

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

Для чего можно использовать:

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

Основные элементы, которые должно содержать всплывающее окно:

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

Рекомендации по контенту

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

1. Полезным. Скидка 5% или 100 рублей на баланс вряд ли кого-то привлекут, поэтому предлагайте интересные бонусы.

От такого предложения будет трудно отказаться:

Всплывающие окна на сайте

2. Уместным. Не нужно в книжном разделе предлагать купить купальники или автозапчасти. Также сомнительно выводить всплывающее окно на Главной, когда пользователь только зашел на сайт. Дайте ему время изучить основную информацию, перейти на интересующую страницу.

Хорошие варианты

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

Регистрация на сайте уместна, но пользователь только зашел на сайт и так агрессивно нападать на него не стоит:

Всплывающие окна на сайте

3. Понятным. Кратко и прозрачно изложите суть предложения. Длинные сообщения и невнятные условия отталкивают. Обязательно укажите выгоду для клиента.

Лаконичные предложения:

  • «Дарим 1 000 рублей за подписку на наши новости» + форма подписки.
  • «Скидка 20% на первый заказ» + форма регистрации.
  • «Посмотрите похожие товары со скидкой» + ссылка на соответствующий раздел.
4. Визуально привлекательным. Анимацию лучше исключить, а на выбранные цвета должно быть приятно смотреть. От видео и музыки с автопроигрыванием тоже стоит отказаться, чтобы не пугать пользователя. Если используете изображения, то обязательно высокого качества. Также текст должен хорошо контрастировать с фоном.
5. С возможностью отказаться. Кнопка «Закрыть» должна быть заметна и удобна для клика.

Заметная небольшая кнопка:

Всплывающие окна на сайте

6. Ненавязчивым. Показывайте предложение каждому пользователю один раз. Можно повторять показ не чаще раза в неделю.

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

Слишком большой и яркий баннер, да еще второе окно ниже:

Всплывающие окна на сайтеТоже яркий, но ненавязчивый пример всплывающего окна на сайте:

Всплывающие окна на сайте

Технические особенности

Добавить всплывающие окна на сайт можно:

  • С помощью HTML и JavaScript.
  • Применяя плагины для вашей CMS. Например, если у вас сайт на WordPress, то для него есть готовые плагины ITRO Popup Plugin, Optinmonster, YITH Newsletter Popup и др.
  • Используя готовые сервисы: Witget, PopMechanic, CartProtector и др.

Основные варианты настройки:

  • Показ окна после определенного времени. Оптимальное время – 30-90 секунд, когда пользователь уже изучил основную информацию на странице.
  • Сообщение для новых пользователей. Как и для предыдущего способа, лучше выждать немного времени, чтобы не отталкивать посетителя. Рекомендуем предлагать крупный бонус за регистрацию или первый заказ. Такой вариант особенно подойдет для Главной страницы.
  • Вывод окна после прокрутки до определенного места страницы. Хороший вариант для статьи, когда пользователь прочитал ее полностью, или для страницы каталога, когда пользователь дошел до конца списков товаров и ничего не выбрал. Можно показывать сообщение чуть раньше, после прокрутки 50-70% страницы.
  • Показ перед закрытием сайта. Когда курсор направляется в сторону закрытия вкладки, можно тоже показать всплывающее окно.
  • Сообщение для вернувшихся пользователей. Посетитель уже явно заинтересован в вашем продукте, поэтому почему бы не рассказать ему о дополнительных возможностях.

Еще совет: не пытайтесь обойти системы блокировки. Если клиент использует Adblock или другие блокировщики рекламы, то это его право.

Отношение поисковых систем

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

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

Google тоже сообщил, что нужно аккуратнее использовать всплывающие окна, особенно на мобильных. Попадают в зону риска баннеры на весь экран и те, что мешают изучению основной информации на сайте. Еще можно отметить рекомендации от Coalition for Better Ads, на которые ориентируется Google Chrome при блокировке рекламы.

В целом поисковые системы не против всплывающих окон, если они полезны для пользователя.


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

Источник

4 Comments on “Всплывающие окна на сайте: как заинтересовать ваших пользователей”

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

  2. Странно, что озвучено мнение поисковых систем на счет всплывающих окон, но все еще остаются люди, которые к попандеру «хотите мы перезвоним» добавляют еще и «как? Вы уже уходите?»

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

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

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *