Главная страница сайта - это первое, что видят пользователи, которые зашли на сайт, это его лицо. Впечатление, которое оно окажет, влияет на все дальнейшее взаимоотношение пользователя с сайтом: заинтересовал ли его сайт, зайдет ли он еще, посоветует ли сайт своим друзьям.

Ниже вы найдете 9 полезных советов, касающихся главной страницы сайта.

1. Где я?​


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

Иными словами, убедите пользователя, что он находится в нужном месте.

2. Целевая аудитория​


Подстраиваться под всех - стратегия хорошая, но недолговечная. Ориентируйтесь на свою целевую аудиторию: на их сленг, на то, что они любят, и то, в чем они разбираются.

Начните с определения следующих критериев вашей целевой аудитории:

пол

возраст

род занятий

интересы

местоположение

После их определения еще раз посмотрите на главную страницу своего сайта и оцените, насколько она им соответствует.

3. Фотографии​


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

4. Продуманность​


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

5. Цветовая палитра​


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

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

Не знаете, какие цвета выбрать? Специализированные ресурсы вам помогут:

Color Supply

– подбор цветовой палитры с примерами того, что получается в итоге;

Colorscheme

– еще один онлайн-инструмент для подбора подходящих оттенков;

Colorion

– готовые цветовые палитры;

Color Hunt

– еще одно собрание красивых цветовых схем.

6. Призыв к действию​


Если вам нужно сподвигнуть пользователя к чему-то – заказать услугу, купить товар, оставить e-mail – то кнопку с призывом к действию лучше разместить прямо на главной странице. Не прячьте ее внизу или на какой-нибудь другой странице.

Главное условие – надпись на кнопке или баннере должна быть лаконичной и понятной. А сама кнопка заметной и выделяющейся.

7. Текст​


Текст, как и изображения, - это очень важный элемент главной страницы. Начнем с того, что делать не надо: размещать на главной странице длинные и нудные или переоптимизированные статьи.

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

8. Обновление информации​


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

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

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

9. A/B-тестирование​


Нет предела совершенству - даже если сайт дает неплохую, на ваш взгляд, конверсию, ее всегда можно повысить. Наверняка у вас появляются какие-то идеи «А что, если…?» Проверить на практике это можно при помощи

A/B-тестирования

. Многие владельцы сайтов забывают о такой опции.

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

Примеры интересных главных страниц сайтов​


Carbonmade

Очень оригинальный и запоминающийся дизайн: веселые рисунки, запоминающиеся иконки, яркая кнопка “Sign-up!” (регистрация). Справа – краткое перечисление преимуществ, слева – цифры, которые обновляются и убеждают в том, что сайт популярен.

proxy.php?image=https%3A%2F%2Ftimeweb.com%2Fmedia%2Fdefault%2F0001%2F01%2F2aa64a114543d60f15e59661b1e23d3f89682aca.png&hash=a9f350e09a3a3007a916e7f55d43ec41

Evernote

Дизайнеры сайта сделали упор на минимализм, простоту и текст. Вместо картинок – меняющиеся мотивирующие слоганы, которые останавливаются на информации о самом проекте. Кнопка с призывом к действию «Зарегистрируйтесь бесплатно» - самое яркое пятно на странице. На странице три раза повторяется слово «бесплатно» для того, чтобы еще сильнее мотивировать пользователя зарегистрироваться.

proxy.php?image=https%3A%2F%2Ftimeweb.com%2Fmedia%2Fdefault%2F0001%2F01%2Fe624da180fd8a2a26ce52392a1092745cc29bf3d.png&hash=35d076500cd4fb1f8d8666951fd222f7
А в 2013 году сайт Evernote выглядел по-другому:

proxy.php?image=https%3A%2F%2Ftimeweb.com%2Fmedia%2Fdefault%2F0001%2F01%2F9ca639f4df34dc4b3eebc053246a717f10fad196.png&hash=13229d2314d4e61f6bd029f036554d2c

Basecamp

Еще один известный проект, который тоже периодически меняет главную страницу своего сайта. Здесь сразу привлекает внимание оригинальная картинка и нестандартная надпись “We’ve been expecting you” (Мы вас ждали). Слева – список положительных моментов проекта, справа – форма для регистрации и кнопка призыва к действию. Простой и в то же время эффективный дизайн.

proxy.php?image=https%3A%2F%2Ftimeweb.com%2Fmedia%2Fdefault%2F0001%2F01%2Fa246a9c14cc74a2dbc2bf4b75c5bce47058ea1b0.png&hash=1e8124a26bee4a40a64a93eb9efe5e7c

Вариант 2013 года:

proxy.php?image=https%3A%2F%2Ftimeweb.com%2Fmedia%2Fdefault%2F0001%2F01%2F07468be8373b645c1644f43727f8feddad0b8f9f.png&hash=7e08b5e15071d6c25d31f6edb244d7ee