Лендинг, лединг, лейдинг, лендинг пейдж, одностраничный сайт, langing page, одностраничник, продающий сайт, посадочная страница.

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

Ну, раз нужен, то давайте решим вопрос с его созданием. Сделать лендинг самому? После этой статьи - не вопрос!

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

На всякий случай или этап 0

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

1. Получить новые заявки на товары/услуги;
2. Увеличить узнаваемость бренда;
3. Информировать о предоставлении товаров/услуг;
4. Предоставить консультацию по услугам;
5. Получить резюме от кандидатов;
6. Привлечь партнеров, дилеров, представителей;
7. Обеспечить доступ к сервису;
8. И прочее.

Перед тем, как начать творить, Вам нужно запомнить, что на одном сайте пытаться и продать товар, и привлечь дилеров нельзя. А все потому что это разные задачи, а это значит разные landing page.

Важно. Перед созданием Вам нужно чётко определить цель Вашего лендинга. И запомните - цель должна быть одна.

Пускай это сократит охват потенциальных людей, но увеличит эффективность страницы, которая оправдает в финансовом плане всё.

ЭТАП 1 - Отдать или сделать самому

На этом шаге Вам нужно определить какие из двух вариантов решения выберите Вы.

Что же делать... Что же делать

И выбираться будут они на основании Ваших денежных и временных ресурсов. Рассмотрим каждое из них с плюсами и минусами.

Конструктор

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

Выглядело это всё очень странно, ведь он до этого со всем ознакомился, подписал договор. Но мы компания не бедная, поэтому нам проще отпустить клиента с миром (не всегда), чем пытаться что-то доказывать. Что мы и сделали.

А всё это произошло потому, что он нашёл в интернете конструктор лендингов и узнал, что всё можно сделать самому, потратив на это буквально 5-6 часов, и заплатив при этом не больше 1 000 рублей в месяц.

Но мы то с Вами понимаем, что можно собрать и “машину” самостоятельно, но насколько она далеко поедет, насколько будет индивидуальный дизайн landing page, насколько будет корректное техническое оснащение...

Подробно все этапы создания лендинга со сроками мы описывали в статье .

Плюсы :

• Дешево. Прям очень. 500-1000 рублей в месяц и Вы - счастливый владелец одностраничного сайта;
• Просто. Вам не нужно думать о верстке, адаптации под мобильные устройства, подключении смс-оповещений о новых заявках на Ваш телефон. Все это уже есть и сделано для Вашего удобства;
• Быстро. Сделать и настроить можно реально всё быстро. Причём, внести изменения тоже не составит труда;
• Техническая поддержка. У Вас есть вопрос? Вам ответят на него максимально быстро и подробно. Огромный плюс;
• Бесплатный тестовый период. Сейчас практически у всех конструкторов лендинг пейдж 14 дней бесплатного тестового периода. Регистрируетесь и...

Небольшая жизненная правда. “ 14 дней халявы! За это время заработаю денег с помощью лендинга на конструкторе и закажу красивый сайт в агентстве”, - думали они.

Через 14 дней, еле сумев победить конструктор, сделав все неправильно и не получив ни одного заказа через сайт, они поняли, что одностраничники не работают.

Минусы :

• Знания. Вам нужно знать какие блоки нужно использовать, их последовательность и прочее.

  Решили подглядеть у конкурентов? Отлично! Только откуда Вы знаете, что у конкурентов эффективный лендинг и показывает хорошие показатели?

• Дизайн. Если Вы работаете с конструктором первый раз, то на дизайн landing page по окончании работ “без слез не взглянешь”.

  Даже если это далеко не первый вариант. Крутого дизайна, такого, чтоб “Вау!”, не ждите.

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

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

Лично мы можем посоветовать этот landing page конструктор . Обычно мы отправляем к ним клиентов, которые только начинают или тестируют нишу.

Фрилансеры

Давайте сразу по делу и из опыта. Найти фрилансера, который в одиночку создаст продающий лендинг с нуля и “под ключ” - НЕВОЗМОЖНО. Ну правда.

Возможно найти отдельных специалистов: дизайнера, который создаст дизайн будущего сайта, или программиста, который его сверстает, но монстра, который КАЧЕСТВЕННО сможет сделать сайт от и до, не существует.

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

