Сегодня существует немало сервисов, позволяющих легко и быстро создать уникальный поп-ап для интернет-магазина. Но даже при наличии готовых шаблонов и форм всплывающий элемент должен быть продуманным и адаптированным под интересы посетителей. При правильном и аккуратном использовании поп-апов можно не только увеличить конверсию интернет-магазина, но и принести пользу покупателям.
Чтобы найти ту самую «золотую середину», избежать распространенных ошибок и выстроить доверительные отношения с клиентом, не потеряв при этом лояльных покупателей, нужно знать о некоторых правилах и принципах создания поп-апов.
Что такое pop-up?
Если дословно перевести словосочетание popup с английского языка, то этот термин будет означать «всплывать» или «неожиданно возникать». Обычно под этим словосочетанием подразумевается всплывающее окно на сайте, которое возникает независимо от желания пользователя.
Цель всплывающего окна — вызывать у человека желание совершить определенное действие: подписаться на рассылку, оставить отзыв, поучаствовать в какой-либо акции, заказать услугу обратного звонка или оставить свой адрес электронной почты. Чаще всего поп-ап нужен для того, чтобы собрать контактные данные потенциального покупателя. Таким образом, владелец сайта нарабатывает базу контактов, с которой в дальнейшем может работать.
Для чего нужны всплывающие окна
Не все владельцы сайтов используют рекламные окна для сбора контактов. Некоторые интернет-магазины с помощью поп-апов проявляют заботу о клиентах, размещая в них информацию о каких-либо подсказках или предлагая написать в чат технической поддержки.
Кто-то задастся вопросом — а зачем интернет-магазину собирать контакты посетителей? Какую пользу несут подписчики ресурсу? Дело в том, что одного продвижения сайта в поисковиках недостаточно. Для успешной работы интернет-магазина требуется высокий процент посещаемости. Поэтому email-рассылка может значительно повысить этот показатель. Чем больше посетителей подписываются на почтовую рассылку, тем выше будет процент посещаемости.
Можно ли обойтись без поп-апов?
Если всплывающее окно задумывается лишь с целью собрать контакты, а будущий текст для поп-апа настолько прост и незамысловат, что с ходу предлагает пользователю подписаться на рассылку, тогда действительно, лучше обойтись без него. Предлагая посетителю ввести свой электронный адрес, владелец интернет-магазина должен понимать, что сейчас много конкурентов, да и покупатели стали более разборчивыми. И просто так подписываться на рассылку никто не будет.
Соглашаясь на информирование, клиент ожидает получить некую выгоду для себя. Поэтому грамотные специалисты настраивают поп-ап так, чтобы пользователь сам захотел подписаться. Например, можно предложить клиенту скидку на первый заказ и выслать промокод на почту. Часто пользователям предлагают какое-то полезное и интересное пособие в электронном виде: гайд, чек-лист, книгу, руководство или другую ценную информацию.
На самом деле всплывающее окно раздражает лишь тогда, когда оно настроено неграмотно. Когда нет возможности быстро его закрыть, когда предложение не несет никакой ценности для клиента, когда поп-ап растягивается на всю ширину страницы. Поп-апы со звуковым сопровождением использовать не рекомендуется — посетитель не ожидает, что на сайте начнет что-то проигрываться и поспешит быстрее его покинуть.
Согласно исследованиям, около 73% пользователей негативно относятся к поп-апам и предпочли бы, чтобы всплывающие окна вообще не появлялись на сайтах. Однако, если знать некоторые принципы создания поп-апа и провести юзабилити-тестирование этого решения перед запуском, можно добиться более высоких продаж и обойти конкурентов.
Принципы создания поп-апа
1. Простой и лаконичный дизайн
Не стоит нагружать всплывающее окно большим количеством информации. Лучше руководствоваться принципом «чем проще, тем лучше». Для поп-апа не нужна яркая, кричащая картинка с кислотными и контрастными цветами. Дизайн должен быть спокойным и соответствовать общей цветовой гамме веб-страницы.
Позаботьтесь о том, чтобы текст во всплывающем окне был читабельным и ненавязчивым. Длинный текст-простыню вряд ли кто-то будет читать, поэтому постарайтесь передать суть максимально емко, уместить все в нескольких предложениях.
Не просите у пользователя и телефон, и электронную почту, и имя. На начальном этапе вам будет достаточно лишь электронного адреса. Если в дальнейшем понадобится более полная информация о клиенте, например, имя и контактный телефон, узнать ее можно будет, предложив пользователю заполнить поля в личном кабинете на сайте.
2. Возможность быстро и легко закрыть всплывающее окно
Чтобы у пользователя не возникало желания тут же покинуть сайт при появлении поп-апа, на всплывающем окне должна быть специальная кнопка, с помощью которой посетитель сможет быстро закрыть рекламу. Обычно такая кнопка изображается в виде крестика или обозначается словом «Закрыть».
Часто дизайнеры хитрят и кнопку закрытия намеренно делают слишком тусклой, рассчитывая на то, что человек не сразу сможет ее найти и закрыть окно. Так делать не стоит, если посетитель захочет скрыть поп-ап, у него должна быть такая возможность.
2. Использование одного всплывающего окна
Сразу несколько поп-апов отрицательно скажутся на рейтинге сайта. Если вместо одного окна всплывает 2 или 3, вероятнее всего, посетитель сочтет ваш сайт за потенциально опасный и поспешит покинуть его. На одной странице должен появляться только один поп-ап. Но также не стоит увлекаться и слишком часто показывать посетителям всплывающую рекламу.
3. Отложенное появление поп-апа
Когда пользователь только переходит на сайт, он не особо радуется появлению всплывающих окон. Дайте посетителю время оглядеться. Появление поп-апов можно легко настроить, например, через 1 или 2 минуты после перехода на сайт.
Часто разработчики сайтов используют такую фишку, как поп-ап выхода. Этот способ подразумевает, что как только пользователь наведет курсор мышки к окну выхода, на сайте появится всплывающее окно. Такой метод позволяет клиентам задержаться на сайте и воспользоваться специальным предложением, которое прописано в тексте поп-апа.
4. Единый гармоничный стиль дизайна поп-апа и самого сайта
Если поп-ап выбивается из общего стиля сайта и не совсем соответствует ценностям бренда, вряд ли он будет выполнять свою функцию. Чтобы не допускать такого расхождения, стиль и оформление всплывающего окна должны соответствовать интерфейсу веб-страницы.
Ценности бренда или так называемый tone of voice должны учитываться при составлении текста поп-апа. Стиль повествования может о многом рассказать, поэтому все составляющие всплывающего элемента: цвет, стиль, текст, шрифт, изображение, оформление должны сочетаться с общим дизайном сайта и эмоциональным фоном бренда.
5. Оптимизация для мобильных устройств
Около половины онлайн-покупок по всему миру осуществляется через мобильные устройства. Для пользователей важно, чтобы на сайте им было удобно. Но если у вас нет возможности создать отдельное приложение, постарайтесь сделать так, чтобы абсолютно все элементы сайта были адаптированы под мобильные устройства.
6. Расположение на веб-странице
Иногда можно увидеть всплывающий элемент, растянутый на всю ширину сайта. Такое бывает, хоть и нечасто. Поп-ап не должен быть емким и громоздким. Также важной особенностью является расположение окна. Самый оптимальный вариант — это правый нижний угол экрана. Небольшой поп-ап в правом нижнем углу сайта не вызовет особого раздражения и не будет отвлекать от просмотра страницы.
7. Польза для клиента
Как показывает статистика, использование лид-магнита работает хорошо. Лид-магнит — это какой-то недорогой продукт или услуга, которую вы предлагаете клиенту в обмен на подписку или заполнение полей «Контакты». При настройке поп-апа тоже рекомендуется использовать лид-магнит. В качестве привлечения можно использовать любой полезный и уникальный контент или промокод на скидку, бесплатную или ускоренную доставку, видео- или текстовые инструкции, пособия и руководства.
Структура для поп-апа
Вовсе не обязательно пытаться сделать роскошный поп-ап с непонятными и сложными элементами. Чтобы грамотно создать окно всплывающей рекламы, нужно придерживаться определенной структуры.
Текстовый блок
Популярная фраза «Краткость — сестра таланта» в этом случае весьма актуальна. Послание, которое вы хотите донести до пользователя, должно быть сформулировано так, чтобы его смысл был понятен человеку любого возраста. Действие, которое вы предлагаете совершить клиенту, должно быть понятным и четким.
Первое предложение в тексте можно выделить жирным и крупным шрифтом. Так вы покажете заголовок и привлечете внимание пользователей.
Изображение
Интересная и качественная картинка не будет лишней в поп-апе. Например, если вы предлагаете книгу за подписку, покажите ее обложку. Если это скидка, покажите привлекательное фото какого-либо товара из соответствующей категории.
Но если изображение по теме подобрать затруднительно или вы хотите применить строгий, лаконичный дизайн к всплывающему элементу, можно обойтись и без изображения.
Поле для ввода контактных данных
Посетитель не должен испытывать трудности, гадая, в каком поле записать адрес почты, а в каком свое имя. В каждом поле для ввода данных должны быть подсказки. Также строчка не должна быть слишком узкой и маленькой.
Активная кнопка
Такую кнопку еще называют CTA или кнопкой призыва к действию. Это именно тот элемент, куда пользователь щелкает после того, как заполнил все необходимые поля. На разных сайтах активная кнопка выглядит и называется по-разному. Это может быть призыв «Подписаться» или «Получить скидку/подарок».
В зависимости от того, какой лид-магнит вы используете в поп-апе, так и следует называть кнопку. Если в подарок посетителю идет какое-то электронное издание, можно подписать активный элемент «Скачать».
Детали
По-хорошему поп-ап должен быть максимально простым. Но если при сборе контактов для вас важно сразу провести сегментирование и выделить целевую аудиторию, в структуру можно добавить такие текстовые поля: имя пользователя, пол, наиболее предпочитаемые интересы, на тему которых будут приходить рассылка.
Не стоит пытаться сразу же узнать у клиента мобильный телефон. Лучше спросить адрес электронной почты. Людям намного проще оставить свой e-mail, чем номер сотового.
Как использовать поп-апы
Предполагается, что перед тем, как тестировать поп-апы на сайте, маркетолог прописывает стратегию действий. Но ситуации бывают разными, поэтому, если у вас нет готовой стратегии, следует придерживаться определенной последовательности действий:
- Предположить и выписать, какую выгоду может/хочет получить клиент при посещении вашего сайта.
- Продумать, какие трудности могут возникнуть у посетителя на сайте при оформлении заказа.
- Составить текст для поп-апа и продумать его форму.
- Запустить появление поп-апа в качестве теста.
- Проанализировать результаты теста и сделать выводы.
Отслеживать поведение пользователей на сайте и их взаимодействие с поп-апом можно с помощью специальных сервисов. Например, Яндекс. Метрика и Google Analytics. Эти сервисы синхронизируются с сайтом и благодаря аналитике можно собирать статистику о действиях посетителей и делать выводы об эффективности поп-апов.
Сервисы аналитики устанавливаются на сайт программистом. Не каждый справится с такой задачей, хотя и особо глубоких знаний программирования здесь не требуется. Можно установить счетчик аналитики самостоятельно, изучив подробные видеоинструкции в интернете, или воспользоваться услугами фрилансеров.
В зависимости от видов поп-апов меняется и цель их использования. Условия показа тоже будут разными у разных типов всплывающих окон.
Приветственный поп-ап
Появляется сразу, как пользователь открывает сайт. 100% привлекает внимание, но есть риск того, что посетитель тут же закроет страничку. Может использоваться для предупреждения о технических работах сайта или другой важной информации.
Поп-ап с временной отсрочкой
Всплывает примерно через 60 секунд после того, как посетитель открыл сайт. Хорошо работает для сбора контактов, заявок обратного звонка и получения демоверсии какого-либо продукта, но требуется тестирование для коррекции временного промежутка.
Поп-ап с пролистыванием
Возникает, когда посетитель просматривает определенный объем сайта. Обычно в настройках устанавливают 40-70% прокрутки для появления окна. Используется в случаях, когда нужно предложить клиенту подписаться на обновления или рассказать пользователю о каких-либо новостях.
Прощальный поп-ап
Появляется в тот момент, когда посетитель собирается покинуть сайт. Это хороший способ удержать клиента, но только в том случае, если взамен вы предлагаете нечто стоящее и полезное. Поп-ап в стиле: «Не уходите так быстро», которые не несет для посетителя никакой выгоды, только подпортит репутацию сайта.
Поп-ап по клику
Всплывает в тот момент, когда посетитель кликает на определенные ссылки и совершает какое-то целевое действие. Обычно используется для заказа обратного звонка. Такой поп-ап хорош тем, что экономит место на сайте и не сильно отвлекает пользователя. Однако, если человек не щелкнет на нужную кнопку, окно не появится.
Юзабилити поп-апа
Перед тем как начать тестирование поп-апов, необходимо еще раз все проверить и убедиться, что всплывающий элемент оформлен и настроен правильно. Хороший поп-ап должен соответствовать следующим критериям:
- Появление элемента спустя 15-60 секунд после того, как пользователь зашел на сайт.
- Текст поп-апа понятный и лаконичный, обращение к пользователю вежливое и дружелюбное.
- Минимальное количество полей, предназначенных для контактных данных (имя, пол, телефон, электронная почта, интересы).
- Привлекающая внимание кнопка призыва к действию.
- Присутствие элемента, который позволит посетителю немедленно закрыть поп-ап. Значок в виде крестика или надпись «Закрыть».
- Поле с галочкой, нажатие на которую дает право посетителю не показывать ему поп-ап. Например, кнопка «Я уже подписан», если человек уже есть в базе контактов.
- Ссылка на протокол, подразумевающий согласие на обработку персональных данных и гарантию их безопасности.
Чтобы создать хороший и качественный поп-ап, который будет приносить пользу владельцу сайта и клиентам, необязательно быть крутым маркетологом. Достаточно лишь хорошо знать свою целевую аудиторию, чтобы дать людям взамен на подписку то, чего они хотят и то, что будет для них полезно.
Также не стоит забывать о стратегии. Хотя многих и пугает это слово, на самом деле в этом нет ничего сложного. Стратегия — это лишь последовательность действий, которых нужно придерживаться для получения максимального результата.