Создаём сайты со смыслом для роста продаж Подробнее
Содержание
В интернете много информации про то, как создать лендинг своими руками. Бытует мнение, что можно сделать за 30 минут/час и не платить десятки тысяч агентствам, экономя большие средства на разработке.
С технической точки зрения все верно, создать лендинг без программистов и дизайнеров легко, используя конструкторы.
С критической точки зрения, если каждый может самостоятельно и РЕЗУЛЬТАТИВНО сделать лендинг, то резонно появляются вопросы:
Ответ прост — результат. Достигнуть его с профессиональными специалистами в несколько раз быстрее, чем в одиночку и без опыта.
Что подразумеваю под результатом? Готовый уникальный упакованный продукт, который генерирует лиды и обращения клиентов с конверсией от 3% за счёт проработки целевой аудитории, анализа компании и конкурентов.
Нужен лендинг?
Закажи создание сайта на Tilda от 60 т.р.
Получи коммерческое предложение и кейсы по разработке
А вот сравнительная таблица по ключевым параметрам уникального лендинг пейдж против одностраничного сайта на конструкторе:
Авторский лендинг | Лендинг на конструкторе | |
Сроки создания | От 14 дней | До 3-х дней |
Абонентская плата | Нет | Есть |
Ограничение блоков, функционала | Нет | Есть |
Стоимость | От 60 т.р. за все время |
От 7,2 т.р. за год (~ 600 р./месяц) |
Редактирование | Ограничено | Не ограничено |
Хостинг и домен | 2000 на год | Входит в абонентку или ~ 2000 на год |
Дизайн | Уникальный | Шаблонный |
Конверсия | От 3% | Как получится |
CRM система | Нет | В некоторых конструкторах да |
A/B тестирование | Нет | Есть |
Перед началом разработки напомню, какие функции выполняет landing page:
Если делаешь лендинг самостоятельно, то не можешь в полной мере рассчитывать на глубокую маркетинговую проработку из-за неподготовленности и отсутствия опыта (исследование целевой аудитории, анализ конкурентов).
Про дизайн и верстку вообще забудем, чтобы овладеть этими навыками нужны сотни часов.
Поэтому, решив создавать лендинг на конструкторе уже с самого начала теряешь часть эффективности: вызвать эмоции и привлечь внимание шаблонным дизайном врятли получится.
Дизайн не главный показатель, но все же влияет на определённый % конверсии.
В условиях высокой конкуренции даже небольшие детали влияет на результат.
Может быть интересно:
Немного про доверие. Увидя лендинг со стандартными блоками и содержимым, у меня появляется мысль: «сделали на коленке за день и продают за 250 000» (особенно актуально, что касается дорогих продуктов).
Понятно, что так рассуждают не все, а какая-то часть, но что-то мне подсказывает, что платёжеспособная аудитория отваливается именно здесь (уходит с сайта).
А работать придётся с теми, для которых главный фактор принятия решения — цена.
Хорошо ли это или плохо каждый решает сам, но зачем отказываться от людей, с которыми приятно общаться и готовых платить, ради экономии 40 000 - 80 000 не совсем понятно.
Приведу примеры, когда делать лендинг самому объснимо:
В других случаях разработку landing page лучше делегируй специалистам.
Из-за указанных выше причин разделил создание лендинга на 2 варианта:
Перед тем, как создать одностраничный сайт необходимо выполнить предварительное исследование и ответить на вопросы:
Отвечая на вопросы, записывай все в документ. Вся собранная информация понадобится для следующего этапа.
Если работаешь не первый месяц, то вспоминаешь часто задаваемые вопросы клиентов. Свяжись с ними и задай вопросы:
А если первый, то представь себя на месте клиента: что беспокоит, что важно при покупке.
Полезно почитать комментарии и обсуждения живых людей (форумы, соцсети). Чем более негативные они будут, тем больше болей и возражений сможешь закрыть.
Ответив на все вопросы смело приступаем к сборке одностраничного сайта.
Делаем лендинг для одного сегмента людей, а не для всех подряд.
Получи 600 рублей на конструктор сайтов
30 дней бесплатного использования
Будущий лендинг держится на четырёх китах:
Сформировать структуру поможет лестница Ханта. Суть в том, что человек перед принятием решения о покупке проходит 5 этапов:
Какое отношение лестница Ханта имеет к разработке структуры? В зависимости от канала трафика меняется уровень осознанности человека.
Контекстная реклама с транзакционными ключами: заказать, по ключ, цена, самая горячая аудитория и 5 этап принятия решения — поиск поставщиков.
Может быть интересно:
Человек открыл несколько сайтов и изучает предложения конкурентов помимо твоего. На этом этапе обрати внимание на УТП и выгоды, которые получит клиент в работе с тобой.
По поисковому запросу понятно, на каком этапе находится пользователь.
Запуская таргетированную рекламу работаем с 1-2 этапами, а значит схема содержание блоков другая и аудитория более холодная.
В таргете видим интересы, но не потребности людей и направляем рекламу на аудиторию с 1 по 5 уровень.
Конверсия из-за этого значительно ниже, чем с контекста.
Поэтому для быстрого старта и результата возьмём 4-5 этап по лестнице Ханта, чтобы работать с горячей аудиторией через запуск контекстной рекламы в Яндекс Директ и Google Реклама.
2 этап Осознание проблемы |
3 этап Сравнение решений |
4 и 5 этап Выбор продукта и поставщика |
УТП | УТП | УТП |
Проблемы/боли или возможность | Раскрытие УТП или что делает компания? | Выгоды продукта |
Выгоды от продукта | Блок про доверие | Выгоды компании |
Выгоды компании | Выгоды продукта | Блок про доверие |
Отзывы, гарантии и акции | Отзывы, гарантии и акции | Отзывы, гарантии и акции |
Да-да, придётся ещё и рекламу учится настраивать, заявки без трафика сами собой не появятся. А какой бюджет потребуется для рекламной кампании, можно узнать, прочитав эту статью.
Рекламная подписка от Яндекс Бизнеса автоматически создаст и настроит объявления. Реклама появится в поиске Яндекса, Картах и на сайтах Рекламной сети. Только там, где есть твои потенциальные клиенты.
Структура зависит и от продвигаемого продукта.
Для простого и дёшевого продукта (щебень оптом, вывоз мусора) достаточно 5-6 блоков.
Для более сложного и дорогого (консалтинг, CRM-системы, строительство домов) придётся приложить гораздо больше усилий, а значит одностраничный сайт будет длиннее и информативнее.
Что ещё нужно знать про структуру? Это кто целевая аудитория.
Премиум дизайн, большое количество выгод, гарантий оттолкнёт в эконом-сегменте.
Простой дизайн и стандартная схема блоков: наши преимущества, наши работы, как мы работаем не сработает с премиум аудиторией.
Также влияет ниша. Каталога и условий сотрудничества будет достаточно в оптовой продаже. В продаже нового уникального товара необходимо показать: его свойства, когда применяется, чем полезен.
Начнём с первого экрана, состоящего из:
Первый экран конверсионного лендинга
Оффер. Без него даже самая крутая посадочная страница конвертить не будет. Главный заголовок должен зацепить человека с первой секунды нахождения. Обязательно уникальный оффер, без копирования у конкурентов.
Используй формулы:
Подзаговок раскрывает или дополняет оффер. В нём пишем дополнительное преимущество предложения или усиливаем боль потенциального клиента.
Буллеты усиливают предложение. Что писать в буллетах:
Избегаем водности и неподтвержденных фактов: лидер рынка, низкие цены, квалифицированные профессионалы, лучшее качество.
Про кнопки и cta подробно написал в этой статье.
Для некоторых ниш достаточно одного экрана, там где:
Одноэкранник по продаже десертов оптом — dessertbro.ru
Да и во многих других нишах может хватить одного экрана. По статистике 76% заявок приходится с форм первого экрана. Не у всех пользователей есть время, чтобы долго листать.
Как оформить идеальный первый экран, избежать ошибок и увеличить конверсию читай здесь.
Выписывав всевозможные варианты, раскидывай их по лендингу: крупные и объёмные вопросы (часто задаваемые) выносишь в отдельный блок, где подробно раскрываешь.
Менее значимые добавляй в буллеты второстепенных блоков или в блок вопросов.
Лендинг должен ответить на вопросы пользователей, прогреть и продать продукт, чтобы при разговоре по телефону сократить количество вопросов до минимума, максимально приблизив к сделке.
Теперь подберём платформу, зарегистрируем аккаунт и начнем собирать сайт.
У некоторых конструкторов сайтов есть бесплатная версия, но с: урезанным функционалом; минимальными инструментами и интеграциями; метками платформ и другими хитростями за дополнительную плату.
К примеру, для привязки домена в каких-то приложениях придётся перейти на платный тариф.
В таблице тарифы, с необходимым функционалом для нормальной работы. Подробный обзор лучших конструкторов лендингов 2023 в этой статье.
Онлайн-сервис выбирай на свой вкус. Они между собой похожи и выполняют главную цель — возможность разработки лендинга самостоятельно и условно бесплатно.
Для вдохновения:
Создавать буду в конструкторе Creatium, в котором можно собрать абсолютно любой сайт, в том числе и магазин.
Ресурс отлично подойдёт новичкам из-за простого управления, но потребуется время, чтобы привыкнуть к интерфейсу и панели навигации платформы.
Плюсы Creatuim это: круглосуточная оперативная поддержка, адаптивные шаблоны под разные ниши, удобный визуальный редактор, возможность создания квизов и калькуляторов, различные интеграции, внутренняя аналитика и встроеннная CRM система.
Визуальный редактор внутри выглядит вот так:
Для начала работы выберем подходящий шаблон, который будем редактировать под нашу нишу.
Первый экран:
Второй экран: 3-4 преимущества компании в приоритетном порядке.
Далее форма на бесплатный замер у вас дома уже сегодня. Важно добавить, что ты заботишься о здоровье клиента, поэтому специалист приедет в средствах индивидуальной защиты. Замечу, что название кнопки релевантно заголовку.
Третий блок: 3-4 преимущества продукта.
Четвертый блок о продукции, варианты покупки.
Кто не готов рассчитать проект предложим альтернативу — беспроцентную рассрочку на 6 месяцев.
Далее блок про доверие — выполненные проекты. Если в проект добавить 5-7 фотографий: снаружи/внутри объекта; со специалистами, устанавливающими окна, то ты подтверждаешь, что фотки не сворованные с интернета и компания реально существует.
А затем прикрепи видеоотзыв на фоне выполненной работы и это неминуемо приведёт к поиску кнопки заказать.
6 экран: дополнительные преимущества продукта + гарантия.
Что-то давно не было форм. Дополним про расчет в других компаниях.
Дополнительный экран про комплексную работу (всё в одном месте) и качество оказываемых услуг с подтверждающими сертификатами. На сертификаты клиентам начихать, но сам факт что они есть, откладывается в голове с положительной стороны.
Восьмой экран: про установку и качество работы. Обошлись без слова качество. Описали, что если сделать это и это, прослужит долгие года.
Финалим. Если человек пролистал всю страницу, значит его до сих пор ничто не побудило оставить заявку. Это наш последний шанс заполучить контакты потенциального клиента. Сделаем ему шикарное предложение от которого нельзя отказаться: скидка или подарок в случае заказа.
Я не стал шиковать и указал скидку 14% в день замера в случае подписания договора.
Отлично! Теперь можем посмотреть наш сайт. Нажимаем кнопку «Опубликовать» и он станет доступным к просмотру для всех пользователей.
Важно:
Пример: как создать лендинг самостоятельно
Хостинг Beget отлично подойдёт, если решишь создавать сайт на популярных платформах: WordPress, ModX.
Теперь попробуем создать одноэкранный лендинг с квиз-опросом на конструкторе сайтов Flexbe.
В буллетах раскрываем наши преимущества, подход к работе и предлагаем рассчитать стоимость работ.
Интерактивный опрос вовлекает человека. Первым вопросом уточняем, какие работы необходимо выполнить.
Благодаря второму вопросу понимаем срочность оказания услуги. График прогресса показывает, сколько вопросов осталось до получения результата.
Третий вопрос про материал, который необходимо резать. Их можно составить таким образом, чтобы сразу фильтровать нецелевые заявки. Или в зависимости от ответов изменять скрипт разговора.
Последний пункт — взятие контактов. Человек ожидает узнать стоимость, но расстроится, увидев контактную форму. Но если добавить подарок за прохождение теста, например, бесплатную уборку и написать об этом над кнопкой расчёта, конверсия заиграет другими красками.
Важно:
Хочешь получать клиентов на свои услуги?
Получи коммерческое предложение и кейсы по SEO-продвижению
Самое важное в создании лендинг пейдж это его продающая структура.
Дизайн важен, но вторичен. Нельзя сделать хороший результат только на голом красивом дизайне без смыслов и прощающего текста.
А вот в обратную сторону это работает, проработанные заголовки, тест и призывы к действию даже при посредственном дизайне дадут неплохую конверсию.
Посредственный дизайн как у всех сойдёт на начальном этапе, но это не значит, что он неаккуратный, броский и отталкивающий.
Ошибка 90% предпринимателей, фрилансеров или агентств начинать разработку без маркетинговой проработки.
В результате отсутствия этого этапа лендинг разработан для всех аудиторий, не закрывает возражений, не демонстрирует выгод и как следствие не оправдывает возлагаемых надежд.
Поэтому лендинги исчерпали себя и не работают, сообщают всему миру пробовавшие, вводя в заблуждение тех, кому только предстоит получить свой первый опыт с посадочными страницами.
Да бывает, что когда все сделано идеально с твоей точки зрения, лендинг не приносит отдачи.
Но сделать с первого раза так, чтобы сразу выстрелило проблематично, поэтому и придумали тестирование с аналитикой. С их помощью путём проб и ошибок придёшь к тому, что будешь улыбаться, когда кто-то в следующий раз скажет, что лендинги ерунда.
Чтобы получить продающий лендинг необходимо пройти эти этапы и с большей долей вероятности, если каждый этап сделан качественно, то на выходе — лендинг с высокой конверсией.
Как устроен процесс разработки в нашей студии:
Скинуть бриф, чтобы после на вопрос ваши преимущества прочитать: профессиональные преподаватели или уникальные технологии, ну уж нет.
У нас процесс построен по-другому: созвон проходит в виде интервью и с помощью уточняющих вопросов раскрываются преимущества понятным языком.
Уникальные технологии это какие? Шоковая заморозка, снижение температуры с +5° до −18° для длительного хранения продуктов.
После заполнения брифа переходим к маркетинговому анализу.
Причин заморачиваться с маркетинговым анализом достаточно:
Задача изнутри изучить компанию, получить экспертизу в нише клиента, выявить детали, которые представят компанию №1 в глазах покупателей в интернете.
На основе ответов (более 50 вопросов на интервью):
Основные категории вопросов из анализа:
Если у компании есть лендинги, то запрашиваем доступ к Яндекс Метрике и Гугл Аналитике.
Анализ поведения пользователей через Вебвизор, карты (ссылок, кликов, скроллинга, форм) покажет, что интересно/неинтересно пользователям и почему.
Отталкиваясь от полученных данных, понимаем, что определённые блоки не нужны или требует переработки, а с которыми активно взаимодействовали - берём и улучшаем.
Пример: продажа нижнего женского белья в премиум-сегменте.
На вопрос кто твоя ЦА, собственник отвечает: девушки/женщины от 20 до 55 лет со средним доходом и выше из города-миллионника.
Это размытая информация и ничего полезного не несёт.
Нужно подобрать типичного представителя целевой аудитории. Выписываем всех, кто влияет на принятие решения.
1 Landing Page - 1 Персонаж
Определяем основного персонажа, тот кто совершает покупки/приносит 80% прибыли.
После выявляем его особенности, боли, проблемы, которые в дальнейшем используем в рекламе и в структуре.
Изучаем сайты отзовики, тематические форумы, соцсети и поисковые запросы в Яндекс Вордстат.
Вбиваем ключевое слово + форум и читаем проблемы людей. Берём формулировки и внедряем. Таким образом говорим на одном языке со своей аудиторией.
Поищем дополнительные варианты, вбиваем в Яндекс Вордстат нишу и добавляем слова: +как, +что, +какой.
В вордстате смотрим фразы, как люди ищут решение проблемы. Эта информация даст понимание для разработки в будущем лендосайта, мультилендинга или многостраничного сайта.
Критерии выбора, на что будет смотреть при выборе подрядчика (скорость, надёжность, доставка).
Потребности, зачем вдруг понадобилось?
Возражение и сомнения, что может помешать купить?
В результате, знаем:
Вбиваем основные запросы. Смотрим сайты с рекламы и органическую выдачу. Лендинги или многостраничные сайты, без разницы, у всех можно взять что-то полезное.
Выписываем офферы, выгоды, цены, продуктовую линейку, акции, уникальные блоки, фишки в таблицу по 10-15 конкурентам. Всё, что кажется привлекательным на твой взгляд для ЦА.
Как составить сравнительную таблицу? Критерии сравнения берём из анализа ЦА, а конкретнее из факторов принятия решения (качество, гарантии, срок реализации).
Оцениваем, как пользователь:
Конкурентный анализ поможет докрутить собственное предложение, посадочную страницу и продукт, устранить слабые стороны и понять ситуацию на рынке.
Анализ конкурентов
Если перед началом разработки гадаешь, что нужно отобразить, то после прохождения первых 4 этапов, будешь ломать голову из-за десятка сгенерированных идей.
Всё это собирается в продающую структуру — смысловую логическую последовательность заголовков без контента.
Идеальной структуры не существует. Наличие блоков, элементов и их правильная последовательность будет разной в каждой новой ситуации и зависят от:
Что делает пользователь при переходе на сайт?
Сканирует страницу, не вчитываясь в контент, обращая внимание при прокрутке на крупные элементы — заголовки 2 уровня (заголовок 1 уровня на первом экране). Поэтому нужно зацепить внимание заголовком, попасть в критерии/потребности, чтобы после прочтения заголовка захотелось изучить блок со всем контентом.
Заголовки второго уровня должны запоминаться, доносить смысл, что ты — действительно лучший выбор.
Написать просто текст недостаточно. Продающий текст не выдумывается, а опирается на реальные данные из маркетингового исследования.
Текст говорит на одном языке с клиентами и связан с их психологией покупки и выбора. Без воды, просто и понятно. Информационным стилем с фактами и цифрами.
Основа и фундамент. Выглядит прототип, как последовательная схема блоков с заголовками, текстом, формами захвата и призывами к действию.
Это важный документ, показывающий содержимое без дизайна с примерным расположением элементов.
Внести изменения в прототип легче, нежели переделывать дизайн и вёрстку.
Большая часть конверсии зарыта на этом этапе.
После согласования прототипа переходим к созданию дизайна.
Пример прототипа
Задачи продающего веб-дизайна:
Замечу, что здесь нет слова красивый. Каждый человек воспринимает красоту по-разному. Для кого-то, это множество ярких элементов, для других минимализм.
Часто дизайн делается под заказчика, чтобы понравилось ему и его окружению. Это в корне неправильный подход, если цель — высокие конверсии.
После анализа целевой аудитории знаем, кто основной персонаж. Исходя из его предпочтений создаётся дизайн.
Подбираем референсы работ. Дизайнер отрисовывает первый экран в графических программах Photoshop или Figma. В случае полного непопадания с ожиданиями заказчика переделывает. После согласования воспроизводится дизайн всего макета.
Дизайн в фотошопе
С помощью вёрстки превращаем дизайн из графического макета в читаемый интерактивный код для браузера.
Преимущество ручной вёрстки в оптимизации кода. Чем меньше кода, тем быстрее скорость загрузки страницы, а это в свою очередь может увеличить конверсию. Ну или хотя бы не режет её.
К примеру, в конструкторах или cms-системах типа Wordpress подключены дополнительные библиотеки скриптов, которые на лендинге не используются, но загружаются для полного функционала применимого в будущем.
Вёрстка чистым кодом это:
Готова продающая структура и wow-дизайн, казалось бы идеальный проект, который порвёт рынок. Но долгая загрузка, кривое отображение на устройствах или некорректный вид в браузерах, неработающие формы заявок и кнопки приблизят конверсию к 0.
Вёрстка
Но это ещё не финиш. Нужно убедиться, что лендинг корректно отображается на всех устройствах, браузерах и разрешениях. Весь функционал и отправка заявок работают.
После успешного тестирования разработчики переносят сайт на боевой хостинг и привязывают домен.
Подключаем ssl-сертификат, чтобы соединение было по защищенному протоколу https.
Прописываем метаданные: h1, title, description. Добавляем файлы robots и sitemap.
Склейка зеркал, чтобы страница была доступна по одному адресу.
Регистрация в Яндекс Вебмастер и в Google Search Console.
Подробнее о том, как продвигать одностраничник и рационально ли это, написал в лонгриде: SEO продвижение лендинга: 9 шагов оптимизации.
Яндекс Метрика и Google Аналитика помогут проанализировать поведение пользователей.
Настройка целей позволит отслеживать конкрентные действия посетителей и понять конверсию landing page.
Если заказываешь лендинг + трафик у нас: месяц бесплатно работаем над увеличением конверсии.
Что входит в работу:
Создать лендинг бесплатно самому врятли получится. Конструкторы лендингов предоставляют пробный период по истечению которого доступ к сайту будет ограничен. Есть тарифы с бесплатным использованием, но там функционал сильно урезан и собрать что-то путное сложно.
Так что, сделать лендинг бесплатно это маркетинговый ход компаний, чтобы заманить побольше клиентов на свои платформы. Платить всё равно придётся.
Пошаговая инструкция поможет собрать достойный лендинг с нуля.
Перед началом работ проводим исследование. Отвечаем на вопросы: кто наша целевая аудитория, в каких случаях покупают, что тревожит перед покупкой, конкурентные преимущества. После этого создаем структуру из заголовков и пишем текст.
Ну а дальше дело техники. На примере 2 конструкторов: Creatium и Flexbe создаём сайт. Можно найти шаблон в схожей тематике, адаптировать и отредактировать его.
Функционал конструкторов позволяет кастомизировать готовые блоки под фирменные цвета компании.
Взвесив все за и против, убедившись, что создание лендинга под ключ сложно и долго, ознакомься с правильным подходом к разработке.
Наш подход из 13 этапов позволит сделать полноценный инструмент, такой лендинг пейдж, который будет пpoдaвaть и сможет достучаться до нужной аудитории.
Понравилась статья? Сохраняй в закладки нажатием клавиш: Ctrl + D
30 дней бесплатного периода по ссылке на конструктор лендингов Creatium
×
Комментарии (0)