Поэтому идеальная схема работы с фрилансером, это когда Вы самостоятельно всё анализируете, собираете, готовите.

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

Плюсы :

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

  Как минимум, потому что у них есть опыт и знания, которых у Вас в их сфере, давайте честно, почти нет.

Минусы :

• Ответственность. Если сайт не будет работать, то никто кроме Вас не виноват. Так как Вы являетесь тем, кто ими управляет и говорит как нужно.

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

• Время и нервы. Время, чтобы найти фрилансера, время на создание задач, время, чтобы сделать прототип лендинга, время на контроль. Потратите очень много времени и нервов.

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

  И это минимум, который можно ожидать, когда хотите сделать лендинг пейдж недорого.

• Деньги. Вам придётся раскошелиться, так как хороший специалист без “связей” стоит не мало.

  Дизайн среднего качества выйдет в районе 8-10 тысяч, вёрстка тоже в районе этой суммы. Опять же всё зависит от сложности проекта и самих исполнителей.

• Кидалы. Работа строится следующим образом: 50 на 50. Предоплата и потом оставшаяся оплата после завершения проекта.

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

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

А уже оставшуюся часть суммы переводите напрямую фрилансеру. В таком случае Вы переплатите 15%, но зато обезопасите себя.

Лайфхак. Если фрилансер собрался Вас кинуть, то от безопасной сделки он Вас будет отговаривать. Это будет Вам сигналом.

Этап 2 - кому и что?

Самый скучный (но самый нужный) блок в этой статье. Неважно каким путем Вы пойдете. Будете делать эффективный лендинг пейдж своими руками или отдадите в специализированное агентство. В любом случае Вам нужно знать 3 вещи:

1. Свою целевую аудиторию;
2. Лестницу Ханта;
3. Внутренности вашей компании.

Отличие лишь в том, что если Вы будете делать в одиночестве посадочную страницу, то придется все расписывать и продумывать самостоятельно.

Агентство же даст Вам заполнить подробный бриф, благодаря которому расписывание ЦА и прочее они делают сами. Мы, правда, идём другим путем и заполняем бриф самостоятельно, общаясь с Вами по скайпу.

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

Целевая аудитория

Про определение целевой аудитории, или ещё глубже определение клиента, мы уже писали.

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

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

Целевая аудитория

Лестница Ханта

Но что даст знание лестницы Ханта? Также как и аватар клиента, она даст саму структуру будущего лендинга.

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

https://youtu.be/IF5hR2MLfX0

Если очень коротко, то до момента принятия решения о покупке человек проходит 5 шагов/уровней осознанности:

1. Этап “Безразличие”. Проблемы не существует.
2. Этап “Осведомленность”. Проблема есть, но нет решения.
3. Этап “Сравнение”. Варианты решения проблемы сравниваются между собой.
4. Этап “Выбор”. Вариант решения выбран. Ищутся продукты.
5. Этап “Покупка”. Выбор между поставщиками продукта.

Как эта сложность может помочь Вам при создании лендинга? Давайте рассмотрим каждый этап и как нужно действовать:

1. Этап “Безразличие”. Вам нужно сначала создать проблему в голове человека. Показать, что если он этого не сделает/не купит, то все будет плохо.
2. Этап “Осведомленность”. Вам нужно в первых экранах показать, что существуют разные варианты решения его проблемы.
3. Этап “Сравнение”. Нужно донести, что Ваше решение лучше других, и для этого можно сделать сравнительную таблицу, предложение обзора продукта, результатов исследования, личную консультацию по подбору и т.д.
4. Этап “Выбор”. Вам нужно показать какое предложение подойдёт именно ему, точнее в каком в виде/комплектации. Для этого раскрываем больше выгод нашей продукции.
5. Этап “Покупка”. Вам нужно показать, в первую очередь, выгоду работы именно с Вашей компанией, а уже потом рассказывать о продукте и о том, что он самый лучший.

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

Упаковка

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

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

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

Чтобы вы уловили суть, вот Вам пример из 10 вопросов, которые помогут лучше/глубже осмыслить свою компанию и свой продукт, и подать это “под чудесным соусом”:

1. Сформулируйте 3-5 “причины, почему объективно выгоднее покупать у Вас, а не у конкурентов”.
2. Какие особенности производства есть именно в Вашей компании?
3. Проводите ли Вы внутреннее обучение персонала?
4. Сравните продукт с аналогами. Укажите преимущества и недостатки.
5. Кто является лицом или лицами компании?
6. Какие бонусы Вы готовы выдавать клиентам при покупке на большие суммы?;
7. Распишите детально этапы работы с клиентом от первого обращения до выполнения работ.
8. Расскажите про финансовые условия работы (предоплата, рассрочка, отсрочка первых выплат, продуктные кредиты, скидки, продукт на реализацию, выкуп неликвида и т.д.).
9. Какие о компании или от компании существуют публикации? (экспертные комментарии, интервью, жюри в телешоу, авторские колонки, статьи).
10. Ваши клиенты-звёзды.

ЭТАП 3 - Прототип

Наконец-то мы добрались до самого интересного. Сейчас будем создавать Ваш будущий сайт.

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

Шаг 1. Структура прототипа

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

Лучше всего сделать это следующим образом: берёте лист бумаги и накидываете последовательность блоков/смыслов. Выглядит это примерно так:

1. Шапка;
2. Выгоды компании;
3. Каталог;
4. Собственное производство;
5. Склад;
6. Команда;
7. и т.д.

Это мы с Вами прописываем блоки, но также должны не забывать про две классические структуры, по которым строится любой рекламный материал и landing page не исключение:

1. (товары/услуги);
2. PmPHSA (инфобизнес). Расшифровывается как Pain, more Pain, Hope, Solution, Action (боль, усиление боли, надежда, решение, призыв к действию).

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

PHP ,

Разработка веб-сайтов

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

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

Техническое задание

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

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

Дизайн

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

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

• От 1000 до 3000 - простовато, зачастую не очень профессионально, на мой вкус
• От 4000 до 8000 - вполне удобоваримое качество, но не всегда стабильное. Большие портфолио, и, думаю, большинство заказчиков останутся довольны результатом.
• От 9000 до 15000 - часто складывается впечатление слегка завышенной цены, но просматривая портфолио, все таки виден стабильный результат. Эта ценовая категория пользуется популярностью. В основном, лично мне не нравилась стилистика работ. А когда сомневаешься, в таких делах, риск не очень оправдан.
• Категория 20 и выше - часто зависит от эго дизайнера. Много талантливых художников работает в этой категории - такие сайты впечатляют, но для моей задачи это было лишним. Может быть дополнена проработанным прототипом, что создает впечатление подхода к работе “с головой” и хоть как-то оправдывает дороговизну.

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

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

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

Верстка

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

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

Было несколько предложений за 1500-2000 руб, потом несколько за 6000 руб и еще парочка 10000+ руб.

Одно из предложений привлекло меня больше всего правильными уточняющими вопросами (я просил заранее предусмотреть картинки в разрешении x2, чтобы четко отображались на retina-дисплеях), и я предложил начать работу. Мы договорились на 3000 рублей. Первые результаты верстальщик предоставил уже через пару дней и сказал, что в связи с годовщиной свадьбы родителей слегка задерживается.

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

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

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

Backend

Серверную часть я сделал сам за 1.5 дня. В принципе, я мог бы и эту часть заказать, но, боюсь, трудозатраты на ТЗ с описанием нюансов и моим видением желаемого результата, в купе с пожеланиями по качеству кода, были бы сопоставимы с ресурсами, которые заняла у меня собственная работа.

Я использовал Slim Framework , подключив к нему несколько библиотек:

• Illuminate Database (он же Eloquent - компонент Laravel) - для работы с базой
• PHP dotenv - для конфигурации в разных окружениях
• recaptcha - чтобы защититься от спама
• PHPMailer - для отправки писем

Код хранится в репозитории на

Елена Симененко, Минск

