Какой должна быть главная страница сайта: новый взгляд
Встречают по одежке. И для интернета это тоже верно – пользователь формирует мнение о сайте за 5 секунд. Что он успевает увидеть за это время? Часть страницы, называемую above-the-fold (выше сгиба) – ту, что видна без прокрутки. Поэтому над ней так «трясутся» дизайнеры и маркетологи.
Но так ли важен этот элемент? Есть мнение, что его переоценивают. В этой статье вы узнаете какой должна быть главная страница сайта с учетом последних трендов веб-дизайна.
Сам термин «выше сгиба» пришел из печатной прессы. Газеты в киосках выкладываются сложенными пополам, так что читатели могут видеть только верхнюю половину страницы. Поэтому все интригующие анонсы, заголовки, иллюстрации размещают вверху.
В отличие от газет, интернет – более динамичный источник информации. Посетители хотят в считанные секунды удостовериться, что на сайте есть то, что им нужно.
Поэтому на заре интернета веб-дизайнеры старались запихнуть важный контент в верхнюю часть страницы. Например, так выглядел в конце 90-х сайт Apple:
![Пример главной страницы сайта от Apple Пример главной страницы сайта от Apple](/img/doljna-byt-glavnaya-stranica-sayta-1.png)
Тогда бытовало мнение, что ниже сгиба мало кто заглядывает, пользователи игнорируют скроллинг (в те времена даже мышки были без колесика прокрутки плюс высота страницы всего 600 пикселей).
Аbove-the-fold сейчас
Подходы 10-летней давности устарели. Появился простой, интуитивный скроллинг – колесиком мышки или касанием сенсорной панели. Для пользователей мобильных гаджетов это действие практически непроизвольное: мы заранее ожидаем, что сайт состоит из нескольких экранов, которые необходимо листать.
Да и определить линию сгиба все сложнее. В итоге оптимальный вариант – «страничный» дизайн, когда информация распределяется порциями по нескольким экранам.
![Главная страница со страничным дизайном Главная страница со страничным дизайном](/img/doljna-byt-glavnaya-stranica-sayta-2.png)
Исследования показывают, что элементы ниже сгиба привлекают такое же внимание.
![Пример работы элементов ниже линиии сгиба Пример работы элементов ниже линиии сгиба](/img/doljna-byt-glavnaya-stranica-sayta-3.png)
По данным Charybeat, самая высокая аудитория – у части между 600 и 1 000 пикселями от начала страницы. В целом 66% внимания приходится на контент ниже сгиба.
Что делать?
При всем этом первый экран по прежнему сильно воздействует на пользовательский опыт. Это сочетание эстетики и ценностного предложения – выгоды пользователя обратиться именно к вам. Продвинутые маркетологи говорят: «Сайт – больше не витрина вашего бизнеса. Это и есть ваш бизнес».
Да, пользователь не останавливается на первом экране и прокручивает страницу, но дальше его должно что-то зацепить, подтолкнуть к конверсии (звонку или заявке).
Рассматривайте страницу как повествование, историю. Кульминация рассказа – ваш CTA, призыв к действию.
Добавьте веб-элемент на нижней границе экрана
Например, внизу главной страницы VWO (сервис A/B тестирования) – кнопка СТА «Посмотрите как легко можно провести А/В тесты для вашего сайта»:
![Добавление кнопок CTA внизу главной страницы Добавление кнопок CTA внизу главной страницы](/img/doljna-byt-glavnaya-stranica-sayta-4.png)
Прямо предложите прокрутить страницу
Долой намеки! Вы можете прямо указать, что более подробная информация ниже сгиба.
![Прямо предложите прокрутить страницу Прямо предложите прокрутить страницу](/img/doljna-byt-glavnaya-stranica-sayta-5.png)
Размещайте выше сгиба информацию о своих преимуществах
В некоторых случаях размещение отзывов, гарантий, партнерских логотипов дает увеличение конверсии.
Как в этом примере:
![Размещайте выше сгиба информацию о своих преимуществах Размещайте выше сгиба информацию о своих преимуществах](/img/doljna-byt-glavnaya-stranica-sayta-6.png)
Во втором варианте сделан акцент на плюсах компании: что она известна в стране, дает гарантию возврата денег и так далее. Пользователям нравится, когда все сразу разложено по полочкам.
Готовьте качественный контент
Привлекательные картинки и грамотный дизайн могут привлечь пользователя и побудить его задержаться на странице. Но конечное время просмотра и целевое действие зависят только от контента. О том как это сделать с помощью Уникального торгового предложения читайте в этой статье.
Как найти клиентов начинающему маркетологу Статья
Google Optimize: руководство по применению Статья
Основы таргетированной рекламы для начинающих специалистов Статья
Как юристу вести Telegram канал. Отвечает адвокат Валерий Рогальский Статья
Кейс клиента Vitamin.tools о продвижении детского лагеря в VK Ads: как получать заявки по 500 рублей 3 месяца подряд Статья
Лидогенерация на мероприятия Статья
Пустые бланки резюме для устройства на работу – где взять? Статья
6 советов от клиента Vitamin.tools по продвижению психолога в TG через Директ Статья
Работа на фрилансе или в агентстве: плюсы и минусы Статья