Как сделать лендинг пейдж

Содержание

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

Чем полезен одностраничный сайт

В интернет-маркетинг лендинги внедряли с целью быстрого роста продаж из-за следующих преимуществ:

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

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

— Просто тестировать. Простейшие конструкторы содержат инструменты сбора статистики. Данные собираются с текста, изображений, кнопок.

Как сделать эффективный лендинг пейдж за 10 минут. Конструктор landing page своими руками

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

Классификация Landing Page

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

По целевому действию могут выделить следующие категории:

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

Услуги. Аналогична товарной, но отличается продажей услуг.

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

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

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

Классификация по длине:
1. Одношаговые – одна страница, самый популярный.
2. Двухшаговые – содержит дополнительную страницу.
3. Короткие – без прокрутки вниз.
4. Длинные – с прокруткой на несколько страниц.

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

Одноэкранный и многоэкранный.
Сториз: минисайт в формате историй.

Разработка лендинг пейдж

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

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

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

Важно! Лендинг создаётся исключительно под одно действие.

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

Аргументация. Текст должен объяснить клиенту, почему нужно осуществить конкрентное действие. Укажите блок с преимуществами, выгоду предложения. Представьте свои достоинства в ярком свете.

Призыв к целевому действию. Landing page создан для выполнения целевого действия. Поэтому размещайте что-то, что подтолкнёт к нему: мотивирующий призыв купить/позвонить.

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

Добавляйте акценты. Иными словами, не забудьте о якорях в дизайне, заголовках, призыве. Яркие детали незаменимы в тех местах, куда вы хотите направить внимание пользователя. Пример — стрелка на кнопку «Купить», выделенные контакты.

Источник: hipolink.net

Как создать Landing Page на основе шаблона

В данной статье я расскажу вам, как можно бесплатно создать Landing Page на основе уже готового шаблона.

В прошлой статье я описывала основные способы создания Landing Page, и требования к структуре данной странице. Если Вам интересна эта тема – вот ссылка

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

Я подготовила для вас набор шаблонов, который вы можете скачать, перейдя по этой ссылке:

lp-download

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

  • Как внести изменения в шаблон?
  • Как заменить изображения?
  • Настройка отправки сообщений
  • Выгружаем лендинг на хостинг
  • Видеоинструкция

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

шаблон Landing Page скачать

Landing Page шаблон скачать

лендинг скачать

скачать шаблон бесплатно

лендинг бесплатно

Итак, после того как вы скачали и разархивировали данный архив у вас будет внутри этого архива две папки.

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

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

Для просмотра определённой лендинг пейдж нужно открыть файл index.html.

индексный файл

Как внести изменения в шаблон?

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

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

код html-страницы

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

Перетаскиваем в неё файл index.html и переходим к редактированию.

редактирование лендинга

При редактировании страницы через Notepad++ здесь сразу расставляются переносы строк и есть подсветка кода. То есть, все тексты, которые вы можете править у вас выделены черным цветом.

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

редактирование заголовка страницы

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

  1. 1. В браузере копируем фрагмент текста, который нужно изменить
  2. 2. Переходим в Notepad++ и нажимаем сочетание клавиш CTRL+F
  3. 3. Вставляем скопированный текст в строку поиска и нажимаем кнопку «Искать далее».

поиск в коде страницы

После того как вы нашли нужный фрагмент текста – меняете его на свой.

Обращайте внимание на теги абзацев. Вот этот тег < p>– это тег абзаца. Если вы хотите, что бы ваш текст был разбит на абзацы, то желательно, что бы вы свои абзацы тоже вставляли внутрь таких тегов.

< p >Это абзац на моей лендинг пейдж = ) < / p >

После внесения всех правок страницу нужно обязательно сохранить.

Как видите, править такую страницу можно, но это не очень удобно.

Как заменить изображения?

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

Но можно сделать проще. Например, вам не нравится определённая картинка.

  1. 1. Открываете папку images, находите здесь эту картинку.
  2. 2. Перетаскиваете ее в фотошоп или любой другой редактор изображений.
  3. 3. Здесь меняете ее на что угодно. То есть, вам главное что бы сохранилось название и размер. Например, вставляете другую иконку или меняете цвет.
  4. 4. Затем, просто сохраняете картинку.