Здравствуйте!
Закончила еще один курс в тренинг-центре "1day1step".
Огромная Благодарность Наталье Гринько за её уроки! Совершенно понятные и подробные. Спасибо за её доброжелательные подсказки и ответы, за ответы в выходные дни не по курсу, за советы. У Натальи я научилась создавать мини-сайты и дизайну в соц.сетях. Сейчас использую навыки в создании рекламных объявлений.
Хочу сказать огромное Спасибо Наталье Одеговой: благодаря ей я и "дошла" до 1day1step. Слушая ее вебинары, появляется полное доверие и желание учиться.
Сегодня я продолжаю учиться уже на 3-ем тренинге. И уверена: это не последний для меня в "1day1step")))
Девушки пишут о непонимании со стороны родных...Я это прохожу даже сейчас, но!))) Это моя жизнь! Дочь выросла и выучилась. Мне 48 лет, бухгалтер со стажем и вдруг всё бросаю и ухожу...в Интернет))) = "в никуда" :D Главное - смелость!

И преподавателям, и выпускникам, и ученикам желаю Успехов! Классных заказчиков!

Наталья Манжос, Йошкар-Ола

Эх, нет предела совершенству!
Вот окончилось обучение на курсе "Landing Page с нуля" !!!
Это уже 5 курс, пройденный мной в тренинг-центре 1day1step. Все курсы дают начальную, но основательную, базу знаний и умений. Теперь я с уверенностью могу сказать, что смогу (если захочу) выполнить сама, пусть и на полупрофессиональном уровне, большую часть работ, необходимых для инфобизнеса.
Я имею общую картину, карту движения и все возможности для своего роста.
Очень благодарна всем тренерам за поддержку, доходчивую подачу материала и огромное желание принести непоправимую пользу студентам.
Особую благодарность испытываю к Наталье Гринько. Она с нескрываемым интересом и потребностью донести до нас основные принципы и возможности работы с программой для создания лендингов вела уроки и давала советы.
Нам даны основы, от которых мы с уверенностью оттолкнемся и двинемся к нашим вершинам! Ура! :)

Наталья Засорнова, Хмельницкий

Только что Наташа Гринько приняла мою последнюю "домашку". Испытываю двоякое чувство. Радостно от того, что научилась новому, окунулась в мир до сих пор мне неизвестный. Грустно, что курс пройден.
С Наташиной помощью училась с большущим удовольствием!!! Хочу выразить громадную благодарность Наташе Гринько!!! Настолько доброжелательный, отзывчивый ЧЕЛОВЕК, знающий и умеющий донести УЧИТЕЛЬ!!! Я так увлеклась процессом учебы и познавания, что сидела часто до 4-5 утра, не замечая времени.))) Курс прошла за 10 дней))
Теперь впереди самостоятельная работа, практика и наработка портфолио. А там и отзывы восхищенных заказчиков))). Очень на это надеюсь.
Желаю Наташе удачи, терпения и вдохновения!

Лендинг – специальная страница, которая нужна для того, чтобы подтолкнуть посетителя купить товар или услугу или оставить заявку. Для того, чтобы создать качественный лендинг не нужно быть маркетологом. Это под силу обычному человеку. Сегодня мы расскажем как это сделать.

Коротко: что такое лендинг и для чего он нужен

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

Синонимы: одностраничный сайт, одностраничник, лендинг пейдж, посадочная страница, landing page, целевая страница.

Посадочная страница используется для продвижения товара или услуги, она призвана «направить» посетителя на совершение определенного действия:

• обращение за бесплатной консультацией;
• заявка на покупку товара;
• бронирование мест;
• подписка на рассылку;

Делать самостоятельно или заказать работу «под ключ»?

Итак, мы разобрались с основами. Следующий вопрос, который обязательно возникнет у вас: стоит ли сделать лендинг самостоятельно или заказать у фрилансера или в студии веб/дизайна.

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

Реальность: сделать хороший, рабочий лендинг не сложнее чем создать страничку в социальной сети.

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

Как лучше поступить, если вы:

1. вы новичок в бизнесе;
2. хотите протестировать новую нишу;
3. у вас небольшой стартовый капитал.

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

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

Единственное, что вам действительно необходимо — это знание своего продукта: его достоинств, недостатков и целевой аудитории.

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

Помните, что если вы решили заказать лендинг «под ключ», вам нужно составить как можно более точное ТЗ и согласовать все детали с разработчиками.

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

