Как сделать Landing Page (лендинг) самостоятельно с нуля: пошаговая инструкция для новичков

14 ноября 2018 в 07:33
Комментариев: 2

Привет!

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

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

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

Кратко о том, что такое лендинг

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

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

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

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

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

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

Выбор платформы

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

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

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

WordPress

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

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

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

  • Elementor – бесплатный плагин-конструктор, который может помочь в создании лендинга. С помощью системы Drag&Drop вы можете воссоздать практически любую страницу. Большое количество элементов и функций, хорошая оптимизация, контроль размеров и адаптивность – все это есть в Элементоре.

Кстати говоря, у плагина более миллиона активных установок. Это ли не говорит о его качестве?

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

  • Visual Composer – еще один популярный конструктор для ВордПресс, который позволит вам легко и просто создать одностраничный сайт. По функционалу и интерфейсу он чуть сложнее, чем Элементор, однако это никак не помешает вам создать крутой лендинг, особенно если вы с ним разберетесь.

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

  • WPBakery Page Builder – по своей сути это брат-близнец предыдущего плагина. Когда-то давно команды обоих этих продуктов работали вместе. Потом произошел разрыв и появилось два разных, но так похожих друг на друга продукта. В отличие от Композера WPB Page Builder не обладает бесплатной версией.

Распространяется он сугубо через магазин Envato, и стоит также 59 долларов.

Лучше ли он, чем Visual Composer? Не знаю, я пользовался обоими продуктами и особой разницы не увидел. Правда, стоит отметить, что в WPB больше различных виджетов. Они могут хорошо помочь при разработке лендинга. Однако в бесплатной версии Композера также много инструментов. В общем-то, тут дело вкуса.

Но, выбирая между WPB Page Builder и Visual Composer, я бы выбрал первый, потому что, на мой взгляд, он более надежный и функциональный. Да, тут нет бесплатной версии, но зато есть премиум-поддержка, постоянные и регулярные обновления и уверенность в том, что плагин будет актуален еще долгое время.

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

Также вам будет легко обновлять информацию, ведь WordPress – это CMS (система управления контентом). Контакты, текст или картинки – все это можно поменять в считанные минуты.

Wix

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

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

Онлайн-конструктор Wix

Однако здесь есть один момент: бесплатный Викс – бесполезный Викс. Да, вы действительно сможете создать сайт, он будет красивым. Но здесь присутствуют существенные ограничения, например, вы не сможете привязать свой домен. Только поддомены от самого Wix, что не очень красиво.

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

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

Tilda

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

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

На официальном сайте можно найти всю подробную информацию по этой платформе.

Другие платформы

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

Создание лендинга

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

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

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

Блок 1: заголовок и информация

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

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

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

Блок 2: преимущества и раскрытие темы

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

Цель этого блока – рассказать клиенту о том, что он должен купить, сколько это стоит и почему он должен работать именно с вами.

Блок 3: отзывы, партнеры

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

Блок 4: форма заявки, призыв к действию

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

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

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

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

Заключение

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

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

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

А если вы хотите создавать не только лендинги, но и информационные проекты для заработка, то я рекомендую вам посетить курс Василия Блинова “Как создать блог”. На нем вы узнаете как можно сделать крутой сайт и зарабатывать на нем от 20 000 рублей в месяц пассивно.

1 звезда2 звезды3 звезды4 звезды5 звезд (5 голосов, средний: 5,00 из 5)
Загрузка...
Рубрика: Для новичка
Просмотров: 372
подпишись и начни получать лучшие статьи первым
Подписалось уже 6999 человек
Комментариев к статье: 2
  • Ирина
    27.10.2018 в 18:05

    Замечательная статья. Как раз изучаю эту тему и многое нашла у вас.

  • Роман
    12.11.2018 в 12:44

    Я фанат Тильды, предлагаю дополнить ее обзор.

Оставить комментарий
:p :-p 8) 8-) :lol: =( :( :-( :8 ;) ;-) :(( :o: :smile1: :smile2: :smile3: :smile4: :smile5: :smile6: :smile7: