Що таке спливаючі вікна: детальна інструкція з прикладами
Спливаюче вікно ― це елемент інтерфейсу, що відображається поверх веб-сторінки в браузері. Воно раптово «вигулькує» без запиту користувача або з’являється після кліку. Зазвичай це допомагає залучати підписників, повідомляти новини, показувати рекламу або надавати технічну підтримку.
Що таке спливаючі вікна?
Спливаюча реклама або поп-апи ― це онлайн-реклама у Всесвітній павутині. Спливаюче вікно ― це область відображення графічного інтерфейсу користувача, зазвичай невелике вікно, яке раптово з'являється («вигулькує») на передньому плані графічного інтерфейсу користувача.
Попап чи поп-ап
Під час інтернет-серфінгу ви, швидше за все, стикалися з трьома варіантами написання: «попап», «поп-ап» або «поп ап». Хоча вони співзвучні, але все ж відрізняються за значенням.
«Pop up» ― це дієслово ― дія раптової або негайної появи.
«Попап» або «поп ап» використовуються як іменники, означаючи інформаційний або рекламний віджет на вашому сайті.
Хоча «поп-ап» ― є найпоширенішим варіантом написання, воно не є граматично правильним. Ось чому ми в Claspo обираємо «попап» замість «поп-ап» або «поп ап» і намагаємося бути послідовними у всьому нашому контенті.
Навіщо потрібні спливаючі вікна?
Спливаючі вікна мають кілька переваг, які спонукають все більше власників веб-сайтів і маркетологів використовувати їх у своїх онлайн-стратегіях. Ці переваги включають, але не обмежуються ними:
Привернення уваги
Сьогодні більшість відвідувачів проводять на сайті лише 54 секунди. Багато хто з них переглядає лише одну-дві сторінки, перш ніж покинути сайт. Спливаючі вікна дозволяють використовувати цей короткий час з розумом і негайно донести ваші ключові повідомлення. За допомогою Claspo ви можете розмістити їх на головній сторінці або на всіх часто відвідуваних сторінках, щоб, як мінімум, залучити відвідувачів сайту і, як максимум, мотивувати їх до покупки.
Підвищення конверсії
Дані, отримані з понад мільйона веб-сайтів Duda показують, що веб-сайти, які використовують спливаючу рекламу, мають у 4 рази вищу конверсію, ніж ті, що її не використовують. Крім того, що спливаючі вікна привертають увагу, вони містять чіткий заклик до дії та швидко перенаправляють відвідувачів на відповідну сторінку для виконання цієї дії. Таким чином, їхній шлях до конверсії спрощується.
Навіщо далеко ходити за успішними прикладами? Наші партнерські кейси чітко показують, що Claspo може зробити для вашої компанії: використання спливаючих вікон збільшило конверсію в 2 рази для Grade і в 3,9 рази для DeepStateMap. Читайте та дізнайтеся, як Claspo може змінити ситуацію на краще.
Адаптивність до змін
З технічної точки зору, спливаюче вікно ― це блок коду, вбудований на ваш сайт. Створення кожного нового спливаючого вікна за допомогою Claspo вимагає від вас лише перетягування потрібних елементів у макет, а потім копіювання та вставки готового коду на сайт. Таким чином, ви можете додавати або змінювати спливаючі вікна, коли цього вимагає ваша онлайн-стратегія. При цьому вам не потрібно розбиратися в кодуванні або архітектурі сайту.
Універсальне рішення
Ви можете переслідувати різні цілі, але за допомогою спливаючих вікон їх легше досягти. Наприклад, якщо ви хочете залучити нових клієнтів, спливаючі вікна заохочують відвідувачів сайту приєднатися до вашого списку підписників за допомогою лід-магніту. Якщо ви прагнете зменшити кількість покинутих кошиків, попапи можуть розвіяти сумніви клієнтів, нагадуючи їм про безкоштовну доставку або спеціальну пропозицію. Понад 700 готових шаблонів Claspo допоможуть вам знайти спливаюче вікно для будь-якої мети.
Що таке попап: типи та приклади
Відповідаючи на питання «Що таке спливаюче вікно?», більшість людей все ще мають на увазі рекламне повідомлення на сайті, яке займає весь екран. Так, такі спливаючі вікна все ще широко використовуються. Але насправді вони можуть мати різний макет і призначення.
Типи спливаючих вікон за макетом
Макет спливаючого вікна визначає спосіб його відображення та розташування на екрані. Це може бути просто маленьке вікно, показане в самому центрі сторінки, або панель, яка відсунута вбік. Спливаюче вікно може займати весь екран або бути невеликою горизонтальною смугою, яка з’являється при прокручуванні. Нижче наведено найпоширеніші типи спливаючих вікон за макетами.
Лайтбокс або модальне спливаюче вікно
Дивіться приклади спливаючих лайтбоксів Claspo
Цей класичний тип спливаючих вікон з’являється в центрі екрана та накладається на контент вашого сайту, затемнюючи його наче фон. Згідно зі статистикою, модальне спливаюче вікно має один з найкращих середніх показників конверсії ― 7,39%.
Повноекранне спливаюче вікно
Дивіться приклади повноекранних спливаючих вікон Claspo
Якщо лайтбокс з’являється поверх контенту сайту і лише затемнює його, то повноекранне спливаюче вікно виглядає як банер, який повністю блокує контент. Власники веб-сайтів часто використовують цей тип, коли їм потрібно перевірити вік відвідувачів, перш ніж дозволити їм доступ до контенту. Однак ви можете вибрати це рішення для блокування контенту, щоб доставити будь-яке термінове повідомлення, оскільки воно гарантує, що відвідувачі сайту помітять його першим.
Плаваюче вікно
Дивіться приклади спливаючих вікон Claspo
Такі спливаючі вікна можуть розташовуватися в різних частинах екрана. Головна особливість полягає в тому, що вони не перекривають контент сайту, а залишаються перед очима відвідувачів при прокручуванні сторінки. Якщо ваше повідомлення у спливаючому вікні не є актуальним для відвідувачів, вони можуть легко його пропустити.
Плаваюча панель
Дивіться приклади спливаючих панелей Claspo
Як і спливаюче вікно, плаваюча панель прилипає до певної частини екрана та супроводжує відвідувачів під час прокручування. Але на відміну від нього, плаваюча панель займає ще менше місця на сторінці, а отже, менше заважає переглядати контент сайту.
Вбудований попап
Дивіться приклади вбудованих попапів Claspo
Як випливає з назви, інтегровані або вбудовані віджети жорстко вбудовуються в певні частини сторінки веб-сайту, не спливаючи на екрані. Вони статичні, а тому відвідувачі не можуть їх закрити. Вони чудово працюють, якщо ви вивчили шлях користувача на вашому сайті та знаєте, яка інформація може знадобитися йому в будь-який момент. Наприклад, спливаюче вікно з персоналізованими рекомендаціями можна вбудувати на сторінці оформлення замовлення.
Віджет-лаунчер
Дивіться приклади віджет-лаунчерів Claspo
Лаунчер ― це міні-версія вашого спливаючого вікна, яка має на меті привернути увагу відвідувачів і мотивувати їх прочитати все ваше повідомлення. Простіше кажучи, при вході на ваш сайт відвідувачі бачать лаунчер, і якщо вони зацікавлені, вони натискають на нього і переходять до повнорозмірного спливаючого вікна.
Типи спливаючих вікон за цілями
Насправді, спливаючі вікна на сайті можуть слугувати багатьом різним цілям, що є однією з їхніх головних переваг. Хоча однієї статті навряд чи вистачить, щоб детально описати всі можливі цілі, їх можна поділити на 5 ключових категорій.
Збір даних
Створіть попап для збору даних
Мета цих спливаючих вікон ― зібрати дані про ваших клієнтів і потенційних клієнтів. Це можуть бути просто їхні адреси електронної пошти та номери телефонів або більш детальна інформація, наприклад, вподобання щодо контенту, сімейний стан, інтереси тощо.
Деякі приклади спливаючих вікон на веб-сайтах заохочують клієнтів ділитися своїми даними, щоб залишатися в курсі новин компанії. Інші, навпаки, пропонують їм знижки, електронні книги або інформаційні буклети в обмін на приватну інформацію. У будь-якому випадку, спливаючі вікна добре виконують свою функцію. За даними Entrepreneur, цей тип спливаючих вікон дозволив їм збільшити кількість підписників на 86%.
Спеціальні пропозиції
Створіть попап зі спеціальною пропозицією
Цей тип спливаючих вікон фокусує увагу відвідувачів сайту на промокодах, знижках, подарунках та інших вигідних пропозиціях від вашого бренду. Оскільки 94% клієнтів завжди шукають вигідну пропозицію перед покупкою, таке спливаюче вікно може підняти ваші конверсії та продажі на новий рівень. Ваша пропозиція буде виділятися на фоні решти контенту, незалежно від обраного макету.
Підтримуйте зв’язок з клієнтами
Створіть попап для підтримки зв’язку
Підтримувати зв’язок з клієнтами можливо завдяки різним типам спливаючих вікон. Наприклад, попап на сайті з кнопкою контакту дозволяє клієнтам зв’язатися з вами через один або кілька месенджерів, попап зворотного дзвінка допомагає вам зв'язатися з клієнтами для вирішення будь-яких питань, а спливаюче вікно соціальних мереж швидко перенаправляє аудиторію на ваші акаунти в соціальних мережах. Всі вони спрямовані на підвищення лояльності, залучення та покращення відносин з клієнтами.
Збір відгуків
Ваші клієнти люблять бути почутими та хочуть, щоб їхня думка мала значення. 77% лояльні до брендів, які збирають відгуки та враховують їх для подальшого вдосконалення. Спливаючі вікна з опитуваннями ― один з найпоширеніших і найефективніших способів отримати такий зворотній зв’язок.
Сповіщення відвідувачів сайту
Спливаючі вікна зі сповіщеннями не спонукають відвідувачів сайту до будь-яких дій. Замість цього вони повідомляють важливу інформацію, яку відвідувачі повинні знати. Хоча ці попапи не впливають на конверсію, вони можуть покращити клієнтський досвід.
Найкращі приклади використання попапів
Спливаючі вікна, як і будь-який інший інструмент, чудово працюють лише за умови правильного використання. Ось чому ми зібрали 7 перевірених порад, про які варто пам’ятати при створенні спливаючих вікон.
1. Подбайте про дизайн. Ідеальний варіант ― це адаптувати зовнішній вигляд спливаючого вікна до загального дизайну вашого сайту, щоб забезпечити узгодженість кольорів і шрифтів. Також не перевантажуйте попап на сайті текстом. Інакше ваше повідомлення може бути складним для сприйняття. Нарешті, додайте зображення, щоб збільшити показник кліків по спливаючому вікну на 25%.
2. Не поспішайте показувати спливаюче вікно. 28,6% відвідувачів кажуть, що їх дратує негайна поява попапів після входу на сайт. Тому дайте їм час прокрутити сторінку та освоїтися на ній. Це покращить не тільки користувацький досвід, але й вашу конверсію. Спливаючі вікна, що з’являються через 8 секунд після входу на сайт, конвертуються якнайкраще. Але щоб визначити свій ідеальний момент, ви завжди можете протестувати різні варіанти.
3. Використовуйте тригер прокручування. За допомогою Claspo ви можете показувати спливаюче вікно лише тоді, коли відвідувачі прокрутять певний відсоток сторінки вашого сайту. Деякі дослідження показують, що спливаючі вікна, які з’являються після 10-50% прокручування сторінки, конвертуються якнайкраще, а отже, такий відкладений показ може бути чудовим рішенням.
4. Адаптуйте попап до мобільної версії. 72% відвідувань сайтів здійснюються зі смартфонів. Тому, якщо ваша спливаюча реклама не адаптована для мобільних пристроїв, ви можете втратити левову частку конверсій. Спливаючі вікна Claspo адаптуються до різних розмірів екрану та можуть бути легко налаштовані по ширині й висоті відповідно до макету вашої сторінки.
5. Не повторюйте попапи. 19,2% відвідувачів скаржаться на те, що бачать одне й те саме спливаюче вікно щоразу, коли відвідують сайт. Це дратує й виглядає нелогічним, як, наприклад, коли підписники знову бачать спливаюче вікно з проханням про реєстрацію. За допомогою Claspo ви можете припинити показ спливаючих вікон, як тільки клієнт залишив свої контактні дані. Крім того, ви можете контролювати частоту та показувати попап один раз або раз на кілька днів. Покращений користувацький досвід гарантовано.
6. Показуйте спеціальні попапи відвідувачам, які залишають сайт. Згідно з визначенням, exit-intent pop-up ― це попап, що спливає при закритті сторінки для тих, хто має намір покинути ваш сайт. Завдяки йому ви можете переконати понад 10% відвідувачів залишитися та зробити покупку. Насправді, будь-яке ваше спливаюче вікно можна перетворити на пропозицію з наміром покинути сайт одним кліком у редакторі Claspo. Головне, щоб ваше повідомлення було достатньо переконливим, щоб утримати клієнтів.
7. Ретельно обміркуйте свій заклик до дії. Ви повинні чітко пояснити клієнту, якої дії ви очікуєте від нього. Крім того, ви повинні зосередити свій CTA на цінності. Наприклад, замість «почати покупки» ви можете використовувати «купити зараз зі знижкою 20%». Нарешті, ви можете додати до заклику таймер зворотного відліку, який з більшою ймовірністю прискорить покупця, ніж просто кнопка «купити зараз». Зокрема, спливаючі вікна з таким гачком конвертуються вдвічі краще.
Як Claspo може вам допомогти
Claspo фокусується на користувацькому досвіді та конверсії. Тому створення спливаючих вікон за допомогою редактора Claspo є безпрограшним рішенням.
- Захист від роздратування та накладання. За допомогою наших ексклюзивних функцій ви можете налаштувати інтервал тиші між показом спливаючих вікон. Крім того, Claspo запобігатиме їхньому накладанню, якщо вони мають відображатися одночасно.
- Розширені можливості відображення та таргетингу. За допомогою Claspo ви отримуєте повний контроль над тим, хто й коли бачить ваші спливаючі вікна. Це дозволяє вам покращити подорож клієнта на сайті та персоналізувати його досвід, збільшуючи ваш прибуток на 40%.
- Легка локалізація. Claspo дозволяє відображати спливаючі вікна на основі географічного розташування ваших клієнтів. При цьому ваша аудиторія може бачити ваше повідомлення мовою, яка відповідає її браузеру.
- 5000+ інтеграцій. Перенесіть ключові показники ваших спливаючих вікон до єдиного сховища даних на ваш вибір, вивчайте цінну інформацію про вашу аудиторію та забезпечуйте найкращий клієнтський досвід, щоб збільшити продажі.
- Інноваційний спливаючий слайдер. За його допомогою ви можете показувати кілька продуктів або спеціальних пропозицій у вигляді анімованого слайд-шоу. Таким чином, ви не дратуєте клієнтів великою кількістю спливаючих вікон, але при цьому доносите до них усі свої ідеї.