LPMotor — самый лучший конструктор одностраничников

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

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

Для каждого шаблона можно дополнительно подключить мобильную версию, которую можно редактировать отдельно.

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

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

При оплате за год вы получите скидку 40%.

Оплатить услуги и тарифы платформы можно с помощью банковской карты, через Сбербанк Онлайн, Альфа-клик, посредством перевода через Связной, Евросеть, МТС, Теле2 и Билайн. Поддерживаются электронные кошельки: Яндекс.Деньги, QIWI, Webmoney.

Достоинства

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

Недостатки

• Отсутствие бесплатного тарифа

Bloxy — стильный и современный

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

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

Пользователю предлагается три тарифных плана:

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

Сервис позволяет интегрировать ваш одностраничник с популярными сервисами: amoCRM, Битрикс 24, Робокасса, Яндекс Касса, Google Analytics, Яндекс Метрика, Mail Chimp и др.

Достоинства

• Понятный интерфейс
• Интеграции со всеми необходимыми ресурсами для ведение бизнеса в интернете
• Удобный конструктор для создания собственного одностраничника

Недостатки

• Нет готовых шаблонов
• Стоит дороже конкурентов

LPgenerator — самый функциональный конструктор

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

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

На сайте собраны необходимые инструменты для создания и управления лендингом: управление каналами трафика, подробная аналитика и статистика, удобное сплит-тестирование, построение воронки продаж, собственная CRM и LP Телефония и т.д.

Кроме того, вы можете интегрировать lpgenerator с различными онлайн-сервисами: Robokassa, Битрикс 24, AmoCRM, Мегаплан, Dropbox, SmartResponder и др.

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

Бесплатный тариф отсутствует, оценить все преимущества и недостатки сервиса можно с помощью семидневного бесплатного пробного периода. Далее подключается один из платных тарифов (цены в месяц): «Базовый» (799 рублей), «Продвинутый» (2375 рублей), «Безлимитный» (3999 рублей), «Корпоративный» (15730 рублей).

При оплате за год, вы получаете 30% скидку:

Оплатить тарифы можно следующими способами: безналичный расчет, Web Money, карты Visa, Maestro и MasterCard, Сбербанк Онлайн, «Мир», «Альфа-Банк», «Яндекс.Деньги», Qiwi Wallet, Tele2, Beeline, «Мегафон», МТС, «Евросеть».

Достоинства

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

Недостатки

• Высокие расценки на услуги
• Нет бесплатного тарифа (бесплатный пробный период в течение 7 дней)
• Начинающему пользователю интерфейс может показаться сложным

Ucraft — бесплатный конструктор посадочных страниц

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

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

К готовому лендингу можно подключить следующие сервисы: Google Analytics, Mail Chimp, Google Maps, Twitter, Instagram, You Tube, Disqus.

Отличается от конкурентов тем, что здесь есть полноценный бесплатный тариф:

Платные тарифы можно оплатить с помощью Visa, Mastercard, Pay Pal.

Достоинства

• Удобный редактор для создания собственного одностраничного сайта
• Бесплатный тариф с хостингом и доменом 3-го уровня
• Есть инструменты для совместной работы над проектом
• Возможность интегрировать одностраничник с популярными сервисами

Недостатки

• Мало готовых шаблонов

Примерная структура одностраничного сайта

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

1. Заголовок

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

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

2. Логотип, название фирмы и контактная информация

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

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

3. Данные о предоставляемом продукте или услуге

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

1. Реальные фотографии продукта;
2. Видеозапись (данному контенту потенциальные потребители доверяют больше всего).

4. Преимущества бренда

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

5. Описание услуг

В данном блоке до пользователя доносится реальная ценность сотрудничества в виде перечня услуг.

6. Обратная связь с клиентами

Форма для обратной связи с помощью которой клиент сможет связаться с вами и оставить заявку.

Пример создания лендинга своими руками помощью сервиса LPmotor

Давайте попробуем для примера создать простую целевую страницу в конструкторе LPmotor.

Первое, что нам нужно сделать это зарегистрироваться в LPmotor .

В личном кабинете кликаем на зеленую кнопку «Создать сайт».

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

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

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

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

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

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

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

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

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

