Для чего выбирать одну страницу

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

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

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

Рекламное обещание продолжается в заголовке

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

Крупная фотография не заменяет это объяснение. Заголовок называет предмет услуги, подзаголовок раскрывает существенные условия. Кнопка предлагает понятное действие. Если стоимость нельзя назвать заранее, полезно объяснить причину и способ расчёта. Фраза о низкой цене без её основания лишь перенесёт неприятное уточнение в разговор с менеджером. Для запроса расчёта выбирайте такое же название кнопки, какое действие реально выполнит компания. Обещание мгновенной цены создаёт другое ожидание, чем обещание обсудить задачу, поэтому одинаковая форма с разными подписями способна приносить обращения, авторы которых ждали совершенно разного ответа.

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

Вопросы покупателя определяют структуру

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

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

Вопрос посетителяСодержание блока
Это подходит моей задаче?Предмет услуги, аудитория и ограничения.
Что входит?Состав работ и результат, который передают заказчику.
От чего зависит цена?Факторы расчёта и необходимые вводные.
Почему можно доверять?Проверяемые сведения о компании и подтверждения.
Как обратиться?Форма, способы связи и порядок дальнейшего ответа.

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

Наглядный разбор

Порядок объяснения услуги

  1. Предмет

    Понять, какую задачу решает услуга.

  2. Условия

    Оценить состав и порядок расчёта.

  3. Подтверждение

    Увидеть основания доверять исполнителю.

  4. Обращение

    Передать сведения для следующего разговора.

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

Форма принимает действие, которое обещала страница

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

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

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

Конструктор и разработка различаются объёмом управления

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

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

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

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

На телефоне сохраняется тот же путь к обращению

Узкий экран меняет порядок чтения. Для критерия приёмки можно взять WCAG Reflow с ориентиром 320 CSS-пикселей: обычный вертикальный контент сохраняет информацию и действие без прокрутки в двух направлениях, а содержимое, которому двумерность нужна для смысла, рассматривается с предусмотренными исключениями.

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

Для текста ориентир контраста в WCAG 2.2 составляет 4,5:1, а для крупного текста — 3:1. Это измерение пары текста и фона. На фото фон меняется по кадру, поэтому для основных условий услуги спокойная подложка надёжнее белой подписи поверх сложного изображения.

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

Измерение начинается с успешного обращения

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

В той же справке назван тип «Отправка формы». Выбор способа учёта исполнитель объясняет устройством страницы. Заказчик принимает не название настройки, а совпадение события с результатом. Для этого обращение проходит от рекламной ссылки до места обработки. Менеджер видит нужные сведения и источник, а аналитик — событие, которое относится к этой отправке.

Расчётный пример: 500 визитов дали 15 подходящих обращений, доля составляет 3 %. Если сократить поля и получить 20 отправок, но только 10 подходящих задач, количество форм вырастет при ухудшении полезного результата. Поэтому оценка лендинга включает качество обращений и стоимость их получения.

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

Наглядный разбор

Что считать после запуска

  1. Визит

    Человек пришёл к предложению.

  2. Обращение

    Форма принята и дошла до сотрудника.

  3. Подходящая задача

    Компания может выполнить нужную работу.

  4. Продажа

    Клиент принял предложение и оплатил его.

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

Неполный лендинг повышает риск бесполезных расходов

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

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

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

Источники и полезные ссылки

  1. Метрика: лендинги ↗
  2. Метрика: целевое событие ↗
  3. W3C:Reflow ↗
  4. W3C:контраст ↗
  5. Яндекс:лендинги в Директе ↗

Интерфейсы и возможности сервисов могут меняться. Перед настройкой сверяйтесь с актуальной документацией.

Игорь Крещенко

Руководитель ШТАБ ИТ. Занимается управлением проектами, веб-разработкой, рекламой и PR. Подробнее об авторе →