Содержание:

  1. Предназначение и виды поп-ап окон
  2. Функции всплывающих окон
  3. Как правильно оформить pop-up
  4. 7 принципов эффективного pop-up window
  5. Заключение

Всплывающее окно на сайте (pop-up window) — формат онлайн-рекламы. Это блок с коротким сообщением, который всплывает во время посещения сайта. Цель — конвертировать посетителя в подписчика или клиента. Соответственно, окна чаще всего используют для сбора e-mail, увеличения количества подписчиков в соцсетях, активизации продаж.

По результатам анализа 1,75 миллиардов поп-ап окон, средняя их конверсия составила 3,09%. А у правильно оформленных окон показатель находится на уровне 9,28%. Мы расскажем о pop-up и научим правильно пользоваться этим инструментом.

Предназначение и виды поп-ап окон

Считается, что поп-ап окна необходимы для мотивации посетителей сайта. Они побуждают на конкретные действия: принять участие в акции, подписаться на предложение, оставить контакты, подтвердить e-mail рассылку. Если правильно оформить и настроить всплывающие окна, можно увеличить вовлеченность клиентов и продажи. С другой стороны, есть риск отсеивания аудитории, которую поп-ап раздражают. Правильный выбор в каждом случае индивидуальный.

Отличают два типа pop-up:

1. Hello-board — перекрывает определенную часть экрана и не мешает навигации по сайту, чтению страницы. Вызывает минимум раздражения, но и эффективность у него низкая. Ведь пользователи могут оставаться на странице и знакомиться с контентом, просто игнорируя окно.

Hello board

2. Page-stop — полностью перекрывает функционал сайта, появляясь по центру экрана или занимая существенную его часть. Предоставляет пользователю несколько вариантов действий: либо принять условия (подписаться, перейти и т.п.), либо закрыть поп-ап. Эффективность инструмента высокая, но уровень раздражения от него тоже выше.

Page stop

Функции всплывающих окон

Если систематизировать часто встречающиеся виды pop-up, можно определить несколько вариантов окон с разными функциями.

Приветственные

Всплывающее окно-приветствие появляется сразу после загрузки страницы. Это не всегда комфортно для пользователей. Но есть ситуации, когда приветственные поп-ап оправданы. Например, чтобы сообщить посетителям важную информацию. В ситуациях, когда нужно создать ощущение неотложности, инструмент работает эффективно. Как пример: продажа последних билетов на конференцию, объявление об ограниченной по времени скидке. Nike, например, просто советует «быть первым получателем эксклюзивов». 

nike popup window

Всплывающие после прокрутки

Такие поп-ап окна появляются, как только посетитель в процессе прокрутки страницы доходит до заданного места. Например, если он приближается к середине статьи или к упоминанию о вариантах заказа. Окно можно настроить под любой параметр, в зависимости от маркетинговых целей. Варианты применения: предложение оформить подписку, как только пользователь дочитал статью. Или pop-up window со ссылкой на релевантный контент.

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

Окна, всплывающие по графику

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

Pop-up с вопросом

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

Pop-up с вопросом

Источник: optinmonster.com

Как правильно оформить pop-up

Задача — сделать всплывающее поп-ап окно, которое будет не раздражать, а приносить лиды. Для начала разберем, каким должен быть pop-up, настроенный на высокую конверсию. Стандартные требования:

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

Оформление pop-up

2. Уважительное отношение. Оригинальность, фамильярность и прочий «креатив» — хорошо, но не всегда уместно. В поп-ап нужно общаться на языке своей аудитории.

3. Уместность. Нужно выбрать вид и функцию всплывающего окна, соответствующую моменту. Это непросто: придется экспериментировать и сравнивать эффективность. Но логику тоже нужно учитывать. Например, новый посетитель блога не будет на первой же секунде оставлять адрес и подписываться на обновления.

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

5. Четкий призыв к действию. Пользователь должен точно понимать, чего от него ждут: просмотра, подписки, заказа, контактов, лайка на странице соцсети. Цель нужно выразить в 1-2 коротких предложениях.

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

6. Адаптивность. Большая часть интернет-трафика сейчас принадлежит пользователям с мобильными устройствами. Поэтому поп-ап должен помещаться на экране смартфона и обеспечивать функционал для взаимодействия с сенсорным экраном.

А у вас уже есть логотип для оформления pop-up станицы?

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

Элементы всплывающего окна

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

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

Элементы всплывающего окна

Форма. Стандартный квадрат или прямоугольник уже никого не удивляет. Поэтому можно экспериментировать. Как вариант — круглая форма. Или же уникальный формат. 

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

Брендированное поп-ап окно

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

Редактор брендов Логастер

Форма для заполнения. Максимально простая и короткая. Чем короче формы — тем больше вероятность получения лидов. Например, в поп-ап для подписки достаточно двух полей: e-mail и имя пользователя.

Пример поп-ап Email

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

Кнопка действия. Значение имеют текст, форма и цвет кнопки. Все это — поле для экспериментов, так как нет универсальных рекомендаций для всех сайтов. Например, в AppSumo пришли к выводу, что большую конверсию вызывают кнопки зеленого и красного цвета, минимальную — оранжевого.

pop up button color

Кнопка отказа или выхода. Ее нельзя прятать. У пользователя должна быть возможность быстрого закрытия поп-ап окна без длительного поиска функционала. Что можно попробовать:

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

Куки. Чтобы избежать спама, предусмотрите на поп-ап окне опции «Не показывать больше» или «Я уже подписан». Отметив нужное поле, пользователь уже не увидит этот всплывающий pop-up.

7 принципов эффективного pop-up window

1. Ясность. Понятность посыла, возможность быстрого прочтения и осознания. Учитывается не только текст, но и применение изображений.

2. Контроль. Способность посетителя управлять диалогом: согласиться, отказаться или закрыть окно.

3. Оригинальность. Необычный подход дает больше возможностей привлечь аудиторию.

pop-up window

4. Релевантность. Соответствие поп-ап окна тематике страницы.

5. Эмоциональность. Успешный pop-up вызывает положительные эмоции и даже желание сделать скрин, чтобы показать его знакомым.

6. Ценность. Принцип справедливого обмена: что получает посетитель в обмен на свое положительное решение.

7. Ответственность. Уважение права пользователя на объективное решение. Это значит, что кнопка отказа не сопровождается оскорбительной фразой. Например: «Нет, я дальше буду смотреть фильмы платно», «Нет, я лузер и не хочу стать бизнесменом».

Пример pop-up window

Источник: doneforyou.com

Заключение

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

Создавайте свой дизайн сейчас

Приступите к разработке своего фирменного стиля прямо сейчас. Введите название своей компании — и всего через минуту логотип будет у вас! Попробуйте сами! Нет ничего проще!

Хотя бы 3 символа в длину.