Отсюда вы сможете управлять всеми функциями лендинг пейдж.

Самое первое, что нужно сделать, это изменить домен.

Вы можете выбрать любой домен третьего уровня (sitename.lpmotortest.com) или купить домен второго уровня (sitename.com). Если у вас уже есть доменное имя, зарегистрированное у стороннего регистратора, вы можете подключить этот домен к вашему сайту.

Следующий шаг — подключение счетчиков посещаемости Яндекс Метрика или Google Analytics.

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

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

В разделе «Аналитика» вы можете посмотреть посещаемость сайта по разным каналам трафика и воронку конверсии.

В разделе «Расширения» вы сможете подключить к сайту необходимы дополнительные сервисы и виджеты: корзину товаров, геотаргетинг, CRM, Яндекс касса и т.д.

Самый последний шаг — публикация сайта.

Для этого нужно перейти на вкладку «Рабочий стол» и нажать кнопку «Опубликовать». С этого момента ваш сайт будет доступен пользователям по всему миру.

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

Заключение

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

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

«Сверстать одностраничный сайт». Пишете почту для получения заявок. «Особенности макета». Как вы помните, у нас ширина сайта 1000 пикселей, мы еще в дизайне это указывали и здесь мы повторяемся. «Кодировка сайта». Сильно не мучайтесь отчего и почему, просто нужно сделать так. Тогда на всех браузерах, или устройствах будет все нормально открываться, не будет никакой белиберды с текстом. «Шрифт» — Cuprum Regular. У меня, как раз есть Cuprum Regular, я его прикреплю вместе с ТЗ. Если у вас какой-то другой шрифт, значит, указывайте, какие шрифты нужно использовать. «Без CMS, только CSS + HTML + JS». Почему именно так? Я люблю CMS системы, это системы управления сайтами. Многие клиенты хотят видят CMS на своих сайтах, но я придерживаюсь позиции, что сайт и лендинг – это немного разные вещи и лендинг лучше делать без CMS. Почему? Потому, что там не нужно наполнять страницы, многие страницы информацией. Здесь необходимо только исправить несколько блоков, моментов и так далее, т.е. делается это все очень быстро и легко, без CMS. Это первое. Во-вторых, CMS системы обычно используются бесплатные. Бесплатные CMS системы – это одна из самых больших дырок в защите вашего сайта, т.е. сайт у вас может просто исчезнуть из-за вируса, из-за вредоносных каких-либо программ и так далее, если вы правильно не будете ухаживать за CMS. Я предполагаю, что вы бизнесмены, а не программисты, поэтому ухаживать за CMS и следить за хостингом вы особо не будете.

ТЗ верстки - ищем верстальщика — Особенности макета

