Когда клиент открывает главную страницу корпоративного сайта, первый экран обычно показывает лишь ограниченную область. В этом месте посетитель принимает очень прямолинейные решения: чем занимается компания, имеет ли это отношение ко мне и куда нажать дальше. Именно эти три вопроса и должен решать первый экран, а не вываливать на него краткое описание компании.
Высокая стоимость понимания часто связана не с плохим текстом, а с неправильным порядком информации. Посетителю приходится сначала угадывать, «что продаёт эта компания», затем — «подходит ли это мне», и наконец искать вход. Каждый шаг расходует терпение. Упорядочить последовательность эффективнее, чем просто красиво писать.
Сначала дайте посетителю понять бизнес, а не компанию
Самое верхнее место на первом экране следует отдать самому бизнесу. Одна фраза, понятная незнакомому посетителю, обычно полезнее, чем «ООО «Такой-то Технолоджи». Критерий прост: закройте название компании и посмотрите только на это предложение — сможет ли человек, не знакомый с отраслью, сказать, что вы предлагаете?
В главном заголовке можно указать объект бизнеса и форму поставки, например: «Развёртывание и обслуживание кассовых систем для сетевых магазинов». Такая формулировка не гонится за красотой, она стремится к тому, чтобы посетитель мгновенно отнёс вас к нужной категории. Подзаголовок может дополнить отличия: географию услуг, опыт в отрасли или способ поставки. Но не стоит втискивать в главный заголовок три-четыре преимущества.
Если у компании несколько направлений, не обязательно раскрывать их все на первом экране. Можно выбрать одно, текущее приоритетное, а остальные разместить в навигации или ниже. Первый экран отвечает за то, чтобы «человек остался», а не за то, чтобы «рассказать всё сразу».
Укажите целевую аудиторию, чтобы снизить самоотсев
После того как посетитель понял бизнес, он сразу оценивает: «Это для меня?» Если на первом экране есть информация «кому подходит» или «какие отрасли обслуживаем», это помогает подходящим клиентам быстрее确认, а неподходящим — раньше уйти, сокращая неэффективные обращения.
Описание аудитории должно быть конкретным и узнаваемым. «Обслуживаем малый и средний бизнес» — слишком широко. «Обслуживаем сетевые бренды с тремя и более магазинами» — легче примерить на себя. Если точные цифры не нужны, можно указать отрасль, сценарий использования или этап закупки, например: «Подходит производственным компаниям, которые сейчас обновляют корпоративный сайт».
Важно: описание аудитории — это не кейсы клиентов. Непроверенную информацию о сотрудничестве не стоит выносить на первый экран. Описание сценариев тоже помогает отсеять лишних.
Оставьте на первом экране только одно основное действие
На первом экране часто встречаются кнопки «Связаться с нами», «Онлайн-консультация», «Узнать о продукте», «Бесплатный доступ» и т. д. Чем больше кнопок, тем сложнее посетителю выбрать. Рекомендуется оставить на первом экране только одну основную кнопку, а остальные действия перенести ниже или в навигацию.
Выбор основной кнопки зависит от текущего этапа бизнеса. Для компаний, ориентированных на консультации, кнопка, ведущая на страницу контактов или форму обратной связи, будет прямолинейнее. Для компаний, продвигающих продукт, лучше вести на страницу ключевого продукта. Текст кнопки должен описывать результат действия — это понятнее, чем «Нажмите здесь».
Рядом с кнопкой можно разместить второстепенный вход, например «Посмотреть процесс оказания услуг», но визуально его нужно отделить от основной кнопки, чтобы они не конкурировали за внимание.
Изображения должны помогать пониманию, а не занимать место
Типичная проблема изображений на первом экране — офисная сцена или абстрактная технологичная картинка, не связанная с бизнесом. Такие изображения занимают место, но не передают информацию. Практичнее разместить картинку, которая показывает суть бизнеса: интерфейс продукта, сцену оказания услуги, схему результата.
Если подходящего изображения пока нет, лучше уменьшить его площадь и отдать пространство тексту. Имя файла изображения тоже должно быть удобным для поиска внутри команды: например, по названию бизнеса и назначению, а не стандартное «IMG_0231». Это сэкономит время при последующей замене и оптимизации изображений для SEO.
Текст на изображении должен оставаться читаемым и на мобильных устройствах. В адаптивных макетах взаимное расположение картинки и текста на первом экране меняется, поэтому перед запуском нужно отдельно проверить отображение на компьютере и на телефоне.
Перед запуском пройдите по порядку восприятия
После правок первого экрана не ограничивайтесь просмотром дизайн-макета. Пройдите по нему взглядом постороннего: закройте название компании и посмотрите на главный заголовок — можете ли вы сказать, чем занимается бизнес; прочитайте описание аудитории и определите, входите ли вы в неё; найдите кнопку и проверьте, понятно ли с первого взгляда, куда идти дальше. Если все три шага проходятся легко, стоимость понимания первого экрана достаточно низкая.
Также стоит проверить, не обрезается ли текст первого экрана на распространённых размерах экрана и видна ли кнопка в пределах первого экрана. Если для основной кнопки требуется прокрутка, посетитель, скорее всего, просто уйдёт.
Первый экран — это не то, что создаётся раз и навсегда. При смене приоритетов бизнеса или основного продукта текст первого экрана тоже должен обновляться. Относитесь к нему как к входному контенту, который требует постоянной поддержки, а не как к украшению, заполняемому один раз при создании сайта.
