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

Часть 6. Структура и прототип лендинга

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

Задачи прототипа:

  • экономия времени на правках;
  • показывает общую картину будущего продающего сайта;
  • строится базовая композиция;
  • облегчить разработку дизайна
Прототипы бывают в формате эскиза, текстовом или mindmap.
Условно Формулу составления CTA можно определить так:
Заголовок + что получите или внутри + как это получить + что будет после

Прототип-эскиз:

  • Показывают всю картину клиенту или вам самим если делаете для себя
  • Строится базовая композиция
  • Легче делать дизайн
  • Трудозатратно и долго
Если дизайн будете делать не сами, а нанимать дизайнера — такой прототип существенно сэкономит вам время на объяснение задачи для дизайнера. Прототип заменяет одновременно и техническое задание и копирайтинг проекта. При работе с любым подрядчиком в сфере диджитал помните про поговорку “без хорошего ТЗ - результат ХЗ”

Текстовый прототип или mindmap

  • Быстро делается
  • Не даёт полного представления
  • Сложнее делать дизайн
Я также использую текстовые прототипы, когда для меня понятна и изъезжена мной несколько раз. Или когда бюджет или сроки сильно ограничены.

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

  • Собираем все смыслы которые мы уже подготовили (из анализа компании, анализа ЦА, анализа конкурентов, УТП);
  • Распределяем смыслы по блокам (в одном из постов я показывал более 50 вариантов блоков);
  • Создаём продающую структуру лендинга (расставляем порядок, добавляем призывы к действию CTA, кнопки итд);
  • Пишем для каждого блока текст. Используйте короткие формулировки на языке выгод клиента;
  • Делаем прототип-эскиз. Я использую для этого Figma или Tilda.

В 90% случаев подойдет модель продающей структуры AIDA:

Attention – внимание (за это отвечает Первый экран);

Interest – интерес ( за это отвечают Блоки презентации);

Desire – желание (за это отвечают Блоки доверия);

Action – действие (за это отвечают Конверсионные блоки).

Как создать продающую структуру лендинга:

1. Создаем продающую структуру и настраиваем порядок блоков соответствии с моделью AIDA

- Главный экран
- Блоки презентации
- Блоки доверия
- Конверсионные блоки
- Технические блоки

2. Распределяем блоки призывов к действию

(1 призыв через каждые 2-3-4 блока. Не впаривать, чувствуйте логику)

Как написать тексты для лендинга или сайта?

  • Убираем всю воду из продающей структуры. Оставляем законченные лаконичные формулировки. Каждая формулировка должна быть ценной — она закрывает потребность, боль, критерий выбора, возражение, сомнение, трудность выбора.
  • Делаем формулировки интересными для читателя. 90% ошибок во всех лендингах и сайтах это то что тексты не хочется читать. Вода водой.
  • Шлифуем тексты через сервис Главред (После того как вы написали формулировки, нужно их сделать правильными и чистыми. Для этого используем специальный сервис. Он полностью бесплатный.)
  • Придумываем заголовки для каждого блока

Как написать тексты для лендинга, которые будут читать?

  • Пишите максимально просто, понятно и коротко. Никто не хочет читать длинную научную статью на лендинге. Короткие емкие предложения, без воды и без причастных и деепричастных оборотов.
  • Не пишите на лендинге про себя как делают большинство формулировками “мы развивающаяся компания”, или “мы обеспечиваем” и подобными фразами, Пишите о клиенте. Используйте «Вы-позицию» (вы получите, вы узнаете, мы вам сделаем итд)
  • Опирайтесь на факты и цифры. Если экономия, то сколько в рублях? Если качественно, то сколько гарантия? Если профессионалы, то сколько работаете лет? Какой опыт у каждого сотрудника?

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

Как придумывать заголовки для лендинга:

  • Сначала вам нужно помнить что Лендинг читают бегло по заголовкам. Прочитав их посетитель должен понять, что вы предлагаете и захотеть с вами остаться.
  • Возьмите самое ценное и цепляющее во всём тексте для блока
  • Сформулируйте заголовок. Не более 2-3 строк. 8-12 слов.
  • Если формулировка не влезает в 1 заголовок — поместите оставшееся в подзаголовок
  • Проверьте копирайтинг — если пробежаться бегло по заголовкам, понятна ли суть предложения? Закрывают ли тексты потребности, боли и критерии выбора?
По сути как только вы сделали заголовки и тексты - текстовый прототип у вас готов.
Чтобы превратить его в прототип-эскиз необходимо расставить формулировки по блокам в схематичном виде.

При расставлении блоков помните, что лучше донесение смысла это картинка + текст. Если уместно то старайтесь комбинировать текст с картинкой.

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