Раньше на веб-сайтах было много ненужных элементов, а именно страниц с яркими и уродливыми цветовыми схемами, слишком много текста, застрявшего в небольших пространствах, и всплывающих окон, которые всплывали и раздражали посетителей.
Но тогда дизайнеры не знали большего или, скорее, они просто работали с единственными известными дизайнерскими тенденциями и лучшими практиками.
С тех пор времена сильно изменились.
Веб-разработчики и дизайнеры больше не ограничены технологией или техникой, а это значит, что нет больше оправданий плохому дизайну. Это касается каждого элемента, найденного на сайте WordPress, от изображения заголовка главной страницы до формы контактов, а также от типографики до всплывающих окон. Теперь все имеет значение при разработке дизайна для удобства пользователей.
Сегодня я хочу сосредоточиться на том, что делает всплывающее окно эффективным, что я считаю важной частью процесса конверсии. В частности, я хотел бы изучить анатомию эффективного всплывающего окна WordPress и то, как этот захватывающий элемент может повысить ваш коэффициент конверсии.
Аргумент в пользу использования всплывающих окон в WordPress
Всплывающие окна - интересный элемент дизайна. Хотя они временно прерывают взаимодействие с пользователем (что обычно не очень ценится), те, которые сделаны правильно, предлагают что-то настолько привлекательное или захватывающее, что посетители не прочь потерять минута, чтобы обратить внимание.
Разумеется, в данном случае речь идет о всплывающих окнах, генерирующих конверсию, которые служат для сбора подписчиков на Новостную рассылку или побудить посетителей совершить покупку. Однако всплывающие окна могут использоваться для различных целей. Например, вы можете поделиться своими файлами cookie или политикой конфиденциальности, порекомендовать похожие товары после того, как посетители добавят что-то в корзину, или даже попросить их пройти быстрый опрос.
По большей части, если вы используете всплывающее окно, вы, вероятно, хотите, чтобы посетители действовали. В конце концов, зачем прерывать их опыт, если беспокойство не является полезным использованием их времени? Согласно исследованию почти двух миллиардов всплывающих окон, они обнаружили, что средний коэффициент конверсии для этих типов всплывающих окон составляет 3,09%.
Возникает вопрос: всплывающие окна по-прежнему актуальны и эффективны? Если рынок настолько перенасыщен всплывающими окнами при выходе, панелями приветствия, полностраничными оверлеями и многим другим, стоит ли использовать этот инструмент генератора конверсий на своем сайте WordPress?
Конечно !!!
Всплывающие окна учитывают многие передовые методы веб-дизайна. Например:
- Всплывающие окна убирают ненужный беспорядок со страниц вашего сайта.
- Они обычно состоят из чистых визуальных элементов и минимального текста.
- Призывы к действию хорошо продуманы и просты с точки зрения формулировки.
- Посетителям придется немного поучиться, поскольку большинство людей знакомы с всплывающими окнами и знают, как с ними взаимодействовать.
- Всплывающие окна предоставляют забавную возможность наполнить ваш сайт анимацией, видео или социальными доказательствами.
- Вы можете легко создать их с помощью WordPress плагины высокое качество, как Hustle или OptinMonster.
Как правило, хорошо продуманное всплывающее окно идеально подходит для привлечения внимания посетителей, когда оно вам больше всего нужно. Вы можете использовать их для отправки своевременных уведомлений или запросов. Вы также можете использовать данные о посетителях, чтобы побудить их совершить покупку.
Анатомия эффективного всплывающего окна WordPress
Очевидно, что успех всплывающих окон на вашем сайте WordPress зависит от тех, которые идеально спроектированы и содержат такие убедительные предложения, с которыми посетители не могут не взаимодействовать. Итак, давайте посмотрим, как выглядит выигрышная формула эффективного всплывающего окна.
1. стиль
Различные типы всплывающих окон более эффективны в преобразовании посетителей в подписчиков:
- У всплывающих окон подписки по электронной почте коэффициент конверсии составляет 2,9%.
- Приветственные всплывающие окна (те, которые заполняют всю страницу при входе) конвертируются на 2,6%.
- Вызванные прокруткой всплывающие окна конвертируют 1,9%.
- Всплывающие окна Smart или Hello отображают преобразование 0,5%.
Это не означает, что вам всегда нужно использовать традиционное всплывающее окно подписки по электронной почте. Вот пример с сайта Нила Пателя.
Это сделано хорошо, потому что оно просто спроектировано, ненавязчиво, et использует забавную анимацию, чтобы привлечь внимание, если его минимальный размер останется незамеченным. Имейте в виду, что выбор стиля - это не использование самого популярного или самого известного по более высоким коэффициентам конверсии. Речь идет о поиске стиля, который подходит вашему сайту и вашим посетителям и призван дополнить опыт между ними.
2. цвет
Цвет, конечно, всегда будет играть важную роль в дизайне веб-сайтов. Понимая психологию выбранных вами цветов, вы можете создавать более эффективные всплывающие окна, которые конвертируются. Конечно, вы также не можете забыть об установленной цветовой схеме для вашего бренда, поэтому все дело в поиске баланса между созданием всплывающего окна, которое хорошо выглядит на сайте, но которое также заставляет посетителей действовать.
3. состав
Важно сделать шаг назад и увидеть всплывающее окно целиком. Хотя дизайн каждой движущейся части во всплывающем окне имеет значение, равно как и общий вид всплывающего окна.
Ваше всплывающее окно должно:
- быть простым и легким для подражания.
- Разработанный с чистыми линиями и быть хорошо сбалансированным.
- Включите актуальные изображения с высоким разрешением; в идеале, одно изображение, которое резюмирует предмет предложения.
- Похоже на расширение вашего сайта и, очевидно, не из всплывающих окон с ограниченными возможностями настройки.
- Используйте большую, легко читаемую типографику.
4. текст
Затем у нас появляется всплывающее сообщение. Хотя вы еще не разрабатываете язык, который описывает эти вещи, существует ряд передовых методов, о которых вам следует знать, когда дело доходит до заполнения всплывающих окон текстом.
Помните следующее:
- Всегда включайте заголовок, короткое сообщение (достаточно одного предложения) и призыв к действию.
- Используйте сильный язык, который привлекает эмоции посетителей.
- Будь краток. Если вы не можете написать его менее чем 30 словами, это сообщение не относится к всплывающему окну.
- Используйте тот же тон и индивидуальность, которые вы используете на своем сайте.
- Предложите что-нибудь ценное, что ваши посетители не найдут в другом месте на сайте.
- По возможности используйте срочность. Если вы не можете сделать это словами, сделайте это с помощью цвета.
5. CTA
В наши дни наблюдается странная растущая тенденция, когда веб-сайты предлагают посетителям два варианта призыва к действию. Я понимаю, почему эта тенденция растет, но я видел, как ее неправильно применяют на стольких веб-сайтах, что я надеюсь, что в конце концов эта тенденция исчезнет.
Вы, наверное, видели это плохое приложение сами:
- Положительный вариант : Этот говорит: «О, спасибо, спасибо! Я знаю, что это предложение изменит мою жизнь к лучшему! "
- Отрицательный вариант : Этот говорит: «Мне нравится делать неправильный жизненный выбор, и я ценю, что ты потираешь меня по лицу». Позвольте мне нажать на эту опцию автоматического прекращения поддержки, только чтобы получить другое окно, которое снова спросит меня, хочу ли я принять это ужасное решение. "
Это не означает, что все всплывающие окна с двумя вариантами призывов к действию плохо спроектированы или предназначены для того, чтобы посрамить посетителя. У Тима Ферриса есть хороший пример хорошо сделанного двойного призыва к действию:
В целом, однако, я бы сказал, что если вы пытаетесь саркастично или запугать своих посетителей, заставляя их принять их решение, то выйдите со своего сайта и разместите его в Twitter. На вашем веб-сайте нет места для этого, и мы надеемся, что Твиттер его полностью поглотит.
Помимо этой любимой раздражения, я также предлагаю сделать призыв к действию простым. Используйте простой язык, который дает понять, что посетители получат, если введут адрес электронной почты или нажмут кнопку. Кроме того, сведите задание к минимуму: не более двух полей для заполнения (например, адрес электронной почты и, возможно, имени) и одну кнопку, которую нужно нажать.
Вот и все для этого урока, я надеюсь, что он позволит вам хорошо разработать кнопки призыва к действию.
