Что должен увидеть клиент в первые 5 секунд на главной странице вашего сайта

Кто-то открывает ваш сайт с телефона, в лифте, одной рукой. В его распоряжении верхняя половина экрана — всё, что видно без прокрутки — и около пяти секунд терпения. За эти секунды он не читает. Он смотрит. И решает одно: «эти ребята делают то, что мне нужно, или нет?» Если ответ не очевиден, он жмёт «назад» и открывает следующий результат в Google. Не потому что вы хуже — а потому что за пять секунд он не понял, кто вы.

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

Три вопроса, на которые hero отвечает мгновенно

Человек, попавший на верх страницы, не осознавая, задаёт три вопроса по порядку. Hero должен ответить на все три до прокрутки:

• Чем вы занимаетесь? — Не «инновационные решения», а «чиним холодильники», «делаем сайты», «стрижём детей». Слова, которые использовал бы он, а не вы.
• Для кого и где? — «в Клуже и окрестностях», «для стоматологических кабинетов». Человек хочет узнать себя: «да, это про меня».
• Что мне делать сейчас? — Одна ясная кнопка. Позвонить, Запросить смету, Записаться. Если он не знает, куда нажать, он ушёл.

Если посетитель не может ответить на эти три вопроса, глядя на первый экран, hero не работает — каким бы красивым ни был фон.

Анатомия hero, который конвертирует

Это не магия — это пять частей, в том порядке, в котором их ловит глаз:

• Заголовок (H1) — конкретное обещание, а не слоган. «Сантехника в Клуж-Напоке, со счётом и гарантией» всегда бьёт «Уют вашего дома». Пишите выгоду, а не поэзию.
• Подзаголовок — одно предложение, которое говорит, для кого вы, и снимает главное сомнение: «Приедем за 24 часа, назовём цену до начала работ».
• Главная кнопка (CTA) — одна, с глаголом в вашем голосе: «Запросить смету», «Забронировать столик». Не «Отправить», не «Нажмите здесь».
• Знак доверия — маленькая строка под кнопкой: «более 200 работ», «настоящие отзывы в Google», логотип клиента. Одно предложение, а не абзац.
• Изображение — настоящее фото вас, вашей команды, вашего помещения. Не сток с людьми в костюмах, жмущими руки. Посетитель чувствует фальшь мгновенно.

Правило, по которому мы работаем: если элемент не помогает ответить на один из трёх вопросов, ему не место в hero. Мы опускаем его ниже или выбрасываем.

Сколько текста на самом деле ставить

Гораздо меньше, чем вы думаете. Наверху глаз читает заголовок и, самое большее, одно предложение подзаголовка. Остальное — шум, который мозг пропускает. Хороший hero читается вслух за две секунды, не спотыкаясь.

• Заголовок: 5-9 слов. Если не можете прочитать на одном дыхании — слишком длинно.
• Подзаголовок: одно предложение, максимум две строки на телефоне.
• Кнопка: 2-3 слова, один глагол.

Классическая ошибка — абзац-манифест наверху: три фразы про «нашу страсть к качеству». Его никто не читает. Перенесите историю в «О нас», а наверху оставьте только обещание и кнопку.

Ошибки, которые лишают hero силы

Мы видим их почти на каждом сайте, который берём в работу:

• Карусель, которая крутится сама — она меняет сообщение прежде, чем вы его схватите, и уводит кнопку из-под пальца. Одно ясное сообщение лучше пяти убегающих.
• Две-три равные кнопки — когда важно всё, не важно ничего. Одна главная кнопка, остальное тихо.
• Пустой слоган вместо заголовка — «Вместе вперёд» не говорит, чем вы занимаетесь. Заголовок — место, где вы точно называете ремесло.
• Текст поверх слишком пёстрого фото — если не читается на телефоне, на солнце, значит не читается вовсе.
• Кнопка ниже линии прокрутки — если надо листать, чтобы увидеть, куда нажать, половина людей её никогда не увидит.

Hero в переводе на профессии

Те же три вопроса, одетые по-разному:

Заметьте: нигде нет «добро пожаловать», нигде «качество и профессионализм». Только что вы делаете, где, и на что человек нажимает.

Лучший способ проверить: тест на 5 секунд

Дайте телефон с открытым сайтом другу, который не знает, чем вы занимаетесь. Подержите пять секунд у него перед глазами, потом закройте. Спросите: «чем эти люди занимаются, для кого, и на что бы ты нажал?» Если он замешкался хоть на одном — в hero дыра. Это бесплатно и беспощадно честно.

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

Сколько стоит сделать hero как надо

Hero не покупается отдельно — это сердце первой страницы, и мы продумываем его с самого начала в любом пакете:

• Landing page (одна страница, всё построено вокруг этого первого экрана и кнопки): 290-490 €
• Сайт-презентация (несколько страниц, сильный hero на каждой): 490-890 €
• Интернет-магазин: от 690 €
• Обслуживание (меняем сообщение, предложение, фото, когда нужно): от 29 €/месяц

Цена зависит от того, сколько страниц вы хотите и сколько контента готово. Хорошо продуманный hero стоит столько же, сколько плохой — разница в том, что один наполняет запись, а другой нет.

Давайте покажем, а не расскажем

Проще всего увидеть своими глазами. Мы бесплатно сделаем вам демо первой страницы с hero под ваш бизнес — сообщение, предложение, кнопка — и вы сразу решите, нравится ли. Напишите нам в WhatsApp на wa.me/40750257140 и расскажите, чем занимаетесь. Остальное сделаем мы.