Как сделать качественный лендинг. Рейтинг: «Лучший конструктор лендингов. Где используются Landing Page

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

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

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

Синонимы: одностраничный сайт, одностраничник, лендинг пейдж, посадочная страница, 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 настройки, как настроить анти-спам фильтр и т.д. На этот случай предусмотрены обучающие видео. Посмотреть их вы можете по ссылке «Обучение» в верхнем правом углу экрана. Если возникнут какие-нибудь вопросы, смело пишите в службу поддержки. Кроме того, можете также написать в комментариях к этой статье. Обязательно отвечу всем.

Заключение

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

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

Недостатки landing page

  1. Продажа одного товара. Тут всё просто, один товар - один лендинг.
  2. Нет SEO оптимизации. Конечно, некоторые личности умудряются заточить свою страницу под какой-нибудь запрос и далеко продвинуть его, но много ли вы ключей сможете продвинуть с одной страницы? Ответ очевиден.

Преимущество landing page

  1. Конверсия. Наибольшая конверсия наблюдается у landing page. Что позволяет ему с лучшим успехом.
  2. Быстрое исполнение. Для того, что бы сделать от 1 до 3-5 страниц необходимо не так много времени, как например для создания того же интернет-магазина.
  3. Цена. Один из основных факторов почему выбирают именно его. По цене он всё же уступает корпоративным сайтам и интернет-магазинам.

Но, конечно же, у каждой конторе правило свои. Некоторые предлагают разработку лендинга от 100 000 и более рублей! По мне - перебор. Не отрицаю, что будет всё сделано на высшем уровне, но у многих просто нет такого бюджета на него.

Думаю именно этот фактор привел вас на этот блог и на эту статью. Сейчас мы рассмотрим, как сделать лендинг самому , да ещё и бесплатно! Чтобы сделать landing page самому необходимо для начала:

  • Понять, для чего он нам нужен
  • Придумать структуру лендинга
  • Скачать Notepad++
  • Скачать Artisteer 4
  • Запастись временем
  • Приготовить чай

Для чего он нам нужен?

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

Придумать структуру лендинга

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


Скачать NotePad++

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

Скачать Artisteer 4

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

Запастись временем

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

Приготовить чай

Или кофе/какао. Что любите больше. Я выбираю чай

Инструкция по созданию лендинга самому

  1. Качаем картинки к будущему сайту, чем качественнее она будет, тем лучше. Плохие картинки лучше не берите.
  2. Пишем контент к сайту. Весь текст, что будет у вас на сайте в виде доступной информации для посетителей.
  3. Открываем Artisteer 4 и начинаем редактировать пустую страницу, или уже имеющийся шаблон. Вставляете свой текст и нужные картинки.
  4. Отредактировав все необходимые страницы, вы экспортируете свою работу в виде HTML файла (назовите главную страницу "index.html " Без скобочек, это обязательно! ).
  5. Далее открываете страницы с помощью NotePad++, нажимаете Ctrl + F и вводите фразу "Artisteer". Удаляете все упоминания о программе (разработано с помощью, ссылки на сайт программы и прочее).
  6. Сохраняете всё это добро, нажав на кнопку сверху "Сохранить".
  7. Вуаля! Вы сделали лендинг самостоятельно! Теперь осталось поставить ваш новоиспеченный .

Теперь вы владелец собственного лендинга! Согласитесь, ведь это было не так уж и сложно? Как заработать на собственном лендинге, который вы сделали самостоятельно, я расскажу в следующей статье!

Не каждый посетитель, попавший на ваш сайт, совершает целевое действие, потому что ему не хватило аргументов, стимулов или не привлек сайт. Толчком для нужных действий пользователя может стать правильный лендинг. Расскажем, какой лендинг будет работать на вас, а также дадим готовый to-do list для создания удачного лендинга.

Чем лендинг отличается от сайта?

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

Хорошим показателем конверсии для сайта считается 2-3 % от всех посетителей. Для лендинга эта цифра - 14-15 %. Такого результата помогают добиться кнопки с призывом к действию.

Принципы успешного лендинга

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

Принцип первого экрана или Above The Fold . Газеты продают сложенными вдвое, поэтому титульная страница делится на видимую и невидимую часть. Если заголовок или фотография на видимой части привлекают внимание, хочется купить газету и дочитать до конца.

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

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

Учет тепловой карты страницы . Важные смысловые блоки расставляют на виду так, чтобы пользователь находил нужные элементы на привычном месте. Есть несколько моделей поведения на сайте, актуальные из которых: Z-Pattern и Guttenberg Pattern

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

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

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

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

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

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

