Как сделать мобильную версию лендинга. Инструкция создания мобильной версии лендинга. шагов по созданию идеального лендинга

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

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

Итак - что и как адаптируем?

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

• Меню. Упростите навигацию по меню - избавьтесь от не самых важных опций, многоступенчатых вкладок и мелкого шрифта.

• Таблицы. Любой интернет-магазин состоит из таблиц с товаром, да и на других сайтах они встречаются часто. Для того, чтобы эти данные отображались корректно при адаптации лендинга для мобильных устройств, предусмотрите возможность горизонтальной прокрутки - так, чтобы основной контент при этом оставался неподвижным.

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

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

• Адаптивность. Многим кажется, что оптимизировать лендинг под мобильные устройства означает сделать его адаптивным. Это не совсем так: сайт просто должен правильно отображаться на всех экранах, что достигается отнюдь не одной-единственной технологией. Подробнее о технологиях мобилизации сайта в нашей статье.

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

Все эти сложные на первый взгляд вещи легко укладываются в простые решения. На российском рынке представлен выбор вариантов адаптации landing page под мобильные устройства на любой вкус и кошелёк: можно нанять целую веб-студию или воспользоваться онлайн-сервисами Например, в MoAction представлено более 100 готовых решений, которые имеют наивысшую оценку по мобильности от Google и являются профессиональными.

Выбор за вами!

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

Увеличить скорость загрузки

Это ключевой параметр, так как если сайт открывается дольше пяти секунд, то вероятность того, что пользователь не захочет дожидаться, возрастает многократно. Для сайта существуют различные сервисы. Кроме того, подсказать может и Google Analytics. Нужные данные можно посмотреть в сводках, где предварительно настраиваются виджеты «Время загрузки страницы» :

Что можно сделать, что увеличить скорость:

• Убрать мусор из кода;
• Уменьшить количество сторонних скриптов;
• Убрать редиректы;

Подробнее об увеличении скорости открытия страниц можно прочитать .

Изучите девайсы пользователей

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

Расположение главных кнопок

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

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

Прикрутите клавиатуру к формам

Чтобы форму было проще заполнить, нужно прикрутить к ней клавиатуру.

Чтобы облегчить заполнение соответствующих полей, используйте код:

Это сделает пользование вашим сайтом гораздо более удобным.

Продумайте дизайн мобильного лендинга

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

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

Закрепите хедер

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

Поместите текст и изображения в одну колонку

Думаем, вы сами обращали на это внимание: мобильная версия сайта выстраивает все элементы в один столбец: и картинки, и текст, и форма. Это сделано не случайно. Если бы все элементы сайта были расположены вразнобой, как на версии для компьютера, это бы многократно усилило вероятность заблудиться на сайте.

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

Не пропустите:

Landing page – это веб-инструмент маркетологов для увеличения прибыли компании. Прощающая страница имеет более высокие показатели конверсии, чем простая страница. Чтобы она была максимальной, посадочная страница должна вызывать доверие у пользователя, а также правильно отображаться на всех устройствах. Ниже мы выясним почему важно оптимизировать страницу под мобильные устройства.

Количество переходов из мобильных устройств стремительно растет:

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

Почему показатели мобильного трафика стремительно растут?

• Изобилие мобильных устройств на рынке
• Большое количество интернет-операторов
• Хорошее качество мобильного интернета
• Распространение wi-fi зон
• Появление мобильных версий известных браузеров
• Простота и удобство использования мобильных девайсов

Клиенты совершают переход на страницу в поиске нужной информации/товара/услуги, работая с телефонами, смартфонами, айпадами, планшетами. Мобильный трафик вашей landing page легко проследить. Для этого существуют специальные онлайн-инструменты (например, LiveInternet, Google analytics). Они совершают непрерывный сбор статистики посетителей лендинг пейдж, в том числе ведут сбор информации по трафику.

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

Зачем это нужно?

• Чтобы не потерять потребителей. 50% клиентов не возвращаются на целевую страницу, если у них был печальный опыт входа на эту лендинг пейдж.
• Чтобы все посетители интернета смогли полноценно изучить посадочную страницу. Она должна быть mobile-friendly. 91% мобильных соискателей конвертируются в покупателей.
• Предоставить клиенту возможность посетить лендинг пейдж с любого доступного устройства.

Что нужно делать чтобы не потерять клиента их мобильных устройств?

