Всплывающие окна уходят в прошлое. Чем их заменить?

Pop-out — всплывающие мини-окна

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

Главные их преимущества:

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

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

Pop-out окно расположено в нижнем правом углу экрана

Pop-out окно расположено в нижнем правом углу экрана. Это место стало классическим для окон чат-ботов.

Pop-out окно расположено тоже в нижнем правом углу экрана, но оно свернуто

Pop-out окно расположено в нижнем правом углу экрана в свернутом состоянии. Пользователь видит только его заголовок.

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

Группа Pop-out окон, на одном сайте

Lamoda применила на сайте целую группу pop-out окон, одно из которых развернуто полностью, а другие показываются только с помощью заголовков или иконок.

Полупрозрачный баннер

Баннер, имеющий полупрозрачный фон, занимающий около 15% пространства всего экрана, расположенный во всю его ширину, используется на многих известных сайтах. На баннере есть кнопка для закрытия, заголовок, текст объявления, изображение и форма ввода контактных данных для подписки. Если посетитель не закроет рекламную строку крестиком, то она исчезнет через заданный промежуток времени.

Полупрозрачный баннер Лайфхакера

Альтернатива всплывающим окнам — полупрозрачные баннеры. Закрываются крестиком или самостоятельно через заданное время.

Карусель баннеров

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

Карусель слайдер баннеров на сайте Сбербанка

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

Чат

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

Чат на сайте мебельного центра

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

Форма сбора контактных данных

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

Форма подписки в конце статьи красочна и привлекательна. Она не перегружена полями: только имя и электронная почта — больше и не надо.

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

Баннеры-сайдбары

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

На этом баннере-сайдбаре повторяется надпись о распродаже и скидках до 70%. На мобильниках этот элемент не виден.

Пуш-окна

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

Push-уведомление сайта Google с запросом на разрешение собирать данные о местоположении пользователя.

Нативная реклама

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