Пропустить

Характеристики эффективного всплывающего окна для WordPress

Divi: самая простая тема WordPress для использования

Divi: Лучшая тема WordPress всех времен!

Более Загрузка 701.000, Divi - самая популярная тема WordPress в мире. Он является полным, простым в использовании и поставляется с более чем бесплатными шаблонами 62. [Рекомендуется]

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

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

С тех пор времена сильно изменились.

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

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

Аргумент в пользу использования всплывающих окон в WordPress

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

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

Всплывающая анатомия - всплывающие подсказки

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

Возникает вопрос: всплывающие окна по-прежнему актуальны и эффективны? Если рынок настолько перенасыщен всплывающими окнами при выходе, панелями приветствия, полностраничными оверлеями и многим другим, стоит ли использовать этот инструмент генератора конверсий на своем сайте WordPress?

Легко создайте свой сайт с Elementor

Elementor позволяет легко создать любой дизайн сайта с профессиональным дизайном. Прекратите платить дорого за то, что вы можете сделать сами. [Free]

Конечно !!!

Всплывающие окна учитывают многие передовые методы веб-дизайна. Например:

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

Анатомия всплывающее - социальное доказательство HubSpot

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

Анатомия эффективного всплывающего окна WordPress

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

1. стиль

Различные типы всплывающих окон более эффективны в преобразовании посетителей в подписчиков:

  • У всплывающих окон подписки по электронной почте коэффициент конверсии составляет 2,9%.
  • Приветственные всплывающие окна (те, которые заполняют всю страницу при входе) конвертируются на 2,6%.
  • Вызванные прокруткой всплывающие окна конвертируют 1,9%.
  • Всплывающие окна Smart или Hello отображают преобразование 0,5%.

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

Всплывающая анатомия - панель Нейла Пател Привет

Вы ищете лучшие темы и плагины WordPress?

Загрузите лучшие плагины и темы WordPress на Envato и легко создайте свой сайт. Уже больше, чем 49.720.000. [ЭКСКЛЮЗИВ]

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

2. цвет

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

3. состав

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

Ваше всплывающее окно должно:

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

4. текст

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

Помните следующее:

  • Всегда включайте заголовок, короткое сообщение (достаточно одного предложения) и призыв к действию.
  • Используйте сильный язык, который привлекает эмоции посетителей.
  • Будь краток. Если вы не можете написать его менее чем 30 словами, это сообщение не относится к всплывающему окну.
  • Используйте тот же тон и индивидуальность, которые вы используете на своем сайте.
  • Предложите что-нибудь ценное, что ваши посетители не найдут в другом месте на сайте.
  • По возможности используйте срочность. Если вы не можете сделать это словами, сделайте это с помощью цвета.

Всплывающее окно "Анатомия" - наложение экрана Wishpond

5. CTA

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

Вы, наверное, видели это плохое приложение сами:

  1. Положительный вариант : Этот говорит: «О, спасибо, спасибо! Я знаю, что это предложение изменит мою жизнь к лучшему! " 
  2. Отрицательный вариант : Этот говорит: «Мне нравится делать неправильный жизненный выбор, и я ценю, что ты потираешь меня по лицу». Позвольте мне нажать на эту опцию автоматического прекращения поддержки, только чтобы получить другое окно, которое снова спросит меня, хочу ли я принять это ужасное решение. " 

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

Легко создайте свой интернет-магазин

Загрузите бесплатные WooCommerce, лучшие плагины для электронной коммерции, чтобы продавать свои физические и цифровые продукты в WordPress. [Рекомендуется]

Всплывающая анатомия - Тим Феррис Позитив Негатив

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

Помимо этой любимой раздражения, я также предлагаю сделать призыв к действию простым. Используйте простой язык, который дает понять, что посетители получат, если введут адрес электронной почты или нажмут кнопку. Кроме того, сведите задание к минимуму: не более двух полей для заполнения (например, адрес электронной почты и, возможно, имени) и одну кнопку, которую нужно нажать.

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

Эта статья содержит комментарии 0

Оставить комментарий

Ваш электронный адрес не будет опубликован. Обязательные для заполнения поля помечены *

Этот сайт использует Akismet для уменьшения нежелательности. Узнайте больше о том, как используются ваши комментарии.

Вверх
8 акции
доля4
чирикать2
Регистрация2