Разработка лендинга для салона красоты. Landing page для салона красоты. Что такое прелоадер и какие задачи он решает

Landing page

Большинство из тех, кто пользуются интернетом для продвижения своих товаров и услуг, слышали термин Лендинг пейж (Landing Page - посадочная страница) - это эффективный способ продвижение товара или услуги в краткой, лаконичной форме с помощью сайта-одностраничника. Последние годы такой способ продвижения своей компании, товара или услуги, в сети интернет стал довольно популярен, иногда им даже пользуются компании, которые имеют полноценные сайты. Так как же создать эффективный landing page?

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

Фиксированный хедер - заголовок landing page

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

Позаботьтесь о качестве текста

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

Визуальное оформление

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

Лид-форма

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

Другие способы повышения эффективности

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

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

Услуги сферы «beauty» — парикмахерские, спа, частные косметологи — представляют собой крайне высококонкурентную нишу. Рассмотрим несколько лендингов ТОПа поисковиков, после чего представим шаблон сайта салона красоты от LPgenerator.

Лендинги Рунета

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

Сразу обращает внимание простая лид-форма с фактором срочности (скидочная акция, ограниченная временем). Стоит сказать о хорошем СТА. «Да, я хочу!» куда характернее стандартного, унылого «Отправить заявку».

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

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

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

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

Больше ничего особенного на свой лендинг салон красоты не добавил. Неплохо дано поле с фотографиями мастеров — которое существенно повышает UX. Но ничего выдающегося уже не найти — просто крепко сделанная работа.

Последний «герой» Рунета — ресурс Наталии Дунаевой, мастера по наращиванию волос. Кейс можно назвать крайнее примечательным.

Первый же экран просто хорошо выглядит. Два СТА: «Получить консультацию», «Заказать обратный звонок» — кстати, какое важнее для бизнеса? По-видимому, оба призыва ведут к одному.

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

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

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

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

Мы рассмотрели наиболее интересные кейсы сферы. Теперь разберем страницу от нашей платформы.

LP Store предлагает один вариант, подходящий под сегодняшнюю тематику. Разберем подробнее.

Лэндинг выполнен с преобладанием сине-голубой гаммы на белом фоне. По центру первого окна можно разместить крупное изображение, оффер. СТА-кнопка вверху справа.

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

Лендинг для салона красоты

Главной задачей любого одностраничника, в том числе и лендинга для салона красоты, является выполнение своей основной рекламной функции — привлечение клиентов, грамотная презентация товара/услуги и получение прибыли.

Салоны красоты оказывают целый комплекс разных мероприятий (услуги парикмахера, визажиста косметологические и SPA мероприятия и прочее). По-этому, в контексте Landing Page, важно не распыляться на все возможные оказываемые услуги, а сфокусироваться на какой то конкретной из всего перечня. В противном случае (если развернуто описывать все возможные услуги) мы собьем пользователя с толку и отпугнуть его, потеряв тем самым потенциального клиента.

Так же на своем лендинг пейдж салона красоты нужно больше акцентировать внимание читателя на всевозможных специальных предложениях и акциях, пример: «скидка наSPA процедуры по будням до 50%» и т.д.

Пример landing салона красоты

Landing page салона красоты должен иметь привлекательный и элегантный дизайн. Ведь в самой фразе «салон красоты» заложены воздушность, неповторимость и стремление к прекрасному. Как неопрятный, небрежный человек не может расположить к себе, так и одностраничник салона красоты не может позволить себе иметь неаккуратный, незавершенный и не симпатичный внешний облик. В противном случае – это будет просто злая ирония и непрофессионализм хозяев интернет-ресурса.

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

Ограничьтесь одной страницей

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

Пишите понятные призывы к действию

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

Сделайте кнопку заметной

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

Следите за порядком

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

Не увлекайтесь шрифтами

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

Проверяйте, хорошо ли читается текст

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

Используйте выразительные изображения

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

Ставьте якорные ссылки

Страницы с по-прежнему в моде, и их по-прежнему неудобно читать без якорных ссылок. Запутавшийся посетитель разочаровывается и уходит, а это, согласитесь, никак не способствует конверсии. Во избежание таких ситуаций, пользуйтесь - в редакторе Wix их можно создать буквально за пару минут. А бесплатное приложение поможет создать кнопку «Наверх» в два счета.

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

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

1. Минимализм

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

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

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

2. Используйте правило 5 секунд

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

Как этого достичь? Это возвращает нас к первому пункту - минимализм. Броский заголовок, цепляющая картинка, призыв к действию, и ваш лид готов.

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

Крейг Томлин, специалист по юзабилити, объясняет, почему правило 5 секунд так важно:

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

Например, давайте посмотрим на поисковую выдачу по запросу “landing page”:

3. Быстрая загрузка страницы

За каждую секунду задержки загрузки страницы, коэффициэнт конверсии снижается на 7% . Это еще раз подтверждает правило 5 секунд. Посетитель должен усвоить суть и преимущества вашего предложения в течение 5 секунд. Если страница довольно “громоздкая” и медленно загружается, делайте всё возможно для ее ускорения.

Для проверки скорости загрузки можно использовать Google PageSpeed .

4. Забудьте о каруселях и слайдерах

Да, со стороны это выглядит красиво. Может поэтому маркетологи так часто используют всевозможные слайдеры и карусели. Но на самом деле это может губительно сказаться на коэффициенте конверсии. Эксперимент на сайте университета “Нотр Дам” показал, что только 1% пользователей кликали на установленный слайдер.

Когда картинка меняется пользователи и не думают на нее кликать. Такие элементы только умаляют значение лендинга.

5. Используйте белое пространство

Современный пользователь сети не хочет увязнуть в громоздких блоках текстов и длинных параграфах. Исследования показали, что правильное использование белого пространства между пунктами, а также в левом и правом полях увеличивает понимание содержимого на 20%. Так читателю легче сосредоточится на основном контенте. Например, обратите внимание как использует белое пространство Buffer:

Пустое пространство на лендинге позволяет мозгу легко проанализировать информацию и решить что делать дальше.

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

6. Социальное доказательство

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

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

Это поможет существенно поднять доверие к вашему продукту со стороны посетителей.

7. Доступная контактная информация

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

8. Отзывы

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

9. Добавьте видео

С помощью видеоролика на целевой странице можно увеличить количество конверсий на 86%. Кажется невозможным, но это так.

Видео помогает более наглядно показать преимущества вашего продукта. И если посетитель посмотрел ваш видеоролик, то, скорее всего, он воспользуется вашим продуктом. Почему? Потому что, как минимум, он потратил свое время на его просмотр, и более детально понял важность и полезность продукта.

Следите за тем чтобы ролик был относительно коротким (5 минут максимум) и информативным.

10. Добавьте кнопки социальных сетей

Сарафанное радио ещё никто не отменял. “Шейр” довольного пользователя может принести дополнительные конверсии.

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