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

Каким должно быть оформление главной страницы сайта?

Любой интернет-маркетолог скажет, что оно должно быть информативным, полезным, с удобной навигацией и интересным дизайном. Но в этом предложении нет конкретного ответа на наш вопрос. Рассмотрим основные факторы грамотного формирования главной страницы подробнее.
Главная страница – это страница обо всем, но с максимально удобной подачей. Даже при попадании нового пользователя из поиска на посадочную страницу, он с большой вероятностью перейдет на главную, где ему нужно кратко и ёмко рассказать о вашей компании, предложить основные услуги и/или товары.

На главной стоит обязательно указать:

• что вы за кампания и род вашей деятельности;
• постоянные и специальные предложения;
• описать особенности и преимущества.

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

Как оформить главную страницу сайта: пошаговая инструкция

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

Шапка сайта и главное меню

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

Информационные блоки

Кратко и доступно донесите пользователю о вашей основной деятельности в 2-3 блоках информации. Расскажите о ваших услугах, товарах и конкурентных преимуществах.
Особое внимание уделите вашим последним, сделав их отдельным блоком с собственным заголовком. Клиент должен мотивировать себя сделать выбор в пользу вашей компании. Только не распыляйтесь в этом блоке – изложите свои мысли сжато и дайте ответ на вопрос: почему именно вы?
Текст должен быть максимально структурирован: заголовки, блоки, абзацы и другие элементы верстки. Если вы удовлетворите первичные условия выбора пользователя, то с большой вероятностью он станет вашим клиентом.

Призыв к действию (CTA)

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

Подвал страницы

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

1. Не размещайте слишком много информации

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

2. Делайте акцент на спецпредложения

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

3. Используйте иконки, инфографику и изображения

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

4. Не преувеличивайте

Не стоит лгать и вводить в заблуждение, достаточно грамотно описать свои преимущества и услуги без лишних эпитетов.

5. Ищите варианты, не стойте на месте

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

6. Как оформить главную страницу сайта при SEO оптимизации?

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

Вывод

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

Солидная страница – дело сложное, так как подавляющее большинство не умеют их вообще. Какие-то выдуманные фамилии, корявые буквы в графе "О себе", стенка в кошечках, позорный аватар и неправильный круг общение.

Первое – только настоящий аватар, а не картинки из Google.

Второе – ваши реальные фамилия и имя. Особенно это относится к девушкам, которые пишут что-то вроде "Мария Wolf Соловьева" – абсолютно несерьезный подход, который вызывает смех.

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

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

Стена страницы – еще один важный показатель того, как о вас думают. Если там репосты котиков, мышек, розовых цитат из женских пабликов (еще хуже, если из пацанских) – серьезного отношения к себе не ждите. Лучший вариант – только посты собственного производства. Копировать информацию может каждый, но написать что-то свое и при этом дельное – далеко не все. О чем писать? То, в чем разбираетесь. Люди должны видеть в вас эксперта.

Большинство не отказались бы от популярности. И ее может получить абсолютно каждый, если действует грамотно. Вот вам бонусный совет – не держите в друзьях всех подряд, а некоторых вовсе . Если у вас 4 000 друзей, при этом накрученных, то будет антиэффект. В моем случае было около 10 000 человек, но реальных.

Такую небольшую популярность я получил благодаря каналу на YouTube и личным блогам. И меня часто спрашивали: "мол, да?" – что-то объяснять людям было сложно.

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

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

Подводя итог: никаких глупых репостов (а лучше вовсе отказаться от них), только собственные посты, только настоящие друзья – всех остальных в подписчиков, заполнять страницу полностью и солидно, исключительно настоящий аватар.

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

О чем эта статья?

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

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

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

В этой первой статье цикла мы расскажем какие основные правила создания . От дизайна зависит многое и мы постараемся направить вас в нужное русло.

В этой статье расскажем о следующих темах:

Дизайн интернет-магазина.

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

• Что вы продаете? Если вы продаете ювелирные изделия, стоит ли делать дизайн в “детском стиле”?
• Ориентируйтесь на целевую аудиторию. Если это молодежь, то стоит сделать сайт поярче. А если целевая аудитория исключительно мужчины, розовые тона явно не подойдут.
• Посмотрите интернет-магазины, которые занимаются продажами схожего товара, а также на сайты ваших поставщиков (как их найти?). Что вы находите общего среди них?
• Вы думаете, что сможете нарисовать дизайн самостоятельно не имея профильного образования? Бросьте эти потуги. Научитесь делегировать.
• Найдите компромисс между дизайном и юзабилити. Ведь главная цель – продать. Сделайте путь покупателя к этой цели максимально простым и ясным, не перегружая его информацией.

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

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

