Дизайн главной страницы. Как влюбить в компанию с первого взгляда?

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

Главная страница поэтому и называется главной: даже если посетитель сначала попадает в один из разделов веб–ресурса, больше всего взаимодействовать он будет именно с ней. Основная страница выполняет несколько важнейших функций, среди которых можно выделить:

• Навигационную. Благодаря меню или активным кнопкам на главной, юзер без труда найдет нужный раздел и получит информацию, ради которой и перешел на сайт.
• Информационную. Содержимое этой страницы позволяет пользователю быстро оценить полезность всей информации на ресурсе и получить максимум данных о компании–владельце площадки.
• Коммуникативную. На главной – больше всего блоков, позволяющих посетителю быстро получить обратную связь от представителей компании. Это и всплывающие окна для заказа обратного звонка, и формы обратной связи. Для высокой конверсии очень важно, чтобы ваш потенциальный клиент не разыскивал эти элементы по всем разделам ресурса.
• Продающую. Именно на главной стоит помещать свое уникальное торговое предложение – те преимущества, которые помогут пользователю понять, что он искал именно вас, и принять решение о дальнейшем сотрудничестве.

Вне зависимости от того, идет ли речь об интернет–магазине или личном блоге, контент на главной должен быть структурирован таким образом, чтобы выполнить все эти функции. Согласно исследованиям, чтобы оценить полезность сайта, юзеру достаточно всего 15 секунд после загрузки этой страницы. Если она ему не понравилась – ресурс будет закрыт. Как удержать посетителя?

Успеть за 15 секунд: что разместить на главной странице

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

Первый экран

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

Начните с заголовка: он должен отражать суть ваших услуг или презентовать товары. Простыми словами, посетитель сразу же должен понять, чем именно вы занимаетесь и зачем, собственно, он сюда пришел. Так, если вы – агентство, создающее сайты, пишите: «Создаем сайты под ключ». И вас точно не перепутают с клининговой компанией.

Раскройте суть заголовка в подзаголовке, который будет расположен ниже. Хороший пример оформления главной страницы для того же агентства веб–дизайна – уточнение, с какими сайтами вы работаете, или перечисление ваших преимуществ. Таким образом, конструкция будет выглядеть так: «Создаем сайты под ключ. Лендинги, интернет–магазины, корпоративные порталы. Быстро и качественно».

Следующий блок первого экрана – призыв к действию. Его цель – подтолкнуть пользователя к покупке или заполнению заявки. В нашем случае подойдет такой вариант: «Оставьте свои контакты прямо сейчас, и получите скидку на любой сайт в размере 10%». Не забудьте соответствующе назвать и кнопку, которая будет сопровождать призыв к действию. Соответственно, в нашем примере форма должна появляться после клика по кнопке «Оставить контакты» или «Получить скидку».

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

Уникальное торговое предложение

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

Не стоит писать в этом блоке банальностей. «Большой ассортимент», «Гарантия качества» – вещи, которые вряд ли помогут вам отстроиться от конкурентов и «зацепить» пользователя. Каждое преимущество должно закрывать определенную потребность вашего клиента и быть максимально конкретным. Например, для тех, кому важна скорость работы, стоит написать: «Работаем быстро. Выполним ваш заказ в течение 5 рабочих дней», а для категории клиентов, которую заботит уровень сервиса, подчеркните, что гарантируете индивидуальный подход: «Персональный менеджер. Специалист будет сопровождать вас на всех этапах сотрудничества».

Информация о компании

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

Лид–магнит

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

Предложите пользователям скачать презентацию, гайд, электронную книгу или небольшой видеокурс бесплатно в обмен на контакты. Так вы получите возможность связаться с «теплым» представителем ЦА позже, чтобы закрыть сделку, и повысите лояльность к бренду.

Доказательства успеха

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

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

Контакты организации

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

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

Простые советы для повышения конверсии

Если сайт – визитная карточка вашего бизнеса в Интернете, то его главная страница – лицо компании, которое просто обязано быть не только безупречным, но и максимально привлекательным. Чтобы максимальное количество посетителей перешло в категорию клиентов, нужно:

• Помнить о юзабилити. Оценивайте, насколько пользователям удобно взаимодействовать со всеми элементами портала, какое время затрачивается на поиск нужной информации. Не перегружайте главную страницу избыточным количеством сложных анимационных элементов, всплывающих окон и форм. Они не только увеличат продолжительность загрузки, но и создадут лишний информационный шум, который раздражает большинство юзеров.
• Адаптировать главную для всех видов устройств. Подавляющее большинство пользователей Интернета просматривает сайты с мобильных гаджетов – смартфонов или планшетов. Если ваш портал выглядит безупречно в десктопной версии, но совершенно неудобен для взаимодействия с таких устройств – вы потеряете эту часть аудитории. Обязательно проверяйте, как отображается главная в разных браузерах и экранах с различной диагональю.
• Забыть о принципе «все и сразу». Любому владельцу бизнеса хочется как можно больше рассказать о своей компании, ускорив принятие решения посетителем страницы. Однако на главной это совершенно неуместно. Тексты, размещенные здесь, должны быть лаконичными и понятными, изображения – качественными и привлекательными. А для дополнительной информации у вас всегда есть другие разделы.
• Использовать основные принципы SEO. Поисковые краулеры часто оценивают сайт именно по главной странице, ведь пользователи проводят здесь больше всего времени. Чтобы получать органический трафик из поисковой выдачи, заполните метатеги главной и используйте в размещенных здесь текстах релевантные ключевые слова.
• Учитывать интересы и характер целевой аудитории. Сайт для разных ЦА не может быть одинаковым. Важно все: от тона, которым вы обращаетесь к своим клиентам, до цветовой гаммы, выбранной для брендбука. Так, портал развлекательного центра, выдержанный в темных тонах с текстами, написанными официальным языком, попросту не будет демонстрировать нужного уровня конверсии. Такая площадка, в первую очередь, обязана ассоциироваться с радостью и весельем!
• Проводить А/В тестирования после любых изменений. Они предусматривают запуск нескольких вариантов сайта с дальнейшим сравнением уровня конверсий. Такие тесты помогут понять, какие изменения нравятся представителям целевой аудитории и что можно улучшить в дизайне главной.
• Регулярно просматривать аналитику. Подключите свой ресурс к Яндекс. Метрике, чтобы отслеживать, с каких локаций и устройств к вам чаще всего заходят посетители, с какими формами и блоками сайта они взаимодействуют, сколько времени проводят в том или ином разделе. Если главную закрывают через несколько секунд после загрузки, даже не заглянув в другие разделы площадки – вы явно что–то сделали не так. Аналитика поможет своевременно выявить и скорректировать ошибки, а значит – и повысить конверсию ресурса.

Конструктор Taptop – инструмент, который помогает бизнесу продвигаться в сети. В нашей Библиотеке уже собраны десятки шаблонов готовых сайтов, подходящих для самых разных ниш. Нужно только выбрать подходящий вариант и добавить информацию о своей компании.

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