• Выбираем качественный хостинг. Обеспечиваем быстрый и постоянный доступ к целевой странице. Мобильный пользователь не будет ждать, пока загрузится страница, ему нужна информация сейчас.
• Редирект на мобильную версию. С возможностью вернуться к полному варианту.
• Специальная верстка страницы под мобильный трафик. Для правильного отображения лендинг пейдж на мобильных устройствах.
• Меню навигации (вверх - вниз)
• Вертикальная прокрутка (перелистывание)
• Удобный интерфейс и релевантная запросу информация
• Не перегружаем страницу. Отказываемся от флэш в пользу HTML, JQuerty, jpeg - графики.
• Сдержанный, но соответствующий общей концепции лендинг пейжд дизайн
• Контент располагаем в одну колонку, где “call to action” пишем в верхней части главной колонки. Если же призыв необходимо разместить внизу, то вверху страницы обязательно используем тизеры.
• Масштабируем. Приемлемый размер для правильного отображения на мобильных гаджетах - до 8 дюймов.
• Функция звонка по касанию. Клиенту легче нажать одну кнопку, чем набирать весь номер.
• Обеспечиваем кликабельность кнопок. Они должны быть такого размера, чтобы потребитель без труда совершил действие; располагаются на расстоянии друг от друга для функциональности.
• Создаем кнопки социальных сетей. Большинство мобильных посетителей используют свои устройства для посещения соц. сетей.
• Адаптируем текст (таблицы, маркеры, тезисы)
• Читабельность страницы. Возможность просканировать, а не читать.
• Заменяем ссылки на кликабельные кнопки
• Локализируем поиск. Для увеличения показателей ранжирования, используем запрос, релевантный по отношению к месторасположению посетителя.
• Датоориентируем. Мобильный трафик связан с событиями теперешнего и будущего времени.
• Улучшаем формы захвата, анкеты (мало полей для заполнения)
• Ориентируемся на вертикальное и горизонтальное расположение
• Тестим. Проверяем эмуляторами качество отображения лендинг пейдж на разных мобильных устройствах.

Стоит учитывать потребности мобильных пользователей целевой страницы. Они занимают почти половину всего трафика лэндингов и их количество растет.

Инновационные процессы в IT-сфере увеличивают мобильный трафик. Спрос на mobile-friendly ресурсы превышает предложение, поэтому заранее позаботьтесь о адаптивности своей продающей страницы.

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

Между тем, лендинг лендингу рознь. Один лендинг пейдж, работая в паре с рекламными баннерами, успешно проинформирует клиента о товаре и услуге и подтолкнет его к совершению покупки (или любого другого необходимого действия), а другой — так и останется обыкновенной страницей сайта, только немного красивее и “навороченнее” других.

Что же делает посадочную страницу успешной?

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

Хорошее юзабилити позволяет клиенту чувствовать себя на посадочной странице как дома: структура элементов удобна; контент и призывы к действию плавно подводят клиента к покупке; лендинг не перегружает клиента лишней информацией; лендинг не заставляет клиента бешено скроллить по странице, чтобы найти желанную (или на этот момент уже нет?) кнопку покупки.

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

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

О чем нужно помнить, разрабатывая мобильную лендинг пейдж. 7 советов

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

Итак, начиная работать над лендингом, ответьте себе на следующие вопросы:

• Влияют ли размер экрана, тип устройства и общий контекст использования на ожидания пользователей? Если да, то как?
• Что больше всего может понадобиться мобильным пользователям на данном лендинге?
• Что потенциальные пользователи захотят сделать, попав на мобильный лэндинг? Каковы их действия?

Вроде бы, ответы на эти вопросы очевидны, но не стоит их недооценивать. Дело в том, что мобильные пользователи делают покупки не так активно, как десктопные. Конверсия распределяется примерно следующим образом:

1. Планшеты
2. Смартфоны.

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

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

Подытожив, можно сказать, что цель клиента — найти информацию, цель владельца сайта — получить деньги, а цель дизайнера и разработчика — сделать лендинг, который мог бы привлечь максимальное количество наводок (лидов).

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

Банально, но самый просто способ для клиента определиться, покупаю или нет, — позвонить. Следовательно, настройте сервис быстрых звонков. Пусть заветная иконка с телефоном сопровождает потенциального клиента по всему лендингу. Обратите внимание, что это должна быть именно иконка с телефоном и каким-нибудь призывом к действию типа “Позвони сейчас!”. Ряд исследований показал, что иконка эффективнее обыкновенного телефонного номера на 10-20%.

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

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

Заставлять клиента долго и нудно вносить данные о себе для подписки или покупки, значит его потерять. До конца доходят только самые стойкие. Следовательно:

• сведите количество выпадающих меню к минимуму или вообще откажитесь от них;
• уменьшите общее количество полей для заполнения — всю дополнительную информацию может запросить работник call-центра после того, как клиент оставил заказ;
• убедитесь, что все оставшиеся поля правильно настроены, то есть клавиатура мобильного автоматически подстраивается под поле: ФИО — буквы, телефон — цифры и т.п.;
• если требуется регистрация, активируйте возможность зарегистрироваться через социальные сети;
• убедитесь, что сервисы оплаты не потребуют от клиента заполнять всю информацию еще раз.

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