Как создать лендинг?

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

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

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

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

To-do list для заказчика по созданию лендинга

Создание лендинга делится на следующие этапы:

  • продумывание структуры лендинга — создание примерного плана, который станет основой ТЗ для дизайнера и копирайтера;
    • Закажите сбор и анализ конкурентов. Сравните себя с конкурентами и международными лидерами в вашей нише. Выпишите ваши конкурентные преимущества, а также “фишки”, которые можно позаимствовать у конкурентов.
    • Ответьте для себя на вопрос, что должен совершить пользователь после прочтения посещения лендинга? Это будет целью лендинга. Эту цель обязательно нужно обозначить перед исполнителями
  • написание контента - текст, который будет «продавать» продукт. Основная рабочая схема написания текста “Боль клиента — Усиление боли — Идиллия — Решение — Предложение сделки”;
  • дизайн - создание полного макета. Подробнее про дизайн мы написали чуть ниже;
  • верстка - оформление сайта в соответствие с его функционалом и макетом дизайнера;
  • программирование - реализация необходимого функционала сайта;
  • настройка рекламы - запуск контекстной рекламы для генерации трафика на ваш лендинг.

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

При работе с дизайнером и верстальщиком нужно учесть следующие моменты:

  1. Макет и прототип страницы - согласуйте основные блоки, структуру и путь читателя от элемента к элементу.
  2. Логотип - если у компании еще нет логотипа, самое время добавить его на лендинге, чтобы сделать бренд узнаваемым.
  3. Шапка для сайта - с информацией о продукте, логотипом и навигацией.
  4. Иллюстрации - хороший дизайнер не будет наполнять страницу фотографиями с фотостока. Он отрисует иллюстрации самостоятельно или запросит у вас качественные изображения технологического процесса или продукта.
  5. Кнопки с призывом к действию - дизайнер поможет определиться, какие CTA-элементы нужны на странице и где их расставить.
  6. Форма обратной связи - это может быть номер телефона, кнопка «Перезвоните мне» или значок онлайн-чата в углу страницы.
  7. Иконки - помогают читателю разделить блоки и визуально выделить важное.

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

№1. Создание лендинг пейдж при помощи бесплатных конструкторов

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

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

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

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

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

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

№2. Создание лендинг пейдж с помощью готовых HTML шаблонов

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

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

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

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

№3. Создание landing page на CMS WordPress

Третьим, завершающим способом сделать лендинг бесплатно – это использование CMS WordPress. Почему именно Вордпресс, спросите вы?! На самом деле, это не обязательно должен быть именно этот движок, можно использовать и совершенно иной, например — Joomla, OpenCart т.д. Если грубо, то суть в том, что вы на CMS прикручиваете шаблон лендинга, который всего лишь отличается представлением (дизайном / структурой) от классического шаблона. Движок WordPress используется достаточно часто при создании лендинга, поэтому пример приведу именно на нем. К тому же, я сам использую периодически этот вариант.

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

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

Для того, чтобы получить некое подобие конструктора лендингов, потребуется плагин «Page Builder от SiteOrigin », который даст возможность делать макет страницы лендинга и других страниц.

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

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

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

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

Также этот способ позволяет делать интеграцию с рядом сервисов, например, с CRM-системами, сервисами для email-рассылок и пр. Правда, это может быть не всегда бесплатно (разработчики плагинов могут включать этот функционал только в платные версии плагинов).

Резюме

Подводя итог всего выше описанного, можно сказать, что в самостоятельном создании лендинг пейджа нет ничего сложного. Особенно, если у вас есть хотя бы небольшие познания в HTML и CSS. В зависимости от того, насколько сложный и функциональный лендинг вам нужен, можно выбрать тот или иной способ его создания. Однако, стоит понимать, что ограничения в функционале все же есть – реализовать нестандартный функционал или дизайн без специалистов может не получиться… Благо он нужен далеко не всегда и в большинстве случаев сделать собственный лендинг бесплатно и достаточно быстро вполне по силам каждому.

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

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

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

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

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

Сразу же делаете красивую и легкую на взгляд ссылку. Для этого нажимаете изменить, стираете что там появилось и пишите свою. При этом у вас будет постоянными ВАШ-ДОМЕН/wppage/ , а дальше вы можете написать свое слово.

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

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

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

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

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

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

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

Нажимаем на следующую иконку со знаком доллара и тут мы получаем многочисленные кнопки «купить», «заказать», «получить доступ».

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

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

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

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

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

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

Тут вы либо выбираете цвет фона, либо устанавливаете свой фон, поставив ссылку на него в поле справа.

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

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

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

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