Либо же, просто отдельно создаете картинку с таким же названием, с таким же размером, а потом копируете ее в эту папку, и когда спросят «Заменить это изображение?» вы выбираете «Да, заменить!». Таким образом, вы заменяете картинки, которые вам не подходят.

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

Настройка отправки сообщений

Возвращаемся в папку с лендингом и находим здесь файл sendmail.php, либо в некоторых лендингах он может называться index.php или mailer.php. В общем, файл, который находится в корне вашего лендинга, и имеет расширение php. Вам необходимо будет этот файл, так же открыть либо в каком-то текстовом редакторе, либо в Notepad++ или его аналоге.

редактирование изображений

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

адрес изображения

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

Выгружаем лендинг на хостинг

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

хостинг Fozzy

Для загрузки файлов делаем следующие шаги:

  1. 1. Настраиваем FTP подключение и подключаемся к сайту
  2. 2. В левой части окна открываем папку с лендинг пейдж, которую вы только что редактировали
  3. 3. В правой часть окна FTP клиента открываем папку с доменом
  4. 4. Выделяем все файлы в левой части окна и перетаскиваем в правую

выгрузка файлов на хостинг

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

замена существующего файла

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

Видеоинструкция

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

Так что пока он спит пойдём украшательствами заниматься 🙂

Хорошего вам дня!

С уважением Юлия Гусарь

Источник: impuls-web.ru

Лендинг пейдж: что это, как работает, какой должна быть посадочная страница на сайте?

Лендинг пейдж: что это, как работает, какой должна быть посадочная страница на сайте?

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

  1. Лендинг – что это такое?
  2. Как работает лендинг?
  3. Общие требования к посадочной странице, структура лендинга
  4. Каким должен быть лендинг?
  5. Как составить УТП? Идеи УТП для лендинга
  6. Ошибки лендингов. Чего не должно быть на посадочной странице?
  7. Как провести анализ лендинга?

1. Лендинг – что это такое?

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

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

2. Как работает лендинг пейдж? Цели и задачи посадочной страницы

Цель лендинга – вывести посетителя на нужное действие (звонок, оформление заказа, подписка, регистрация в сервисе и т.д.) Соответственно, задачи лендинга – привлечь и удержать внимание посетителя, вызвать интерес, сформировать желание воспользоваться продуктом, стимулировать нужное действие.

3. Общие требования к посадочной странице и структура лендинга

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

Структура посадочной страницы: что должно быть в лендинге?

Принцип построения лендинга – классическая рекламная формула AIDA (Attention, Interest, Desire, Action) – Внимание, Интерес, Желание, Действие.

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

Рассмотрим основные блоки, которые можно использовать в структуре лендинга:

Привлекает внимание, вызывает интерес

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

Объясняет, почему клиенту нужен это продукт / услуга

Обобщает выгоды клиента от покупки/заказа

Наглядное представление товара или услуги удерживает внимание и интерес, усиливает желание купить/сделать заказ

Снимают возражения («если другим людям понравилось, подойдет и мне»)

Снимает возражения («если что-то не понравится/сломается, можно вернуть назад деньги/бесплатно починить»)

Кнопка «купить», блок с номерами телефонов, форма подписки

Стимулирует целевое действие

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

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

4. Каким должен быть лендинг?

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

Должен отражать УТП (Уникальное торговое предложение) или сильное преимущество продукта. Его еще называют оффером (оффер – англ. предложение). Оптимальная длина заголовка – до 8-10 слов.

Примеры продающих заголовков для лендинга:

Тексты для сайта с конверсией 14%!

Создание интернет-магазина от 79 000 рублей плюс лендинг в подарок!

Дизайн логотипа и визиток за один день!

Мастер-класс по контекстной рекламе от специалистов Яндекса. Осталось 3 места!

2. Фотографии

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

3. Описание товара/услуги, список преимуществ

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

4. Подзаголовки

Важно, чтобы текст был разбит на логические блоки, и эти блоки были озаглавлены. «Стену» текста читать не будут.

5. Видео

Оптимальная длина ролика – до 3 минут. Важно, чтобы видео было высокого качества.

6. Отзывы

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

Визуально выделите важные моменты в тексте. Сделайте у каждого отзыва заголовок.

