{"id":7016,"title":"\u0423\u0433\u0430\u0434\u0430\u0439\u0442\u0435 \u0433\u043e\u0440\u043e\u0434\u0430 \u043f\u043e \u0437\u0432\u0443\u043a\u0443 \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u044e\u0449\u0435\u0433\u043e\u0441\u044f \u043f\u0438\u0432\u0430 \u0438 \u043f\u0435\u043d\u0438\u044e \u043a\u0438\u0442\u043e\u0432","url":"\/redirect?component=advertising&id=7016&url=https:\/\/vc.ru\/special\/sound&placeBit=1&hash=6ca24c77fedb0a01bd41595a6fbd498b5375a294c2e3b54a129aa318671b77a3","isPaidAndBannersEnabled":false}
Маркетинг
Ecom Today

8 принципов создания идеального попапа для интернет-магазина

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

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

Что такое pop-up?

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

Для чего использовать pop-up?

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

Попапы помогают увеличить продажи, так как концентрируют внимание целевой аудитории в направлении конверсионного действия, что подтверждается множеством практических кейсов. В среднем, коэффициент конверсии подписки на email-рассылку посредством попапов составляет от 1,95% до 2,9%. Это означает, что из 100 человек, которые увидят всплывающее окно на вашем сайте, вы можете получить 2-3 адреса электронной почты.

Несомненно, есть и более впечатляющие примеры. Некоторым удавалось поднять продажи на 162% посредством попапов (случилось это, правда, в 2005 году). А в 2012 году один из клиентов AWeber в результате экспериментов со всплывающими окнами получил + 1,375% подписок.

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

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

Принципы создания попапа

Правило #1: Попап должен просто закрываться

Согласитесь, крайне нервирует, когда в процессе чтения статьи или скроллинга ленты вам «выпадает» попап, закрыть который становится задачей сродни поиску клада.

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

Правило #2: Попап должен выглядеть просто

Один из секретов «мэтров копирайтинга» звучит как keep it simple, или чем проще, тем лучше. Это правило применимо и к попапам. Сделайте так, чтобы всплывающее окно выглядело лаконично, а посыл был читабельным. Добавьте одно изображение, небольшой текст, поле для ввода email-адреса и кнопку.

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

Когда в строке более одного поля для ввода, пользователю сложнее заполнять форму. По этой системе работают крупнейшие IT-гиганты, когда при регистрации вместо анкеты просят пользователя ответить, например, на один вопрос, ответ на который подразумевает простое «Да / Нет». Об этом расскажем в одной из следующих статей.

Правило #3: Не используйте несколько всплывающих окон

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

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

Правило #4: Дайте пользователю время

Один из секретов «мэтров копирайтинга» звучит как keep it simple, или чем проще, тем лучше. Это правило применимо и к попапам. Сделайте так, чтобы всплывающее окно выглядело лаконично, а посыл был читабельным. Добавьте одно изображение, небольшой текст, поле для ввода email-адреса и кнопку.

Вы спросите: а что если за это время пользователь решит покинуть страницу? В данном случае можно прибегнуть к такому типу всплывающих окон как exit-intent или попап выхода. Окно появляется, когда пользователь принимает решение покинуть страницу. Механизм отслеживает движение мыши посетителя, и когда курсор выходит за верхнюю границу страницы, отображает всплывающее окно.

Правило #5: Пусть попап соответствует вашему бренду

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

То же самое касается tone of voice (тональность, которой придерживается бренд в коммуникации со своим потребителем). Тщательно продуманный тон и стиль повествования и сочетающиеся элементы дизайна будут формировать у посетителей сайта положительное впечатление, чтобы последние с большей вероятностью совершили целевое действие.

Поэтому перед тем, как выводить на страницу всплывающее окно, мы рекомендуем убедиться, что цвета, шрифт, стиль изображения и tone of voice едины с экосистемой сайта.

Правило #6: Оптимизируйте попап под мобильные устройства

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

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

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

Правило #7: Положение на сайте – важно

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

Правило #8: Предлагайте что-нибудь полезное

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

Бесспорно, попап с подпиской на новостную рассылку – это замечательная идея, но это давно не конвертирует. Выход в данном случае – качественный лид-магнит в виде:

  • Промокода за подписку;
  • Полезного контента / подарка за подписку;
  • Расширенного пробного периода.

Запомните, что бы вы ни предлагали, делайте это качественно!

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

Сбор имейлов посредством всплывающих окон – это лишь один из этапов внедрения email-маркетинга в ваш онлайн-бизнес. Более подробно о принципах внедрения email-маркетинга в ваш интернет-магазин мы рассказали в статье «Как эффективно выстроить email-маркетинг в магазине на Shopify».

И еще кое-что...

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

{ "author_name": "Ecom Today", "author_type": "self", "tags": ["8","7","6","5","4","3","2","1"], "comments": 1, "likes": 7, "favorites": 26, "is_advertisement": false, "subsite_label": "marketing", "id": 206567, "is_wide": true, "is_ugc": true, "date": "Tue, 09 Feb 2021 17:00:01 +0300", "is_special": false }
0
1 комментарий
Популярные
По порядку

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

2
Читать все 1 комментарий
Как не попасть в карьерную ловушку тимлида: личный опыт

Кажется, что тимлиду просто некуда расти: дальше надо либо идти в менеджмент, либо наоборот, становиться узконаправленным разработчиком. По просьбе «Лаборатории Касперского» Евгений Мацюк, который прошел в компании неординарный путь, рассказал о своих карьерных развилках во время и после тимлидства, а также поделился опытом горизонтального роста.

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

Сервис предоставляется бесплатно.

«Сбер» научил свой ИИ-сервис определять возможные признаки рака на ранних стадиях по снимкам лёгких Статьи редакции

Это может помочь врачам при диагностике заболевания.

Главные новости недели: Apple MacBook Pro, новое название Facebook, запрет Samsung Pay

Говорим о главных новостях недели в подкасте Telegram-канала ForGeeks. Сегодня в гостях Павел Беседин, ведущий на Европе Плюс и гик. Мы обсудили, почему новые MacBook Pro такие крутые, зачем Facebook решил поменять название, запретят ли в России Samsung Pay и когда уже выпустят Cyberpunk 2077 для PlayStation 5. Слушайте, читайте и подписывайтесь.

Почему «без ТЗ результат ХЗ». Разбираем на примере CRM-систем

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

Пример нотации согласовательного уровня Библиотека примеров BPMN
Cloud CDN: что это такое, как устроено и кому нужно. Разбираем на примере бургеров

Cloud CDN — это сеть быстрой доставки статического контента в формате услуги облачного провайдера. Объяснить, как работает технология, проще всего на примере — сравнить Cloud CDN с популярным продуктом, который выглядит плюс-минус одинаково вне зависимости от того, заказали вы его в Москве, Питере или Нью-Йорке. Знакомьтесь: классический бургер.…

Travers – поиск инструкторов по активным видам спорта

Мы сделали второе приложение, раскатили сервис на всю Россию и изменили бизнес-модель. Многое благодаря пользователям vc.ru!

Сооснователь «Кухни на районе» Олег Козырев покинул компанию Статьи редакции

Но сохранил долю в бизнесе.

Исследование: сотрудники хотели бы иметь комнату отдыха, бесплатный сок, а работодатели уже готовы покупать ЗОЖ-снеки

Онлайн-сервис доставки продуктов и товаров СберМаркет и исследовательское агентство Research Me спросили сотрудников, как они хотели бы питаться в офисе и что в нем видеть. В опросе приняли участие более 1500 работающих людей по всей России. Сервис также спросил работодателей – В2В-клиентов СберМаркета: что они покупают в офис, что точно никогда…

Дизайн-джем #42: мифы и легенды о русалках, японские рассказы, космические приключения и азы точных наук

В красочном дайджесте, посвящённом детским книжным иллюстрациям, от Futura by red_mad_robot.

Как OTUS стал платформой для самореализации. История преподавателя

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

null