landing page notes

тезисы по созданию посадочной страницы link

еще один варинт по списку секций — ссылка

примерный список секций:

  1. хедер, в котором заложено сжатое описание продукта. часто добавляют кнопку, призывающую к действию — «Консультация» или «Получить деньги». Используются картинки, анимация.
  2. описание кампании или продукта в более развернутом виде с использованием СЕО текстов.
  3. сопутствующие продукты компании или дополнение к основному продукту. Хорошая практика описывать дополнительную продукцию(какие плюшки получит покупатель, если купит основной продукт).
  4. традиционная часть «О нас». описание компании, производителя, продукта
  5. наши услуги либо «наши предложения»
  6. изобразить показатели компании(к-во довольных клиентов, к-во проектов). Повышает доверие к компании, соответственно и к продукту
  7. отобразить опыт компании в данной нише рынка. Повышает доверие, как и предыдущий пункт
  8. брендовые логотипы крупных клиентов
  9. блоки соц сетей, желательно без комментариев, только репост и лайки
  10. подписка на новости и рекламные кампании
  11. блок с фотографиями продуктов компании
  12. блок с новостями компании из блога оной
  13. контактная форма

Использование слайдера в хедере — понижает конверсию сайта.

PROOF:

http://unbounce.com/conversion-rate-optimization/conversion-killing-tactics/
http://conversionxl.com/dont-use-automatic-image-sliders-or-carousels-ignore-the-fad/

Советы:

  1. при создании кнопок, призывающих к действию — делать их более контрастными, чтобы они выделялись, для повышения конверсии
  2. простая структура с минималистичным дизайном
  3. никаких сайд баров
  4. без футера
  5. минималистичный хедер
  6. если добавляем используем лого — сделать «не кликабельным»
  7. в некоторых блоках, можно использовать видео, вместо картинок, для заднего фона
  8. выделить контактную форму
  9. название форму должно совпадать с кнопкой действий
  10. в одной форме не добавлять разные действия
  11. несколько раз повторять кнопки призывающие к действию
  12. посадочная страница != корпоративный сайт
  13. Кнопки «Заказать» больше подходят для e-commerce
  14. не использовать отсчет — понижает к-во отказов на 27% Источник

Как создать посадочную страницу на WP

Не смотря на то, что посадочные страницы делают простыми и минималистичными, на них должны выделятся и представлять, для посетителя, очевидные действия — такие как: кнопки, ссылки, отзывы.

NOTE: не скупится на дизайн — очень важно
NOTE: не создавать скучную страницу, сделать её более контрастной со всякими анимашками, типа бутстрапа

Landing pages live separately from your website and are designed to only receive campaign traffic. As we’ll see, this separation allows them to be focused on a single objective and makes analytics, reporting & testing a simpler task.

Think of the links on your page as leaks. Each link on your page that doesn’t represent your conversion goal is a distraction that will dilute your message and reduce your conversion rate.

Landing pages should have all navigation and extra links removed so there is only a single action for your visitors to take. Click your call-to-action.

В интернете, довольно много графических инструментов для создания посадочных страниц, такие как: http://www.leadpages.net/ или https://www.codeinwp.com/blog/best-drag-and-drop-theme-builders/

советы по улучшению посадочных страниц
https://habrahabr.ru/company/byyd/blog/302920/
https://habrahabr.ru/company/yagla/blog/301942/
https://habrahabr.ru/company/yagla/blog/300776/

полезные материалы:

ЦМС для создания одностраничников:

фреймворки для фронтенда:

Визуальная верстка:

сравнение этих продуктов

анимация:

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

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *