Поп-апы: 10 плохих трендов и их альтернативы
Перевод статьи Анны Кэлей с nngroup.com.
Всплывающие окна. Сегодня уже одно это словосочетание вызывает неприятные ассоциации. Куда бы мы не зашли: на сайт компании, в онлайн-магазин, в приложение, — они поджидают нас везде.
И почему-то в большинстве случаев в самый неподходящий момент.
Независимо от того, какого они вида, большинство поп-апов оказываются неуместными, прерывают пользователей во время выполнения важных задач и дезориентируют их.
Специалист по UX NN Group Анна Кэлей провела небольшой эксперимент. В течение нескольких недель она фиксировала каждый поп-ап, который попадался ей на сайтах или в приложениях. В среднем получилось 25 всплывающих окон в неделю. Автор пишет, что это гораздо больше, чем должен пережить обычный пользователь.
Этот эксперимент, а также мои исследования выявили множество плохих случаев применения поп-апов. Их чрезмерное использование все еще в разгаре. Веб-сайты настолько злоупотребляют этими элементами, что количество проблем от них уже превышает количество пользы.
Благодаря пользовательским исследованиям, которые проводятся уже десятилетиями, мы знаем, что люди не любят всплывающие окна. Я вспомнила об этом благодаря недавнему случаю во время одного из юзабилити-исследований. Пытаясь выполнить какую-то задачу, участник бросил свой телефон на стол после нескольких всплывающих окон, которые появлялись одно за другим. Он был разочарован, отказался от своей задачи и покинул сайт. В результате у него сформировалось очень плохое впечатление о компании. Другие участники исследования разделяли его мнение, хотя и не бросались своими телефонами.
Итак. Всплывающие окна можно классифицировать по двум параметрам.
- Может ли пользователь взаимодействовать с остальной частью страницы:
- Модальные: содержимое на странице отключено, пока пользователь не будет явно взаимодействовать с поп-апом.
- Немодальные: пользователи могут по-прежнему взаимодействовать с фоновым контентом (например, выбирая ссылки или нажимая кнопки), пока поп-ап тоже остается видимым.
2. Затеменен ли фон:
- Если фон затемнен, всплывающее окно называется «лайтбокс».
- Фоновое содержимое не затемнено. (Специального названия для такого вида поп-апов нет.)
Поп-ап тайминг: не показывать до взаимодействия или во время критических задач
- Отображение всплывающего окна до загрузки содержимого главной страницы
Никогда не показывайте поп-ап до того, как пользователь ознакомился с вашим сайтом или приложением. Это выглядит очень навязчиво, потому что выполнение задачи пользователя прерывается еще до того, как он или она попадает на страницу. Люди привыкли видеть преждевременно всплывающие окна и обычно игнорируют их или сразу же ищут самые быстрые способы закрыть их. Всплывающие окна, которые появляются еще до загрузки страницы, приводят пользователей в бешенство. Кроме того, такие сайты рискуют получить низкий рейтинг в результатах поисковых систем. Google наказывает сайты, которые делают свой контент менее доступным для пользователей, особенно на мобильных устройствах.
Что делать вместо этого: Дождитесь определенного момента, когда контент всплывающего окна будет действительно релевантен для пользователя. Используйте «принцип взаимности»: повысьте ценность своих пользователей. Проведите тестирование, чтобы определить контекст, подходящий для контента, который вы планировали отобразить в поп-апе. Выясните, как лучше всего отобразить этот контент, — во многих случаях это будет вовсе не поп-ап.
Единственный допустимый вариант использования поп-апа до загрузки содержимого страницы, — это когда ваш сайт юридически обязан запрашивать согласие пользователей на использование файлов cookie или проверять их возраст.
2. Отображение всплывающего окна сразу после входа (log in) пользователя
Поп-ап, отображаемый сразу после входа пользователя, так же утомляет, как и поп-ап, появляющийся еще до загрузки содержимого страницы. Когда пользователи заходят в свою учетную запись, у них на уме следующий шаг или задача — иначе зачем бы они заходили в систему?! Поскольку они уже сосредоточены на следующем своем шаге, вероятно, они не станут обращать внимание на всплывающее окно или быстро закроют его. Более того, это может раздражать их.
Что делать вместо этого: Дайте пользователям время и пространство для выполнения своих задач после входа в учетную запись. Не показывайте им всплывающие окна сразу. Через некоторое время можно предложить пользователю полезные советы, рекомендации или новые функции учетной записи. Но это работает только в том случае, если контент может помочь пользователю в выполнении его задачи, расширить его возможности. В таких случаях всегда лучше использовать менее навязчивые методы: всплывающие подсказки и небольшие немодальные окошки.
3. Запрос адреса электронной почты до взаимодействия с пользователем
Многие сайты и приложения используют всплывающие окна, чтобы запросить e-mail пользователей до их какого-либо взаимодействия с контентом. e-commerce, новостные сайты и приложения, а также блоги чаще всего были нарушителями в этой категории.
Такой подход плох. Тот факт, что сайт запрашивает адреса электронной почты слишком рано, не только раздражают людей, но и предполагает, что сайт будет рассылать спам.
Например, одна из пользовательниц, которая попала на сайт Uncommon Goods, была недовольна, когда увидела поп-ап с просьбой предоставить свой email для доступа к «секретным продажам». Она сказала: «Меня действительно раздражает, когда появляются подобные вещи, прежде чем я что-то еще делаю на сайте. Как мне узнать, хочу ли я стать подписчиком, если я только что пришла на этот сайт? Я бы предпочла увидеть это чуть позже».
Сайты и приложения часто используют быстрые поп-апы из-за кратковременного повышения показателей, которые они дают. Тем не менее, это приводит к разочарованию многих пользователей, которых не мотивируют произвольные стимулы, такие, как «секретные продажи».
Что делать вместо этого: Подумайте, когда пользователям будет удобнее делиться своими email с вами. Они просматривают категорию, к которой есть подходящий промокод? Или, может быть, они только что прочитали весь пост в блоге. Эти действия могут быть подходящими триггерами для ненавязчивого немодального поп-апа рядом с верхним или нижним правым углом, занимающего разумное пространство. Предложите пользователям что-то ценное и существенное в обмен на их email. Не ждите, что они просто так вам его дадут.
4. Запрос обратной связи прежде, чем люди сделают что-то значимое.
Получать отзывы от ваших пользователей важно, но вы не должны закидывать людей напоминаниями об этом до того, как они хотя бы что-то сделают на вашем сайте. Сайты и приложения, как правило, сразу же показывают пользователям всплывающие окна с обратной связью в надежде на то, что они получат высокий рейтинг. На деле такое случается редко. Чаще всего пользователи быстро закрывают всплывающее окно, не собираясь возвращаться к нему когда-либо.
Конструктивная обратная связь от ваших пользователей в определенный и подходящий момент дает вам представление об их неудобствах и препятствиях на сайте. Но если вы просите об обратной связи слишком рано, вы рискуете не получить ее даже тогда, когда это будет действительно важно.
Например, пытаясь оплатить телефонный счет на ATT.com, участница исследования была недовольна окном «обратная связь». Поп-ап появился сразу после того, как она открыла свой счет. Она сказала: «Я бы ответила после того, как оплатила счет, но теперь я раздражена этим окном. Ведь я еще даже ничего не сделала на сайте, чтобы оставлять отзыв».
Что делать вместо этого: Попросите пользователей оставить отзыв сразу после того, как они выполнили свою главную задачу на вашем сайте. Такой подход сводит раздражение к минимуму и гарантирует, что обратная связь будет основана на реальном взаимодействии. Например, программное обеспечение для видеоконференций BlueJeans запросило отзывы пользователей после завершения собрания. Этот запрос не отображался преждевременно, но в контекстуально релевантное и подходящее время.
5. Запрос обратной связи во время выполнения важных задач
Пользователи ненавидят, когда их прерывают. При этом примеров веб-сайтов и приложений, которые мешают людям своими всплывающими окнами обратной связи во время выполнения важных задач, предостаточно. В большинстве случаев пользователи посещают ваш сайт не для того, чтобы оставить вам отзыв, поэтому не мешайте им выполнять свои задачи.
Что делать вместо этого: В дополнение к просьбе оставить отзыв (только после того, как критические задачи выполнены), предложите статичные, ненавязчивые способы предоставить обратную связь в любое время, когда они захотят. Вкладка в боковой части экрана, ссылка в футере или в навигации — все это приемлемые альтернативы разрушительным поп-апам.
6. Отображение нескольких всплывающих окон одно за другим.
Отображение нескольких всплывающих окон друг на друге делает ваш сайт непрофессиональным и неорганизованным. Это также подавляет пользователей и заставляет их прилагать дополнительные усилия, чтобы закрыть каждое окно. Если на вашем сайте используется много разных типов всплывающих окон, протестируйте процесс их отображения. Не показывайте пользователям несколько всплывающих окон одновременно.
Что делать вместо этого: Если вы должны предоставить в поп-апе важную информацию (например, предупреждения для предотвращения или исправления ошибок), обязательно показывайте только один за раз. Более того, лучше не показывайте важную информацию во всплывающем окне, — люди, как правило, закрывают их, не читая. Вместо этого используйте визуально заметный элемент. Поместите его непосредственно на страницу, где это сообщение лучше всего соответствует контексту.
Всплывающий контекст: не препятствуйте переходам и доступу к контенту
7. Отображение модального поп-апа перед переходом пользователя на новый поддомен или по внешней ссылке
Некоторые корпоративные сайты дают внешние ссылки на контент или приложения, которые размещаются на поддоменах и других сайтах. Прежде чем пользователи покидают основной сайт, появляется модальное всплывающее окно, которое предупреждает их о предстоящем переходе. Этот тип поп-апов проблемный, поскольку он придает чрезмерное значение переходу. Пользователи чувствуют себя потерянными и смущенными, особенно, если дочерние сайты открываются в новой вкладке браузера.
Во время одной из наших UX-сессий участник искал работу на сайте HSBC. Он столкнулся с двумя переходными поп-апами, выполняя задачу, которая была разделена на 3 отдельных сайта. Он сказал: «Ух ты, они продолжают уводить меня на другие сайты, я даже не знаю, где я нахожусь. Если процесс приема на работу к ним в компанию является таким сложным и разрозненным. Я, честно говоря, не думаю, что это было бы хорошим местом для работы. Это похоже на беспорядок, независимо от того, насколько хорошо выглядит сам сайт».
Что делать вместо этого: Откажитесь от модальных всплывающих окон и минимизируйте переходы между сайтами. Всегда сохраняйте очевидную возможность перехода к основному сайту. Если вашим пользователям необходимо знать, что они переходят с вашего сайта, используйте менее навязчивую опцию, такую как всплывающая подсказка у ссылки. Сделайте этот переход более тонким.
8. Ограничение доступа к контенту из-за модальных всплывающих окон.
Зачастую диалоговое окно появляется сразу после загрузки статьи или другого контента в расширенном формате (например, в разделах «О нас» или «Новости»). В таких случаях складывается впечатление, что сайт ограничивает доступ к этому контенту. Это снижает уровень доверия к компании в глазах пользователя.
Один пользователь сильно расстроился, пока использовал приложение CNN. Сразу после того, как он открыл статью, которую хотел прочитать, появился поп-ап с просьбой оставить свой email. Участник исследования сказал: «Мои сомнения по поводу компании CNN достигли максимума. Не надо просить меня подписываться или спрашивать мою электронную почту в самом начале».
Что делать вместо этого: Позволить пользователям использовать контент сразу, без прерываний. Замените всплывающее окно тонким, легко удаляемым баннером в верхней части страницы. Это позволит пользователю самому принимать решение, не блокируя при этом свою главную задачу потребления информации.
Всплывающий контент: не думайте, что всплывающее окно доставит нужное сообщение пользователю
9. Использование всплывающего окна для GDPR и cookie -уведомлений.
Пользователи очень быстро отклоняют всплывающие окна, полагая, что ничего хорошего из них не выйдет. Для передачи важной информации, связанной с GDPR и использованием файлов cookie, не используйте модальные всплывающие окна.
Что делать вместо этого: Выбирайте немодальные наложения, размещенные внизу или сбоку страницы. Они гораздо менее навязчивы и позволяют пользователям продолжать выполнение своих задач. Обязательно предоставьте достаточно информации о том, как собираются и используются личные данные пользователей.
10. Поп-апы с предложением перейти на другой канал без сообщения о конкретной выгоде.
Часто можно встретить поп-апы, которые предлагают перейти, например, с мобильных сайтов в связанные с ними мобильные приложения (в основном на e-commerce и новостных сайтах). Такие всплывающие окна разрушительные и очень проблемные, потому что чаще всего с ними сталкиваются разовые пользователи. А они не заинтересованы в загрузке приложения для случайной задачи.
Понятно, что организации хотят поощрять загрузку приложений. Но модальное всплывающее окно — это далеко не самый удачный подход для рекламы вашего мобильного приложения. Даже пользователи, у которых есть ваше приложение на телефоне, могут неохотно переключаться с канала на канал из-за страха начать процесс заново. Поп-ап будет только беспокоить их.
Что делать вместо этого: Повышайте осведомленность о существовании мобильного приложения вашей организации, но не за счет вмешательства в текущую задачу пользователя. Подумайте над недооцененными подходами, такими как стандартный верхний баннер. Опишите преимущества использования приложения там.
Заключение
“Pop, pop, it never stops. Not an acceptable user experience, so do stop the pops”.
Прочитав этот текст, вы можете задаться вопросом, когда же тогда допустимо использовать всплывающие окна. Ответ: в исключительных случаях. Не поддавайтесь желанию следовать за толпой и не заваливайте своих пользователей поп-апами. Изучите альтернативные подходы, которые учитывают потребности ваших пользователей и соответствуют намерению вашей организации собирать конструктивные отзывы, адреса email и уведомлять пользователей о сборе данных.
Оставьте всплывающие окна только для сообщения важной информации и только в определенное время. Не прерывайте важные задачи и не блокируйте контент навязчивыми поп-апами. Проведите юзабилити-тестирование, чтобы убедиться, что ваши всплывающие окна не расстраивают пользователей.