Совет 4. Призыв к действию должен быть всегда на виду

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

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

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

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

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

Не тяните резину, а сразу сообщите клиенту, что он может получить на данной лендинг пейдж. Не используйте “красивые” фразы и длинные обороты — краткость, простота и ясность важнее стилистики. Запомните это.

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

Недавнее исследование, проведенное в США, показало, что тяжелые и неоптимизированные к низким скоростям Интернета посадочные страницы теряют 40-50% потенциальных клиентов. Что ж, в мире, где у любого бизнеса десятки конкурентов, ждать никто не хочет и, поверьте, не будет.

Чтобы сделать страницу более легкой, убедитесь, что:

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

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

Что из этого следует и причем тут мобильные лендинг пейдж? Посадочная страница будет успешной, если вам удастся разделить с потенциальным клиентом его желания и заботы, предложив ему грамотное и эффективное решение проблемы. Товары, услуги и лендинг пейдж под них есть у всех, а вот решение — только у вас!

Поняв это, вы должны понять, какое решение самое эффективное. Тут на сцену выходит А/В тестирование. Используйте контрольные группы, чтобы выяснить:

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

Выводы

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

• “заточен” под какую-то одну задачу;
• достаточно информативен для того, чтобы клиент принял решение совершить необходимое действие;
• позволяет клиенту легко связаться со службой поддержки по телефону или же через форму контактов;
• не заставляет клиента заполнять множество полей при совершении нужного действия;
• не растекается мыслью по древу, четко и ясно дает понять, какую проблему решит клиент, совершив действие;
• быстро загружается, не заставляет клиента терять драгоценное время;
• позволяет совершить необходимое действие, в какой части лендинга не находился бы клиент (минимальный скроллинг);
• ориентирован не на предложении товара или услуги, а на решение проблемы клиента.

Отметим также, что мобильный лендинг пейдж должен обязательно пройти А/В тестирование. Так, вы повысите шанс того, что лендинг пейдж будет работать.

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

Здравствуйте, уважаемые читатели блога сайт. Сегодня мы поговорим о такой важной вещи как посадочная страница , которую очень часто на буржуйский манер называют лендинг пейдж (от английского landing page — целевая страница). Что же это такое и почему это так важно?

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

Что такое лендинг пейдж и почему это так важно

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

Скорее всего, вы забыли продумать и подготовить приземляющие (посадочные, целевые) страницы, которые часто называют лендингами . Что это такое?

А это очень важный момент, который может существенно повысить конверсию (количество покупок или регистраций), ибо landing page призваны максимально эффективно подводить пользователя к выполнению целевого действия . Если вы со всех рекламных объявлений будете направлять посетителей, например, на главную страницу сайта, то можете катастрофически снизить конверсию и вылететь в трубу.

Сам термин «лейдинг пейдж» образован от английской фразы «landing page», в переводе означающей как раз целевую, посадочную (приземляющую) страницу. Лендинги создаются не абы как, а с учетом психологии посетителей. Они должны цеплять и не отпускать их до самого момент покупки (или регистрации), ибо повторно привлечь посетителя будет уже архисложно.

Это как крючок на рыболовной снасти — он должен надежно подцепить и уверенно удерживать попавшуюся на него рыбу вплоть до того момента, как вы ее подсадком не зафиксируете. Если крючок (лейдинг) будет неподходящим или его не будет вовсе, то все ваши усилия от прикормки, установки наживки и прочих шаманских действий пойдут прахом. Конечной цели вы не достигните.

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

Примеры лендингов

В зависимости от преследуемых вами целей можно разделить посадочные страницы (лендинги) на несколько типов:

12 шагов по созданию идеального лендинга

Нужно понимать, что посадочные страницы, на которые будут привлекаться вами пользователи из социальных сетей (или из контекстной рекламы), должны обладать рядом характеристик и удовлетворять некоторым требованиям. Так как же создать идеальную лендинг пейдж ?

1. Каждый лендинг должен быть заточен только под одно целевое (конверсионное) действие — либо подписка, либо продажи. Не надо жадничать, ибо внимание пользователя будет рассеяно и сильно увеличится вероятность его ухода (так ничего и не выбрав из предложенных вариантов). Лучше как можно меньше заставлять клиентов думать и выбирать — путь на landing page должен быть прямым как стрела (очевидным для него) и без каких-либо ответвлений.
2. На посадочной странице обязательно должен присутствовать призыв к действию (с глаголами в повелительном наклонении — позвони, купи, получи, приди и т.п.). Фразы должны быть короткими и мотивирующими. Например, «купите сейчас», «получить видеокурс» или «подпишись и получи».
3. Рулят также яркие кнопки и стрелки , создающие на них акцент. Неплохо работают кнопки красных и желтых оттенков, ибо заметны и содержат как бы призыв к действию.

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

   

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

   