7. Кейсы

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

8. Гарантия

Хорошо, если гарантия будет не просто прописана текстом, а представлена в виде сертификата.

9. Кнопка «купить»

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

10. Блок с номерами телефонов

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

11. Форма подписки

Здесь важно оставить минимум полей, указать частоту и тематику рассылок.

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

Средняя конверсия лендинга – это от 2 до 10% в зависимости от отрасли (и целевого действия, которое считается за конверсию). Качество посадочной страницы сильно влияет на конверсию, поэтому важно тщательно прорабатывать лендинг, отслеживать, как конвертируется трафик, проводить эксперименты и совершенствовать страницу. Ведь главное, зачем нужен лендинг – это получение конверсий (звонков, заявок, заказов, контактов от клиентов).

5. Как составить УТП? Примеры УТП для лендинга

Есть типовые варианты, которые хорошо работают в разных тематиках.

  • Низкая цена. «Сайт-визитка под ключ от 6800 рублей!»
  • Большая скидка (от 15% и больше). «Скидка 20% при заказе от 20 000 знаков текста!»
  • Ограничение по времени или количеству. «Онлайн-конференция по Google AdWords – прием заявок до 25 мая!»
  • Большой ассортимент, работа с большими объемами. «Настроим контекстную рекламу по 1000 ключей!»
  • Гарантия, постобслуживание. «При заказе сайта – 2 месяца техподдержки бесплатно».
  • Сроки доставки, изготовления. «Уникальная открытка ручной работы за 1 день!».
  • Подарки. «При заказе фирменного стиля логотип бесплатно».

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

6. Ошибки лендингов. Чего не должно быть на посадочной странице?

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

  • Акцент на более чем одном товаре или услуге. Не нужно рассеивать внимание посетителей, предлагая им много всего на одной странице. Можно предложить разные варианты одного товара, опции. Но не предлагать разные продукты.
  • Слишком большой выбор вариантов. Если вы предлагаете разные тарифные планы, комплектации, число вариантов должно быть не более 3-5. При этом посетитель должен быстро понять, какой вариант оптимален. Обычно самый дешевый вариант делают максимально урезанным, а самый дорогой – содержащим большое количество разных опций, не все из которых нужны. Таким образом, средний вариант оказывается оптимальным. Часто используется визуальное оформление оптимального варианта: знак «лучший выбор», «выбор покупателей».
  • Назойливая реклама и мешающие элементы – преследующие пользователя баннеры, кнопки обратных звонков, всплывающие окна, онлайн-консультанты и так далее. Не нужно слишком давить на посетителя. Если его заинтересует продукт, он обязательно позвонит или напишет.
  • Отсутствие ясного призыва к действию. Бывает так, что лендинг отличный, но не указано, что посетителю делать после его прочтения: позвонить, написать, оставить телефон? Необходим простой и понятный призыв к действию.
  • Большое число полей в форме для заказа/обратной связи. Идеально запросить у пользователя только имя и e-mail. Чем больше полей, тем менее охотно люди заполняют форму. Убедитесь, что на лендинге четко указано, что произойдет после того, как пользователь оставит свои данные. Ему перезвонят? Если да, то сколько ждать звонка? Пришлют на e-mail расчет стоимости? Посетитель должен четко понимать, зачем он оставляет свои данные и что будет дальше.
  • Большая скидка без объяснений. Если на товар/услугу предоставляется большая скидка или предложение ограничено, должно быть объяснение, почему. Иначе предложение может смутить посетителей.
  • Обилие цветов, цветная подложка вместо белого фона. Читать текст на подложке очень сложно. Обилие цветов перегружает дизайн.
  • Элементы, которые долго загружаются. Это технический момент, о котором часто забывают. Если лендинг будет долго открываться, многие пользователи не дождутся его загрузки. Многие посетители заходят в интернет с мобильных устройств, где интернет не всегда быстрый и могут быть ограничения по трафику. Для них критично, чтобы лендинг открывался быстро.

7. Как провести анализ лендинга?

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

Пользуйтесь и получайте высокие результаты от контекстной рекламы!

Источник: www.kadrof.ru

Рейтинг
( Пока оценок нет )
Загрузка ...
Заработок в интернете или как начать работать дома