Элементы главной страницы.

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

Шапка сайта.

В шапке сайта следует размещать такие элементы, как:

• Строго слева логотип сайта, нажимая на который покупатель всегда попадет на главную страницу;
• Строго справа корзина интернет-магазина (). Пользователи привыкли, что она именно там;
• Контактные данные (телефон, электронная почта, другие виды связи);
• Горизонтальное меню с условиями оплаты, доставки и другими общими вопросами;
• Строка поиска.
• Краткое описание интернет-магазина, чтобы пользователи смогли понять что у вас продается;

Левый сайдбар (левая часть сайта)

Данное место зарезервировано для:

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

Правый сайдбар (правая часть сайта).

Здесь нет четких правил размещения. Обычно тут размещают акции, новые товары или любую другую полезную информацию. Приведем пример из shoppinglive.ru:

В правой части сайта можно разместить:

• Акции и новости магазина;
• Новые товары;
• Любую другую полезную информацию, которая не будет сильно отвлекать от покупок.

Центральная часть главной страницы.

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

• Наиболее популярными товарами;
• Товарами со скидкой;
• Важной текстовой информацией. Хороший пример: “Товар дня: Соковыжималка. 1000 рублей вместо 5000, осталось 3 штуки”. Плохой пример: “Добро пожаловать!”;
• Всем тем, что по вашему мнению сможет заинтересовать пользователя не закрыть страницу сразу, а остаться. Самое главное – в течение 3-х секунд пользователь должен понять что продают там куда он зашел. Казалось бы очевидная вещь, но очень много сайтов, где только через секунд 10 приходит понимание о том что продается.

Еще раз общие советы при создании главной страницы интернет-магазина :

• Не перегружайте её информацией и изображениями;
• Пользователь должен сразу понять что вы продаете;
• 3-4 свежих анонса новостей будет достаточно для того, чтобы покупатели поняли, что магазин существует;
• Правильно оформите тег TITLE, так как поисковые машины очень сильно ориентируются на него;
• Следуйте правилам создания интернет-магазинов, не “креативьте”, идя на поводу у дизайнеров;
• Обратитесь к и мы поможем вам поставить правильно задачу разработки главной страницы.

Что дальше?

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

Подпишитесь на обновления, чтобы следовать по пути бесплатного создания интернет-магазина вместе с нами.

Мы выпустили новую книгу «Контент-маркетинг в социальных сетях: Как засесть в голову подписчиков и влюбить их в свой бренд».

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

Каким должно быть оформление главной страницы сайта?

Информативным, полезным, удобным и приятным глазу. Это если вкратце. Разберем подробнее.

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

На главной стоит обязательно указать:

• Кто вы и чем занимаетесь.
• Что вы предлагаете.
• Почему стоит выбрать вас, а не любую другую компанию

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

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

Как оформить главную страницу сайта: разбираем подробно

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

Шапка и навигация

Здесь все просто: тут размещается логотип (он же ссылка на главную), со ссылками на . Здесь не стоит оригинальничать, потому что отступив от классической вертикальной или горизонтальной планировки вы рискуете запутать пользователя. Если делаете меню с иконками, снабдите их текстовым пояснением. «Контакты» размещайте либо справа, либо снизу, зависимость от типа меню.

В шапке стоит указать основную контактную информацию: телефон, адрес и почту. Так будет проще всем: пользователю не придется идти на страницу контактов, чтобы позвонить и задать вопрос о товаре или услуге.

Хороший пример оформления шапки главной страницы сайта – «Сбербанка». Все просто и правильно – под каждую услугу отдельный блок, контакты интегрированы в шапку.

Блоки с информацией

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

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

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

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

Оформление главной страницы сайта должно решает две задачи: привлекает внимание пользователя к нужным вещам и плавно подводит его к покупке. Поэтому важно в подходящий момент подтолкнуть пользователя к нужному решению. С этим всегда справлялся грамотный «Call-to-acton» – «призыв к действию».

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

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

Пример – сайт «Семантики». Призыв к действию один для всех услуг, поэтому внимание пользователя не рассеивается.

Подвал

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

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

Выделяйте выгодные предложения

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

Так сделал «Связной» – акция на виду и привлекает внимание.

Используйте изображения

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

Не перехваливайте себя

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

Постоянно редактируйте страницу

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

Как оформить главную страницу сайта с точки зрения SEO-оптимизации

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

Итоги

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

В статье используются изображения Дмитрия Миролюбова.

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

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

Кто вы такой?

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

Чем вы занимаетесь?

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

Что я здесь найду?

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

Чем вы отличаетесь от других?

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