Что должно быть на первом экране лендинга?

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

Нужна ли цена на первом экране?

Если цена — ваше преимущество, да. «Уборка квартиры — 2 500 ₽» работает как оффер. Если цена высокая, лучше вынести в отдельную секцию и подвести к ней через ценность.

Сколько времени у первого экрана, чтобы удержать посетителя?

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

Первый экран лендинга: что должно быть и как сделать — Land Maker

Кратко

Первый экран лендинга — это 3–5 секунд, за которые посетитель решает: остаться или уйти. Три обязательных элемента: заголовок-оффер (что предлагаете), кнопка (что делать) и визуал (фото результата). Если за 5 секунд непонятно, что здесь происходит — посетитель уходит, и остальная страница не имеет значения.

Что такое первый экран

Первый экран — это часть лендинга, которую посетитель видит без прокрутки. На десктопе — примерно 700–800 пикселей в высоту, на мобильном — 500–600. Всё, что помещается в этот прямоугольник, определяет, будет ли посетитель читать дальше.

По данным исследований, 80% посетителей принимают решение о взаимодействии со страницей именно на первом экране. Если здесь непонятно, что предлагается — никакие отзывы и кейсы ниже не помогут.

Три обязательных элемента

Формула первого экрана

Заголовок-оффер — что предлагаете и какая выгода (не «Добро пожаловать», а «Ремонт квартиры от 7 500 ₽/м² — смета бесплатно») + Кнопка действия — что делать дальше (не «Подробнее», а «Получить расчёт») + Визуал — фото результата, продукта или команды (не стоковая картинка, а реальное фото)

Подзаголовок — необязательный, но полезный четвёртый элемент. Он уточняет оффер: «Фиксированная цена в договоре. Гарантия 3 года. 200+ объектов в Москве».

Примеры хороших и плохих первых экранов

Ниша	Плохой первый экран	Хороший первый экран
Ремонт	«Компания "Мастер". Качественный ремонт квартир»	«Ремонт под ключ от 7 500 ₽/м² — смета бесплатно за 24 часа»
Стоматология	«Стоматология "Улыбка". Мы заботимся о вашем здоровье»	«Чистка зубов — 2 990 ₽. Запишитесь онлайн, без очереди»
Фитнес	«Добро пожаловать в наш фитнес-клуб»	«Первая тренировка — бесплатно. Запишитесь сегодня»
Курсы	«Курс по дизайну. Начните обучение прямо сейчас»	«Освойте дизайн за 3 месяца — первый заказ уже во время обучения»

Типичные ошибки

Сравнение

Ошибки на первом экране

Последствие

Слайдер из 5 картинокПосетитель не успевает прочитать

«Добро пожаловать»Пустой заголовок, нет оффера

Нет кнопки действияНепонятно, что делать

Стоковое фотоНе вызывает доверия

Слишком много текстаПерегруз, посетитель не читает

Решение

Слайдер из 5 картинокОдно фото + один оффер

«Добро пожаловать»Конкретное предложение с выгодой

Нет кнопки действияЗаметная кнопка с конкретным текстом

Стоковое фотоРеальное фото вашей работы

Слишком много текстаЗаголовок + подзаголовок + кнопка

Ошибка	Последствие	Решение
Слайдер из 5 картинок	Посетитель не успевает прочитать	Одно фото + один оффер
«Добро пожаловать»	Пустой заголовок, нет оффера	Конкретное предложение с выгодой
Нет кнопки действия	Непонятно, что делать	Заметная кнопка с конкретным текстом
Стоковое фото	Не вызывает доверия	Реальное фото вашей работы
Слишком много текста	Перегруз, посетитель не читает	Заголовок + подзаголовок + кнопка

Чек-лист первого экрана

Заголовок содержит конкретное предложение (услуга + выгода)
Кнопка действия видна без прокрутки
Текст кнопки описывает результат, а не процесс
Фото реальное, не стоковое
На мобильном всё помещается без прокрутки
Нет слайдера, нет видео-фона, нет анимации, замедляющей загрузку
Подзаголовок уточняет оффер (гарантия, срок, бонус)

Проверьте свой первый экран

1Откройте лендинг на телефоне
2Засеките 5 секунд — всё ли понятно?
3Если нет — перепишите заголовок по формуле выше Или создайте лендинг с сильным первым экраном →

Или создайте лендинг с сильным первым экраном →

Первый экран лендинга: что должно быть и как сделать