4. Если в лендинге используются (на подписных посадочных страницах без них не обойтись, но и на продажниках их довольно часто используют), то озаботьтесь тем, чтобы в них содержалось как можно меньше полей. В идеале, в форме должно быть только одно поле (для ввода Емайл адреса), но для дальнейшего общения (проведения маркетинга) вам понадобится знать и имя пользователя, поэтому два поля являются наиболее распространенным вариантом.Большее количество полей может существенно снизить конверсию. К тому же добавление полей для ввода телефона или адреса вызывает у пользователей настороженность и может привести к отказу от целевого действия.
5. В статье про я упоминал, что пользователи в интернете тексты не читают — они их просматривают. И самым важным в этом плане является заголовок. Если его нет (или он не выделен соответствующим образом), то это очень сильно снизит конверсию. На лендингах заголовки должны быть обязательно цепляющими , чтобы пользователь склонился к дальнейшему чтению или сразу к свершению конверсионного действию (подписке, заказу, звонку).

   

6. На вашей landing page должны быть не только призывы к действию и эффектные заголовки, но и аргументация необходимости подписки, покупки, заказа или звонка. В случае страницы подписки это может быть, например, небольшой видеоролик с описанием и содержанием «халявы», или все то же самое оформлено в виде краткого списка (перечня). В случае продажника это тоже может быть видеоролик с обзором товара, списком тех услуг, которые вы предлагаете (в том числе и ваши конкурентные преимущества).
   
   
7. Очень хорошо на посадочных страницах работают отзывы от уже состоявшихся клиентов, покупателей или подписчиков (лучше, если при этом будут указаны какие-то контакты тех, кто эти отзывы оставил, чтобы все выглядело правдоподобно).

   

8. Также неплохо работают на посадочных страницах сравнения «до и после» . Не для всех тематик это применимо, но в области похудения, косметологии, фитнеса и многих других ниш это можно с высокой эффективностью использовать. Например, так делает фирма, предоставляющая услуги ресторации.
   
   
9. Страница landing page может быть довольно длинной, но при просмотре первого экрана (это та область страницы, что видна без использования прокрутки) пользователю должно быть совершенно ясно и понятно, что именно вы хотели ему сказать.
10. Для стимулирования подписчиков или покупателей некоторых товаров (например, ) можно использовать вариант дополнительных бонусов, которые получит подписчик или покупатель при заказе. Когда пользователь находится на грани принятия решения, то как раз такие «плюшки» могут перевесить чашу весов в вашу пользу.
11. Ну и, конечно же, стоит делать упор на то, что «только здесь и только в течении нного количества времени» пользователю будет доступно все это великолепие (подписка, специальная цена на товар, дополнительный набор услуг). Как это сделать лучше всего? Правильно, поставить таймер, ведущий обратный отчет времени до часа Х, когда предоставленная возможность будет упущена. Ничто так не стимулирует к принятию решения колеблящегося пользователя, как буквально на глазах убегающие секунды.

    

    Рядом с таймером неплохо будет расположить форму подписки, заказа или контактный телефон. Это будет работать не всегда, поэтому надо проводить тесты (думаю написать ряд статей про проведение А/Б-тестирования — если не хотите пропустить, то подписывайтесь на рассылку), и возможно, что такой простой и очевидный способ позволит вам увеличить конверсию данной лендинг пейдж и с лихвой окупить деньги, потраченные на продвижение в социальных сетях или контекстной рекламе.

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

    

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

Примеры ошибок делающих landing нерабочим

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

1. Еще раз напоминаю, что в интернете практически никто не читает (во всяком случае вновь открытую страницу), а именно просматривает информацию. Если она окажется действительно стоящей и требующей более детального изучения, то тогда уже доходит дело и до прочтения (в общем-то, так же как и с газетами). Поэтому не допускайте перегруженности лендинга информацией — это может дезориентировать пользователя и вызвать реакцию отторжения еще до того момента, когда он разберется о чем там идет речь.
2. Текст должен быть небольшого объема, максимально лаконичен и наполнен информацией, а не водой. Пару абзацев «ни о чем» вызовут у пользователя бурное желание закрыть такую посадочную страницу. На landing page также плохо работает мелкий шрифт. В общем-то, его использование и не нужно, ибо для изложения сути много слов не потребуется.
3. Не обманывайте ожидания пользователя. Если в рекламе или в посте в социальной сети вы говорили об одном, а при попадании на лендинг пользователь видит несколько другое, то происходит утрата доверия и резко снижается конверсия. Очень важно следить за этим соответствием.

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

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

У вас есть еще немного времени? Хотите его провести с пользой? Тогда берите попкорн, садитесь поудобнее и смотрите двухчасовой мастер-класс «Пошаговый алгоритм создания Landing Page» :