«Границы должны продолжать фон». Что это значит? Это значит, что по бокам тоже должен быть фон. Не просто он должен заканчиваться на 1000 пикселей, а должен продолжаться. «При меньшем размере экрана, меньше 1000 пикселей, верстка не должна ехать». Очень частая болезнь верстальщиков, что верстка начинает ехать, поэтому мы и будем все проверять. После того, как нам сверстают. «Текст должен быть текстом», т.е. там, где у нас идет текст, должен быть текст. Смешно, но факт. Большинство верстальщиков настолько безалаберны, что просто копируют картинки вместе с текстом. Это неправильно, нам нужен текст. «Кнопки должны реагировать на наведение». Тут понятно. То, что у нас идут при наведении, кнопка должна просто менять цвет и так далее. «В слоях макета при наведении включено, по умолчанию — выключено». Все это в дизайне, в psd так и есть, т.е. при наведении, кнопка меняется. Это можно все посмотреть и верстальщик тоже это знает. «На кнопках должен быть текст, как на макете (сверстанно программно, не рисунок», т.е. кнопки должны быть сверстаны программно.

ТЗ верстки - ищем верстальщика — Сверстать одностраничный сайт, задание

Большинство верстальщиков пытаются таким образом обмануть людей и делают кнопки-рисунки, т.е. вы не можете поменять на них текст, вы не можете их как-либо изменить, очень много проблем появляется. Вам нужно сделать так, чтобы это были программные кнопки, плюс они меньше по времени грузятся и так далее. «Кнопки «заказать обратный звонок» должны открывать: попал в форму с полем «введите свой телефон» и кнопкой «заказать обратный звонок». Здесь все понятно. Здесь я брал из старого ТЗ вариант, не исправил его. «Форма потолок, крышка капота, двери, полуарки и багажник должны реагировать на наведение: одновременно при наведении картинка должна чуть темнеть и текст под картинкой должен быть выделен другим цветом». Либо просто меняться, увидите потом. И «при нажатии на формы должны открываться попап формы «закажите консультацию» с полем «введите ваш телефон» и «кнопкой заказать консультацию». Ну, здесь все логично. «Со всех форм должны при ходить заявки на почту», которую мы сверху указывали. Вот здесь важный момент. «Также в заявке должны быть: источник: utm source, ключевая фраза: utm term». Например, direct и колодезные кольца зжби купить. Сейчас покажу, как это должно выглядеть. Вот, например, заявка с формы, какая форма. С формы заказать консультацию, телефон e-mail, вопрос, лендинг пейдж. Тут написано транскрибация, русский вариант лендинга, источник и ключевая фраза.

ТЗ верстки - ищем верстальщика — Пример заявки с формы

Зачем это нужно? Потому что потом, рано, или поздно вы захотите проверить, а с какого источника, например, с Директа, или AdWords идет больше заявок, а вы это сделать не сможете. Либо сможете, но это будете делать через Метрику, например. А здесь можно просто, проанализировав всю почту, сделав поиск по письмам, например, по источникам Директа, либо по источникам AdWords понять, откуда приходило больше заявок. Здесь все очень просто и легко. Тоже самое с ключевыми фразами. Если нужно, вы можете по определенным ключевым фразам собрать хоть какую-то статистику. Далее вы уже сможете подключить свою CRM систему, например, к AMO CRM. Сможете подключить заявки и у вас будет полная статистика, откуда идут люди, с Директа, с AdWords, с каких ключевых фраз и тому подобное. «Если эта заявка на потолок, крышка капота, пол арки, багажник, то с соответствующими пометками».

ТЗ верстки - ищем верстальщика — Развернутое задание для верстальщика

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

ТЗ верстки - ищем верстальщика — Таблица пожеланий должна быть сверстана

Остальное, в принципе, не существенно. Этого вполне достаточно, чтобы программист понял, что нужно сделать.

И теперь нам необходимо найти верстальщика. Искать можно на всех тех же сайтах — freelance.ru, Work-zilla.com и тому подобное. Я покажу шаблон, как нужно сделать, чтобы получить действительно хорошую верстку. Во-первых, не называйте никогда «сверстать лендинг, лендинг пейд.» и тому подобное, потому что, как только вы пишете слово лендинг пейдж, все дорожает в несколько раз. Вы хотите сверстать одностраничный сайт. И вы никого не обманываете, потому что это одна страница. Стоимость. Максимум 3000 рублей. Знаю прецеденты, что за 1250 рублей делают очень хорошую верстку. Срок выполнения – 2 дня, этого вполне достаточно. Варианты оплаты – без предоплаты, потому что у вас не будет конечного результата, пока вы не оплатите, в любом случае. Вы сначала будете смотреть на работу верстальщика у него на хостинге и только после оплаты он вам отдает все файлы. Способ оплаты – тут выбирайте сами, в моем случае электронные деньги. Специализация. Тут понятно, что веб-программирование и описание проекта. Необходимо сверстать одностраничный сайт по psd. Psd у вас есть. Без CMS, только CSS + HTML + JS. Картинка прилагается. Картинка имеется в виду psd в виде jepg. ТЗ будет отослано кандидату. Ничего придумывать не надо, сверстать, как на макете. Прислать две ссылки на сайт и с примерами вашей верстки. Здесь я приписал еще три ссылки работающих сайта с вашей верстки. Три, две в любом случае. И дальше анализируйте кандидатов, выбирайте только тех, кто прислал хотя бы несколько ссылок, смотрите, как все работает и выбираете по своему вкусу.

ТЗ верстки - ищем верстальщика — Заявка на верстальщика на фрилансе