Контент

8 ошибок попапов, или почему вам кажется что они не работают.

01 мартa ~ 8 мин читать 1604 просмотры
оценить
Claspo Blog 8 ошибок попапов, или почему вам кажется что они не работают.

А вас раздражают попапы? 73% пользователей утверждают, что негативно относятся к всплывающим окнам. Но это не мешает маркетологом продолжать использовать их. Почему? Ответ довольно простой – они работают!

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

Попапы появились в середине 1990-х годов с подачи дизайнера и программиста Итана Цукермана, который в то время работал в компании Tripod. Он и не подозревал, что разработал эффективную бизнес-модель, которая позволила зарабатывать деньги за счёт показа интернет-рекламы без непосредственного размещения сообщения на веб-странице. И глядя на то, как используют его детище сейчас, Цукерман искренне раскаивается: «Я прошу прощения. У нас были добрые намерения».

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

8 ошибок в использовании попапов + антикейсы

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

Использование попапов

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

mango shop example.png

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

cocacolanderland example.png

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

Слишком много данных

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

hellobc example.png

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

example adidas store.png

Также и общая перегруженность окна информацией может оттолкнуть потенциального клиента. Не старайтесь обезопасить себя и прописать все особенности взаимодействия с пользователем. Выделите для этого отдельный блок на сайте и сделайте попап максимально лаконичным.

Неудачное время показа

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

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

1.png

thredup.png

oldnavygap.png

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

Перегруженность попапами

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

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

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

example puma shop.png
 

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

В ходе исследований было обнаружено, что мобильная версия попапов конвертирует лучше, чем десктоп почти в 2 раза (5,8% против 3,11%). Но сделать всплывающие окна на мобильном user friendly задача не из простых. Из-за небольшого размера экрана любой попап занимает относительно больше площади, чем на десктопе. Кроме того, мобильные устройства предполагают использование “на ходу”, а любые нагромождающие дисплей элементы будут только мешать этому.

Как вывод – то, что раздражает пользователей на десктопе, в мобильной версии сделает интерфейс максимально непригодным к использованию. 

example puma shop mobile.png

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

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

hsbc example.png

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

Неуместный дизайн попапа

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

trendgalleryart example.png

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

Кроме того, интересным выводом после анализа всплывающих окон поделились Sleeknote – попап окна с картинками конвертируют гораздо лучше, чем без картинок (3,8% против 2,07%). Пользователи становятся все более избалованными красивым и качественным контентом. Не стоит недооценивать визуальную составляющую и единство стиля на вашем сайте. 

Ограничение выбора пользователя

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

example.png

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

Можно дорисовать вариант с еле видным крестиком или очень мелким шрифтом по примеру ниже из sumo.com 

Плохой таргетинг 

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

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

example puma.png

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

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

Технические ошибки в реализации попапов

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

Например, подскажите клиенту, если он допустил ошибку при заполнении поля электронной почты. Все имейлы должны соответствовать определенным стандартам, их нужно учесть при валидации и подсвечивать ошибку пользователю (наличие @, использование допустимых символов на допустимых позициях и т.д.).

winesonline example.png

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

Заключение

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

Любите своих клиентов и делайте их опыт взаимодействия с вами максимально приятным.

 

Вас также может заинтересовать
Cart Abandonment.svg
Что такое Floating Bar: 10 примеров и советы по использованию

Что это такое floating bar Floating bar — это pop-up, который закрепляется сверху или снизу сайта и остается видимым при скролле страницы. В Floating bar можно разместить напоминание об окончании распродажи, форму подписки или направить трафик на определенный лендинг.  Преимущества использования floating bar Ненавязчивость Floating bar не отвлекает пользователей от основного контента сайта и не требует совершить дополнительных действий, чтобы продолжить просматривать страницу (например, подписаться или закрыть форму).  UX-friendly Floating bar вмещает минимальное количество контента, который не закрывает карточки товаров,...

05 мартa 9 мин читать
10 Effective Ways to Grow Your Email List in 2022.svg
10 Эффективных способов расширить свою базу email адресов в 2022 году

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

25 февраля 13 мин читать