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

Оглавление (нажмите, чтобы открыть):

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

Автор LANCIO Рубрика Блог Дата Октябрь 31, 2020

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

6 советов по оформлению главной страницы

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

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

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

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

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

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

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

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

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

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

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

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

Вывод

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

16 лучших примеров дизайна главной страницы сайта

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

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

Что делает хороший дизайн главной страницы сайта

1) Дизайн главной страницы четко отвечает на вопрос «Кто я?», «Что я предлагаю?» и/или «Что пользователь может сделать здесь?»

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

2) Резонанс с целевой аудиторией

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

3) Сообщение о ценном предложении

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

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

5) Включает в себя призыв к действию (СТА-элемент)

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

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

6) Постоянно изменяется

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

7) Использует отличный общий дизайн

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

Вдохновляющий веб-дизайн: 16 лучших дизайнов главной страницы

1) FreshBooks

Этот дизайн гениален, потому что:

  • Прост в использовании. Возникает много споров о том, какие домашние страницы лучше — короткие или длинные. Если вы выберете последний вариант, то должны обеспечить легкое прокручивание и чтение. Эта страница выглядит практически как история;
  • Удачно использовано сочетание цветов и позиционирование первичных СТА-элементов . Когда заходите на главную страницу сразу становится понятно, что компания хочет привлечь ваше внимание;
  • Очень заманчивый текст на СТА-элементе : « Попробуйте бесплатно в течение 30 дней »;
  • Эффектный подзаголовок: « Для более чем 5 миллионов людей, использующих FreshBooks , отправлять счета и следить за расходами теперь не проблема ». Это заявление привлекательно для целевой аудитории, потому что освоение бухгалтерского программного обеспечения, как правило, « мучительно сложно » для фрилансеров и владельцев малого бизнеса.

2) Airbnb

  • Это оформление главной страницы сайта пример впечатляет: она встречает посетителей полноэкранным видео с красивыми кадрами, высокого разрешения. Она рассказывает о путешественниках, которые проводят время, как будто они местные жители: готовят пищу на кухне, покупают местные сыры. Выглядит очень естественно и достоверно;
  • Прямо по центру главной страницы располагается форма поиска с местом назначения и датой прибытия/отбытия, которую ищет большинство посетителей, направляя пользователей к следующему логическому шагу;
  • Форма поиска « умная «: она автоматически отобразит последний поиск пользователя, если тот авторизован;
  • Основной призыв к действию (« Поиск «) контрастирует с фоном и выделяется, а вторичный призыв к действию виден в верней части.

3) Mint

  • Это супер простой дизайн с сильным заголовком и подзаголовком без сленга;
  • Домашняя страница обеспечивает безопасную, но спокойную атмосферу, что очень важно для продукта, который обрабатывает финансовую информацию;
  • Он также содержит простой и убедительный призыв к действию: « Зарегистрируйтесь бесплатно «. Дизайн CTA также замечателен — иконка в виде замочка попадает точно в цель, сообщая о безопасности еще раз.

4) Dropbox(Consumer)

  • Главная страница сайта Dropbox — пример предельной простоты. Ограничено использование рекламы и видеороликов, а также объединено все фоновое пространство;
  • По статическому скриншоту выше трудно понять, но этот оформления сайтов вариант привлекает внимание тонким использованием причудливой анимации в графике;
  • Подзаголовок — простой, но мощный: « Открывайте свои файлы где угодно и на любых устройствах, и без труда предоставляйте к ним доступ ». Не нужно расшифровывать какую-либо терминологию, чтобы понять, что делает Dropbox ;
  • Акцент на одном первичном призыве к действию: « Зарегистрируйтесь бесплатно «.

5) Dropbox(Business)

  • Это яркий пример обеспечения поддержки сайта для разной аудитории. Она отличается от главной страницы, которая изначально была создана для потребителя ( смотрите выше ). Бизнес-пользователи требуют больше информации, а также дополнительное подтверждение того, что Dropbox(Business) — безопасное и масштабируемое решение для компаний ( проблему восприятия Dropbox решает непосредственно на своей домашней странице );
  • Dropbox по-прежнему продолжает применять простой дизайн и брендинг. Он включает в себя только то, что важно: большое изображение с поддержкой рекламы и кнопку « Попробуй бесплатную 30-дневную ознакомительную версию «, призывающую к действию.

6) Whitehouse.gov

  • Создание сайта, который выступает за целую нацию — задача не из легких. Whitehouse.gov постоянно меняется, чтобы отразить главные проблемы и приоритеты. Тестирование и оптимизация — ключевой компонент блестящего дизайна домашней страницы;
  • Что особенно замечательно в Whitehouse.gov так это отличие от большинства сайтов, связанных c правительством. Он имеет чистый дизайн и способствует развитию сообщества;
  • Довольно легко найти то, что вы ищете, когда оказываетесь здесь. А если вы не можете сразу найти то, что нужно, есть удобное поле поиска.

7) 4 Rivers Smokehouse

  • В сочетании с большой картинкой для оформления сайта заголовок « ГРУДИНКА. 18 лет мастерства. Для вашего удовольствия » звучит заманчиво;
  • Прокрутка параллакса проведет для вас краткую презентацию услуг, меню и покажет людей, прекрасно проводящих время – прекрасное использование популярного дизайнерского тренда.

8) Cobb Pediatric Therapy Services

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

9) Jill Konrath

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

10) Evernote

  • За эти годы Evernote превратился из простого приложения, сохраняющего записи в набор инструментов для бизнеса. Это не всегда легко передать на домашней странице, но Evernote проделал хорошую работу по компоновке возможных сообщений в несколько ключевых преимуществ;
  • Эта домашняя страница использует сочетание насыщенных, приглушенных цветов в видео, а также подписи ярко-зеленого и белого цвета, чтобы выделить их на общем фоне;
  • После простого заголовка (« Помни все »), взгляд останавливается на призыве к действию « Зарегистрируйтесь Бесплатно ».

11) Telerik by Progress

  • « Скучное предприятие » — это не то чувство, которое возникнет, когда вы зайдете на сайт Telerik . Компания предлагает множество технологий и продуктов, использует смелые цвета, интересные дизайны и видеосъемку с энергетикой подобно Google . Одним из важных аспектов является создание обстановки, чтобы посетители чувствовали себя желанными и знали, что имеют дело с реальными людьми;
  • Мне нравится простой, выполненный на высоком уровне обзор шести товарных предложений. Это абсолютно понятный способ сообщить о том, что делает компания;
  • Реклама несерьезная и легко читается. Они говорят на языке своих клиентов.

12) Boxbee

  • Заголовок представляет собой призыв к действию, направленный прямо на целевую аудиторию: предпринимателей, работающих в индустрии хранения данных;
  • Оформление главной страницы сайта имеет чистый и простой дизайн. Он подчеркивает заголовок, а затем сразу же демонстрирует первичный призыв к действию;
  • Этот первичный призыв к действию выделяется за счет контрастного цвета.

13) eWedding

  • Для влюбленных, планирующих важный день, eWedding – прекрасное место для создания свадебного сайта. Домашняя страница не загромождена и включает в себя только необходимые элементы;
  • Подзаголовок « Создано более чем 800,000 свадебных сайтов! » — это большое социальное доказательство;
  • Включает в себя отличные видеоролики продукта, отличный заголовок и убедительный призыв к действию, который уменьшает сомнения благодаря тексту: « Создайте сайт ».

14) Basecamp

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

15) charity: water

  • Это не типичный некоммерческий сайт. Большое количество видеороликов, творческой рекламы и использование интерактивного веб-дизайна выделяют его;
  • Анимированный заголовок в оформлении сайта — отличный способ собрать множество сообщений в одной строке;
  • Правильное использование видео и фото, особенно в плане получения эмоций, которые вызывает действие.

16) TechValidate

  • Эта домашняя страница красиво оформлена. Особенно нравится использование белого пространства и контрастных цветов, а также клиент ориентированный дизайн;
  • Заголовок ясен и убедителен, как и призывы к действию;
  • Также есть отличная информационная иерархия, которая позволяет легко сканировать и быстро понимать страницу.

Данная публикация представляет собой перевод статьи « 16 of the Best Website Homepage Design Examples » , подготовленной дружной командой проекта Интернет-технологии.ру

Оформление сайта

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

Что входит в понятие «оформление сайта» в нашем понимании:

  1. Подбор цветовой гаммы для сайта;
  2. Формирование расположения текста, рисунков и видео материалов на страницах;
  3. Расположение информационных блоков (рекламы, комментариев, похожих статей и т.д.)
  4. Подбор шрифта (стиля и размера);
  5. Оформление элементов дизайна таким образом, чтобы было удобно посетителю.

Почему ещё важно ПРАВИЛЬНО оформить сайт?

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

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

  1. Правильно подана информация;
  2. Выделены главные элементы статьи;
  3. Есть дополнительные тематические ссылки;
  4. Цвета не «выедают» глаз;
  5. Явно выражены основные достоинства сайта.
  1. Человек дольше пробудет на странице;
  2. Просмотрит дополнительные страницы;
  3. Зарегистрируется;
  4. Оставит комментарий;
  5. Добавит сайт в закладки или социальные сети;
  6. Вернется на сайт ещё раз.
  1. Сайт будет лучше ранжироваться в поисковой выдаче;
  2. Поисковые системы будут уважать проект;
  3. Ресурс получит ещё больше целевой аудитории.

Теперь мы уверены, что за оформление сайта, вы возьметесь активнее, но а мы вам в этом с удовольствием поможем.

Как оформить сайт правильно?

Чтобы хоть как-то структурировать наши советы, мы разобьём их на страницы и главные элементы.

Цветовая гамма сайта

Создавая дизайн сайта, или дорабатывая его элементы, вы обязаны просто помнить о простом правиле: «На сайте должно быть не более 5-ти цветовых оттенков». Выбирать эти оттенки тоже нужно уметь, так как далеко не все цвета сочетаются. Помочь с этим могут специализированные сайты. Мне, например, очень по душе www.colourlovers.com – тут можно с легостью подобрать желаемую цветовую гамму с точными номерами цветов, а главное — посмотреть как они сочетаются. После чего, старайтесь во всех элементах использовать только эти цвета и оттенки.

Оформление главной страницы сайта

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

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

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

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

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

Оформление внутренней страницы сайта

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

  1. На самом видном месте (в центре странице) должен находиться тот контент, за которым пришел человек (статья, видео ролик, фотографии и описание товара и т.п.).
  2. На втором месте по важности должна находиться реклама (дабы по ней кликали), либо же кнопка или форма для оформления заказа. Это нужно сделать для того, чтобы клиент просто так не ушел от вас. Возможно, это несколько назойливо, однако если знать меру (дозировать рекламу и не делать форму/кнопку большой), то всё будет отлично. Такие элементы помещают обычно после статьи или с правой или левой стороны, как можно выше.
  3. На третьем месте по важности будет находиться навигация по сайту: меню, похожие товары/статьи и другие интересные и полезные ссылки. Этими ссылками мы забиваем остальное пустое место, но опять же, не перебарщиваем, дабы сайт «дышал».

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

Отдельное место занимает оформление текста. Несмотря на его содержание, он должен визуально легко читаться, с первого взгляда должна быть сразу понятна суть, структура, важные фразы и наглядные примеры. Даже и не думайте о сплошных «простынях» текста, где нет даже элементарных абзацев. Для того чтобы текст смотрелся интересно — стоит использовать максимум возможных выделений в нём (но без фанатизма): жирный, курсив, маркеры, цитаты и т.п. Кроме того, не идите на поводу у непрофессиональных SEO-оптимизаторов, которые твердят, что нужно выделять ключевые слова в тексте – это глупость, за которую поисковые системы серьезно наказывают (фильтром, а иногда даже баном). Также можно использовать заголовки, они визуально структурируют статью для пользователей, это в принципе нравится поисковым системам, но если вы не разбираетесь в заголовках, то лучше их вообще не использовать.

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

Оформление «шапки» сайта и «подвала»

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

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

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

Оформление боковой колонки (сайд-бара) сайта

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

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

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

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

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

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

Как оформить главную страницу сайта: 11 обязательных составляющих

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

Кстати! На тренинг ко мне приходят все, кто хочет запустить собственный проект. Личный сайт – это отличная возможность заявить о себе и получить надежный источник стабильного и, фактически, неограниченного заработка. Тренинг – бесплатный. Он идет всего 4 дня, а по его завершению у каждого участника – свой готовый сайт с первыми посетителями.

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

Ответ на вопрос «Главная страница сайта как оформить?» зависит от нескольких факторов. В частности, следует учитывать, какую основную цель преследует сайт:

  • продает;
  • предлагает услуги;
  • делится информацией и т.д..
Мастер Йода рекомендует:  Аутентификация в приложениях Node.js с помощью Passport Javascript

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

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

Главная страница сайта как оформить её правильно, по пунктам

1. Информативность

Попадая на первую страницу, пользователь должен без труда найти основную информацию:

  • что именно предлагает сайт;
  • чем занимается компания;
  • какие продукты или услуги доступны клиентам;
  • какую выгоду они получат от их использования;
  • контактные данные.

2. На одной «волне» с ЦА

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

3. Ценность предложения

Необходимо максимально лаконично рассказать о выгодах сотрудничества. Для этого не обязательно использовать только текстовое описание.

4. Функциональность и юзабилити

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

  • понятная навигация;
  • удобная регистрация и быстрая авторизация;
  • форма для заказа обратного звонка;
  • кнопка целевого действия.

Совет! Избегайте чрезмерной перегрузки контентом, визуальными элементами. Все это приведет к невосприимчивости главной информации.

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

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

6. Изменяемость

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

  • анонсов;
  • коммерческих предложений;
  • новостных заметок;
  • списка предлагаемых продуктов и т.д.

7. Приятный дизайн

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

8. Логотип

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

Идеальный вариант размещения – левая верхняя часть экрана. Так пользователям привычнее.

9. Понятная навигация

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

Меню чаще всего двух видов – вертикальное и горизонтальное. Расположение кнопок у них – практически идентичное. Например, кнопка «Контакты» находится в правой части экрана в горизонтальном меню или в нижней части вертикального меню.

Не пытайтесь выделиться на навигации. Здесь придерживайтесь принятых «стандартов».

10. Помощь в выборе действия

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

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

Если их все-таки несколько, визуальным оформлением выделите наиболее важное для вас. Таким образом, вы ненавязчиво покажите пользователю, что именно ему нужно сделать. Добиться этого можно следующим образом:

  • сделать кнопку другого цвета;
  • изменить шрифт;
  • поменять форму кнопки и т.д.

А еще – просто поместить его в центре. Не обязательно всей страницы, а конкретного «экрана».

11. Изображение

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

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

Как оформить главную страницу: личный совет

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

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

Что писать на главной странице сайта:
Добро пожаловать, или Посторонним вход воспрещен

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

Но вот создается впечатление, что о чем писать на главной станице сайта – тайна за семью печатями. Как иначе объяснить наличие всяких «Добро пожаловать, вы попали на сайт компании», «Рады приветствовать вас на сайте интернет-магазина» и полотен текстов вместе с ними? И нет, мы не выдумываем, количество такого контента до сих пор зашкаливает, хотя давно пора от него избавиться и писать для людей. Однако стоит заглянуть в выдачу, и вуаля:

Признайтесь себе честно, вынесли из этого текста что-то полезное? Да и вообще, стали бы его читать, визуально привлек он вас? Вот то-то и оно.

Или вот еще вариант покороче, но также не несущий никакой пользы:

Поприветствовали нас на сайте, пожелали приятных покупок, но ни о чем полезном не рассказали.

Или еще такая главная с текстом:

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

Еще раз о важном: зачем писать текст на главную страницу?

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

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

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

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

Что писать на главной странице сайта?

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

При этом важно не лить воду и не разводить огромные скучные портянки текста. Достаточно будет написать на главную страницу сайта текст объемом около 2000 символов.

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

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

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

Как писать текст на главную страницу?

Представьте, вы интересуетесь строительством дома и выбираете подрядчика. Отбросив в сторону дизайн, какой из текстов более понятен и вызывает доверие:

Первый – поток сознания без какой-либо конкретики, или второй – хорошо структурированный, продуманный текст с фактами и разбивкой на смысловые блоки? Вывод напрашивается сам.

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

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

При этом не надо изобретать велосипед, есть проверенные схемы продающих текстов:

  • AIDA (Внимание – Интерес – Желание – Призыв к действию)
  • ACCA (Внимание – Понимание, восприятие аргументов – Убеждение – Призыв к действию)
  • PAS (Проблема – Внимание – Решение)
  • ODS (Оффер – Ограничения – Призыв к действию) и т.д.

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

Какие блоки и информацию использовать?

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

Что вас интересует больше: причины, по которым люди стремятся переехать за город или непосредственно красивый и экологичный коттедж с гарантией 10 лет?

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

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

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

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

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

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

Максимально полный список блоков при написании текста на главную страницу выглядит так:

  • заголовки;
  • теглайн в шапке;
  • УТП и текст в первом экране;
  • описание товара \услуги;
  • цены и их обоснование;
  • преимущества с упором на выгоды клиента;
  • гарантии;
  • сертификаты\документы;
  • наглядные и подробные кейсы;
  • схема работы;
  • акции\скидки\спецпредложения;
  • информация о сотрудниках компании;
  • отзывы;
  • дополнительная важная и полезная информация;
  • слайдеры;
  • призыв к действию.

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

Мастхевы или что не забыть написать на главной странице сайта

Цепляющие заголовки

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

Посмотрим на примерах:

Никакого заголовка нет и в помине. Глазу не за что зацепиться в тексте, не ясно, куда ты попал и что на сайте можно найти.

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

Информация о продукте или услуге

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

Вот отличный пример того, как делать не стоит:

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

Здесь же видим обратную картину: указано из чего сделан корректор, что это пользователю дает. Рассказано, как корректор работает и в каком случае поможет.

И ведь это не огромное занудное описание – все кратко и понятно. Клиент сразу получает представление о товаре, ничего дополнительно искать или додумывать не придется.

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

А) «не хочу, чтобы мои цены видели конкуренты, поэтому их никогда не укажу»;

Б) «у меня нет фиксированной стоимости, все просчитывается индивидуально».

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

Представьте, вы пришли в «Эльдорадо» за чайником, а там вместо ценников на всех товарах табличка «запросите прайс у продавца». Оно вам надо? Логичнее и проще пойти в «М-Видео», посмотреть цены и купить.

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

Несколько примеров реализации для вдохновения:

    Указываем диапазон цен и даем пояснение, от чего они зависят – берем котика для дома, племенного разведения или для выставок.

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

Ставим простенький калькулятор. Но не заставляем пользователя заполнять кучу полей, 2-3 будет достаточно, чтобы просчитать примерную стоимость и показать ее человеку.

Преимущества с упором на выгоды клиента

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

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

Сплошное «мы-мы-мы» и одна вода. Какие сроки, как качество проверить – тайна, покрытая мраком.

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

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

Прямо пишите, что должен сделать посетитель после прочтения текста: позвонить, написать, нажать кнопку, перейти в каталог и т.д. Целевое действие, оно же CTA, фактически является элементом гипноза. Оно стимулирует, дает пользователю четкую инструкцию, что и как следует сделать для получения товара или услуги.

Часто сталкиваемся с такой ситуацией, когда клиент просит убрать CTA и все прочие «очевидные элементы» – мол его посетители и так догадаются что к чему, не надо из людей идиотов делать. Так вот, не догадаются: представьте, вы пришли на сайт, пролистали 5 экранов текста и вдруг он резко закончился. Ни телефона, ни ссылки, ни формы, ни кнопки. Куда обращаться-то? В шапку вернуться – это опять что-то листать и прокручивать. А если и там не будет контактов компании – вообще беда, искать на других страницах уже никто не будет. Поэтому получается такая картина: вроде написали на главную страницу сайта текст, причем неплохой, человек им заинтересовался, а как с вами связаться – элементарно не указали. Как итог, клиента потеряли.

Вот несколько хороших примеров оформления CTA:

Доставка, оплата, схема работы

В двух словах обозначьте сроки доставки, укажите, как оплачивать услуги или товар.

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

Это снимет лишние вопросы и повысит доверие – все четко, прозрачно, а значит никаких подводных камней и обмана.

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

От чего сразу и бесповоротно можно отказаться на главной

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

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

Вместо выводов

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

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

© 1PS.RU, при полном или частичном копировании материала ссылка на первоисточник обязательна.

Руководитель отдела Копирайтинга сервиса 1PS

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

Назначение главной страницы сайта

Главная страница — лицо сайта. Даже если наиболее востребованная информация содержится в каком-то определённом разделе, пользователям так или иначе время от времени будет необходимо пользоваться домашней страницей. Поэтому её содержимое и дизайн должны быть максимально продуманными.

В зависимости от типа сайта главная страница будет построена по уникальной схеме:

  • Новостной сайт;
  • Сайт компании;
  • Сайт продукта;
  • Блог;
  • Интернет-магазин.

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

Что должно быть на главной странице сайта

Заголовок

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

Аудитория сайта может быть неоднородной, и вам будет сложно найти несколько слов, чтобы достучаться всех. KISSmetrics рекомендуют составлять заголовок, охватывающий 20–35% посетителей, которым продукт или предложение ближе всего.

Мы выбрали простую формулировку, максимально общо описывающую продукты компании. Это B2B-предложение, которое сразу даёт понять, чем мы можем быть полезны бизнесу при построении digital-маркетинговой стратегии:

Система сквозной аналитики, коллтрекинга и управления рекламой

Коллтрекинг

  • Отслеживайте все звонки с сайта с точностью определения источника рекламы выше 96%
  • Отслеживайте звонки с оффлайн рекламы и визиток с помощью статических номеров
  • Получайте чистый пул номеров, который выделяется именно вашей компании
  • Анализируйте подробные отчеты по звонкам: источник перехода, браузер, девайс, гео и другое
  • Слушайте записи звонков в удобном плеере для повышения качества работы колл-центра и отдела продаж

Подзаголовок

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

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

Размер заголовков и подзаголовков должен быть не менее 22 пикселей, а основного текста — не менее 14 пикселей.

Мы решили сделать акцент на том, что наша целевая аудитория — бизнес, и она многочисленна.

Нам уже доверились более 20 000 компаний

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

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

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

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

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

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

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

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

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

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

Вспомогательное изображение

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

Чтобы оптимизировать изображения для мобильных пользователей, используйте сжатые изображения. Причём сжаты они должны быть до загрузки на сайт — часто CMS сохраняют тяжеловесные картинки, просто номинально вписывая их в блок указанного размера. Кроме того, добавьте атрибут alt к изображениям на случай, если мобильное устройство пользователя блокирует любые изображения.

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

Преимущества

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

Делайте текст простым и удобным для чтения, говорите на языке своих клиентов.

Социальное доказательство

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

Кейсы — лучший формат, подтверждающий экспертизу B2B.

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

Навигация

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

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

Контентное предложение

Чтобы привлечь ещё больше потенциальных клиентов прямо с домашней страницы, предложите полезный контент:

  • Путеводитель или руководство;
  • Электронная книга;
  • Видеокурс.

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

Отличительные особенности

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

Опять же, соблюдайте лёгкую и ненавязчивую подачу.

Ресурсы

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

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

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

  • Простая демонстрация для посетителей, близких к покупке;
  • Кейсы и практические примеры для людей, которые заинтересованы, но хотят получить больше информации;
  • Ресурсы — видео, презентации, white paper — для тех, кто находится в начале воронки.

Показатели успешности

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

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

Оптимизация для мобильных устройств

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

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

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

Как сделать домашнюю страницу лучше

Простота — залог успеха

Сайты с простым дизайном имеют более высокие показатели конверсии.

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

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

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

Повысьте скорость загрузки

Скорость загрузки оказывает огромное влияние на показатели конверсии. Если сайт загружается слишком медленно, это приведет к потере конверсий.

Люди нетерпеливы. Сегодня в цифровую эпоху мы привыкли получать контент с молниеносной скоростью. Если сайт не загружается сразу, показатель отказов — bounce rate — может увеличиться.

Время загрузки страниц напрямую связано с их простотой.

Если на них размещены мегабайты изображений, длинные блоки текста, сложные динамичные меню, мигающие CTA и другие ненужные элементы, сайт будет загружаться очень долго.

Но бывает, что при всей простоте дизайна загрузка сайта всё ещё занимает значительное время.

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

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

Увеличение трафика на сайте и повышение конверсий легко окупят дополнительные расходы, как текущие, так и в долгосрочной перспективе.

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

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

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

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

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

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

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

Запускайте A/B-тесты

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

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

Один из лучших способов подобрать оптимальный дизайн для главной страницы — это A/B-тестирование, также известное как сплит-тестирование.

A/B-тест подразумевает запуск альтернативных версий одной и той же страницы с целью определить, какая из них имеет более высокий коэффициент конверсии. 50% трафика видит один дизайн, а остальные 50% — другой.

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

Люди, как правило, убеждены, что предложение, такое как скидка в 20%, поможет увеличить продажи и конверсии. Но как только они запускают A/B-тест, обнаруживают, что это в действительности не работает.

После того, как протестируете один элемент, измените что-то ещё и запустите другой тест.

Если сначала вы тестировали текст кнопки, то потом найдите оптимальный цвет. После этого — размер или размещение.

A/B-тестирование — это непрерывный процесс. Он должен продолжаться столько времени, сколько потребуется, пока вы не поймёте, что достигнут существенный результат.

Анализ результатов

Как понять, что страница оптимизирована и удобна для пользователей?

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

Часто изменение некоторого элемента страницы ведёт к повышению переходов, подписок, продаж. Нельзя с первого раза найти идеальное решение. Необходимо постоянно работать над дизайном и измерять эффект от нововведений.

Мастер Йода рекомендует:  Как работает CSS Flexbox наглядное введение в систему компоновки элементов на веб-странице

Используйте сервисы измерения скорости загрузки сайта — например, Pingdom Tools. В нём подробно описаны технические характеристики тестируемой страницы, время появления каждого простейшего элемента на странице.

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

Как лучше оформить главную страницу сайта? Даём рекомендации!

Здравствуйте, уважаемые читатели блога веб-студии «Три Дабл Ю»! Как вы считаете, что является «лицом» любого сайта? Думаю, многие из вас ответят верно – главная страница. Она потому и носит гордое название «Главная», так как определяет тематику веб-сайта, выделяет самую важную информацию и формирует общее впечатление о ресурсе.

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

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

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

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

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

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

Как же правильно оформить главную страницу так, чтобы сделать сайт более эффективным в плане взаимодействия с посетителями (другими словами – сделать его более «продающим»)? Уверен, что этот вопрос приходит к вам в голову, если вы активно участвуете в создании будущего веб-сайта. Далее вы найдёте несколько советов, которые, вполне возможно, вам пригодятся.

Предлагаю разобрать варианты оформления для разных типов ресурсов.

Сайт-визитка

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

Что же лучше разместить здесь на главной? Вы можете пойти путём большинства и поместить туда какой-то текст (который мало кто будет читать). А можете сделать главную страничку более интересной, превратив её в настоящий Landing Page, содержащий несколько блоков и форму заявки.

В чём преимущество такого подхода? Как показывает практика, landing page (посадочные страницы) имеют гораздо большую конверсию посетителей в покупателей (клиентов).

Совсем не обязательно делать этот лендинг слишком длинным – порой достаточно нескольких блоков, чтобы дать представление о деятельности фирмы и её преимуществах. Более подробно о структуре продающего landing page написано ЗДЕСЬ.

Корпоративный сайт

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

Размещая на главной «сухой» текст и делая слишком простое оформление, вы вряд ли кого-то заинтересуете…

Кстати, в виде лендингов можно сделать и внутренние страницы. Подробнее об этом написано в ЭТОЙ статье.

Главные страницы блогов обычно оформляются примерно одинаково и включают в себя:

  • Список последних опубликованных статей.
  • Подборку самых интересных и обсуждаемых публикаций.
  • Список всех рубрик.
  • Различные виджеты с полезной информацией.

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

Если вам необходимо сделать блог на WordPress, мы готовы предложить свои услуги. Подробности ТУТ.

Интернет-магазин

Что самое главное в любом интернет-магазине? Это – товар. Его и надо показывать на главной, забыв об отвлекающей и ненужной мишуре. Поэтому здесь в приоритете:

  • Блоки с рекомендованными и популярными товарами.
  • Блоки со спецпредложениями и скидками.
  • Отзывы от реальных покупателей (желательно с фото).
  • Понятный и удобный список всех категорий.
  • Прочая информация, которая поможет привлечь новых покупателей (к примеру, подарки, беспроцентная рассрочка, продлённая гарантия и т.п.).

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

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

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

Как оформить главную страницу сайта. Часть 1

Здравствуйте, друзья! Приветствую вас на моем блоге https://sidorevich.ru.

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

Расскажу о том, ЧТО должно быть на самой первой странице вашего сайта. Какие на ней должны быть элементы и блоки, чтобы посетитель (из вашей целевой аудитории, конечно), попав на нее, не ушел через 3-5 секунд. И не только не ушел, но чтобы остался, зачитался и, в конце-концов, кликнул по заветной кнопке КУПИТЬ уже на странице товара.

Понятно, что речь пойдет о средних интернет-магазинах. Для интернет-супер-моллов правила компоновки главной отличаются и об этом я упоминал в статье Легко исправимые ошибки, которые блокируют повышение конверсии вашего сайта

Договорились? Разбираем обычный интернет-магазин или корпоративный сайт с прикрученным к нему розничным интернет-магазином.

Вообще, к Главной странице относятся кто-во что горазд.

Одни ставят на нее как бы «заглушку» с картинкой или чаще с флешкой и «завлекательной» кнопкой «ВОЙТИ».

Другие стремятся впихнуть в неё чуть ли не весь контент сайта.

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

Четвертые определяют для себя наиболее важный, как им кажется, аспект их бизнеса и заостряют внимание на Главной только на нем.

Пятые являются комбинацией из этих четырех вариантов.

Какой из перечисленных подходов по-вашему верный?

Правильно – ни один!

Так как же оформить Главную страницу сайта правильно? Так, чтобы конверсия с неё была максимально возможной?

Я дам вам два набора элементов. Один — минимальный обязательный, второй — желательный, но его можно уже назвать ПРОДВИНУТЫМ. Если вы внедрите только минимальный набор — вы молодец. Если ещё и продвинутый — молодец вдвойне. Или даже в квадрате.

Минимальный набор элементов для оформления Главной страницы сайта

Краткое описание того, что представляет собой данный сайт

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

Получается у вас создать краткое описание длиной в одно предложение ?

Скорее всего ДА.

Тогда рассмотрите возможность внедрить это описание в шапку вашего сайта.

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

Уникальное Торговое Предложение

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

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

Буллит (в полиграфии и вебе) — маркер списка; типографский знак (обычно точка, звёздочка и т. п.), располагаемый в начале строки с элементом списка и используемый для выделения этого элемента.

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

Отзывы

Разумеется, на Главной не нужно размещать все +100500 отзывов, которые у вас, конечно, уже имеются на сайте в разделе Отзывы.

Если еще их столько нет. или совсем нет, то читайте статью Как получить отзывы от клиентов

На Главной разместите всего 2-3 отзыва клиентов о товаре/услуги приобретенной на этом сайте.

И 1-2 отзыва клиентов о компании. Желательно, чтобы они были.

Оформите отзывы либо многокадровым слайдером с автоматическим переключением через 10-15 секунд на следующий отзыв, либо блоком с 2-3 небольшими текстовыми отзывами со ссылкой внизу блока типа: « Все отзывы. » или « Смотреть больше отзывов. ».

Хорошо если у вас есть видеоотзывы. Тогда можно даже сделать 2 блока-включения в Главную. Один с текстовыми отзывами, другой с видеоотзывами.

Не знаете особенностей записи видеоотзывов? Читайте 23 совета как правильно снимать видео

Лучше сделать блок-вставку с видеоотзывами в виде превьюшек, чтобы они при клике вызывали всплывающее видео. Вот как здесь.

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

Сложно? Уже много всего? Ну а как иначе? Хотели узнать как оформить главную страницу сайта? Вот, пожалуйста.

Можно ли без части этих элементов? Считаю, что нет. Если хотите что-то продавать со своего сайта, то минимальный набор должен быть по любому.

Но давайте продолжим. Ведь это ещё не всё.

2-3 товара-приманки

Ну как без этого. Это классика. Обязательно разместите на Главной 2-3 самых интересных товара. Если у вас есть товар с очень интересной (читай низкой) по сравнению с конкурентами ценой – обязательно размещайте его. Вот так это может выглядеть.

Рекомендую на всех этих товарах, на их изображениях делать завлекающие пометки. Например, «Товар дня», «Товар месяца», «Акция», «Самый популярный товар».

Фишка: Если товар у вас ценой свыше 50 000 рублей, то «Товар дня» уже к нему не очень подходит. Естественнее будет выглядеть «Товар месяца».

Новости

Новости на Главной странице необходимы, так как выполняют следующие функции:

  1. Регулярно пополняемые новости обновляют контент Главной страницы, тем самым оповещая поисковые системы, что сайт живой. Чем чаще обновляются новости, тем, при прочих равных, выше поднимается сайт в выдаче.
  2. Чем чаще обновляются новости сайта, тем чаще заходит на него поисковый робот. Чем чаще заходит на сайт робот, тем быстрее вы сможете влиять на положение сайта в выдаче поисковой системы. Например, вы внесли изменения в контент или во внутреннюю оптимизацию сайта. Поисковая система должна (предположительно) позитивно отреагировать на это и поднять ваш сайт выше в выдаче. Есть разница, когда это произойдет – на следующий день или через месяц?
  3. Наличие новостей убеждает посетителя, что фирма жива, активно работает и этот сайт не брошенный в просторах интернета «мемориал». Конечно при одном условии – новости должны быть свежими. Оптимально добавление новостей 1-2 раза в неделю. Если новость добавляется реже 1 раз в месяц, то это скорее пойдет в минус. Хотя если вы займете новостями полностью одну из колонок и в ленте будет находиться несколько десятков новостей, пусть даже за несколько лет, то даже пополнение 1 раз в месяц будет восприниматься положительно.
  4. Посредством новостей привлекается внимание посетителей к:
    1. новым, только появившимся товарам,
    2. акциям,
    3. полезной информации, появившейся на сайте. Например, если вы ведете корпоративный блог, то разумно анонсировать новые посты в новостях.
  5. Улучшается поведенческий фактор. Посетитель кликает, переходит по ссылкам в новостях, читает контент, на который его отправляют короткие новостные сообщения.
Вид и расположение модуля новостей

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

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

Новостные поводы

Пишите о появлении новых товаров, об изменении свойств старых товаров.

Информируйте об акциях, конкурсах, о появлении в блоге или списке статей полезного контента.

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

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

Делать ли отдельную страницу новостей в дополнение к новостному блоку на Главной странице?

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

Но вот в случае, когда новостной блок на Главной переполнился, тогда можно подумать и об отдельной странице с новостями. Но аккуратно. Там посетитель будет ожидать развернутую новость, а не её краткий анонс. Если он будет разочарован в малом, то это может закончится для вас тем, что он не сделает у покупки на вашем сайте. Оно вам надо?

Статьи

Статьи – важная часть повышения конверсии на сайте. Статьи отличаются от новостей тем, что:

  1. сами по себе являются полезным контентом и информационным поводом,
  2. не обязаны иметь сиюминутную актуальность,
  3. «приспособлены» для создания контента свыше 1000 знаков, например. Что почти невозможно сделать для новостей.

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

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

Как писать статьи

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

Пишите сами или нанимайте копирайтера. В случае низкоспецифичного бизнеса копирайтера найти легче.

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

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

Размер статьи должен быть не меньше 2500 знаков. Короткие тексты не учитывается Яндексом в плюс сайту. Слишком длинная статья имеет только один минус – труднее сделать так, чтобы ее до конца дочитали посетители. Но можно. Если знать как. Это отдельная тема, конечно. Зато чем длиньше правильно сделанная статья, тем больше пользы она принесет и для конверсии, и для SEO.

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

Пишите как можно более короткими предложениями и короткими (3-5 предложений) абзацами. Применяйте чаще подзаголовки. Списки применяйте по возможности не больше 5 пунктов.

Заголовки статей делайте интригующими, но не эпатажными (как в стиле тизерной рекламы). Старайтесь, чтобы по заголовку было понятно, о чем статья.

Тщательно проверяйте текст на опечатки, орфографические и грамматические ошибки.

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

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

На этом на сегодня сделаю паузу. Думал, уложусь странички в 4, но даже не успел еще дойти до конца обязательных элементов — минимального набора для Главной страницы, а уже, смотрю, текста много.

Перенесем остальное. Сделаю статью из нескольких частей. Вот, тут будет вторая часть Как оформить Главную страницу сайта. Часть 2

Рассказать кратко – статья будет не пригодная для самостоятельного внедрения вами.

И, всё-равно, как бы не хотел, все фишки не «впихаю» сюда. Что-то мог элементарно не вспомнить, упустить. Некоторые фишки «тянут» на отдельные статьи.

Так что – внедряйте, ЧТО тут обнаружили и чего у вас на главной еще нет.

Будут вопросы на тему как оформить главную страницу сайта правильно – задавайте в комментариях.

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

Каждый пользователь всемирной сети посещает сотни, тысячи различных сайтов. Каждый из них, заходя на неизвестный ему сайт, уже примерно знает, что его там ждет — главная страница. С неё всегда всё начинается. Именно поэтому она должна соответствовать ожиданиям так называемой «нулевой» публики, то есть людей, впервые зашедших на ваш сайт.

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

Дизайн

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

  1. Цвет
    Выбор цветовой гаммы – важный этап в создании как сайта в целом, так и его начальной страницы. Цветовое решение должно подходить тематике вашего сайта, отображать его суть. К примеру, на развлекательных сайтах вы чаще встретите яркую палитру, в онлайн-кинотеатрах в большинстве случаев преобладает темная гамма оттенков, что не мешает просмотру, на официально-деловых сайтах большинства государственных ведомств в большинстве случаев преобладают белый и черный цвета, что придает дипломатичности. Есть основное правило – всё цветовое оформление должно состоять из пяти сочетающихся оттенков. Это правило поможет выдержать графическое оформление страницы в нужных границах
  2. Логотип
    Не лишним будет и наличие логотипа. Эта небольшая деталь очень на самом деле очень важна. Логотип поможет создать между посетителем и начальной страницей ассоциативно-визуальную связь. Однако не стоит применять к своему лого излишнюю изобретательность. Зачастую, большинство логотипов просты, как, например, ВКонтакте или Яндекс.
  3. Оформление
    Красивое оформление сайта — одно из основополагающих факторов, привлекающих аудиторию. Что касательно основной страницы сайта – для неё характерна некоторая сдержанность и осуществление визуального контакта. Выражаясь проще, стартовая страница должна больше показывать, чем говорить. Не нужно много текста, ограничьте описание главной страницы сайта до минимума. Подыщите подходящие, по смыслу и общему стилю фото и украсьте ими фон. Практически обязательно наличие списка навигации – небольшого перечня основных разделов вашего сайта, расположенного справа/слева вертикально или вверху вертикально. Рекомендуется его не усложнять и использовать максимально упрощенный вариант списка – так новоприбывшему пользователю будет проще ориентироваться.Удачные примеры оформления можно с легкостью найти в сети и использовать их, комбинируя между собой.

Информативность

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

Для удобства можно провести аналогию с любым хорошим бутиком или магазином. Заходя в гипермаркет вы не увидите груду товаров, хаотично сваленную в одну огромную кучу. Каждый отдельный товар будет лежать на своей полочке. Все взаимосвязанные товары будут объединены в группы, и, в свою очередь, каждая группа товаров будет соответствовать разделу, в котором они размещены. Любая информация на вашем сайте должна быть представлена по схожему принципу:
раздел – группа/категория – информация, входящая в эту категорию.

В конечном итоге получается структурированная цепочка, похожая на адрес папки в вашем компьютере, то бишь от большего к меньшему. В качестве примера:
Категория «Наука» — Раздел «Физика» — Тема «Термодинамика» — Статья «Термодинамические явления в природе».

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

Заключение

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

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

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

Всё перед вашими глазами, друзья. Работайте усердно, учитесь и наблюдайте.

Оформление главной страницы сайта – Как правильно оформить главную страницу сайта

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

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

Какие задачи решает главная страница

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

Идеальная главная страница должна обладать следующими характеристиками:

    Информативность. На главной посетитель должен найти короткий и четкий ответ на ряд вопросов:

    Общую информацию о бизнесе (что это за компания/сайт).

Общую информацию о продуктах (что здесь можно купить).

Информацию о выгодах (почему стоит сотрудничать с этой компанией и покупать ее продукт).

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

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

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

    Юзабилити и функциональность. Главная должна быть интуитивно понятной и простой в использовании. Удобная навигация, формы регистрации и авторизации, возможность заказать обратный звонок, адаптация к мобильному трафику, возможность купить некоторые продукты с главной, — вот только некоторые компоненты, делающие страницу юзабильной и функциональной. При этом главная не должна быть перегружена контентом, элементами управления и функциональными блоками.

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

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

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

Как оформить логотип

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

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

Какой должна быть навигация

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

Иногда инновации вредят эффективности. Обратите внимание на это меню навигации:

Подробнее о навигации читайте в нашей статье.

Нужен ли футер

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

Каким должно быть ценностное предложение

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

    О чем этот сайт, какой бизнес он представляет?

Что можно приобрести на этом ресурсе?

Почему это выгодно, каковы преимущества перед конкурентами?

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

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

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

К сильным сторонам этого варианта изложения относятся:

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

Описание сервиса подчеркивает его преимущества. Оно короткое и информативное.

Изображение удачно вписывается в концепцию страницы.

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

Банк «ТКС» не нуждается в представлении. Поэтому ценностное предложение акцентировано на флагманском продукте организации. К преимуществам этого способа изложения относятся:

    Лаконичное описание преимуществ.

Отсутствие лишней информации.

Ориентация на немедленную конверсию.

Помогите посетителю выбрать наиболее желаемое для вас действие

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

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

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

Изображения на главной

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

Можно написать о красоте дома, его удачном расположении и уютных комнатах. А можно показать все это с помощью фото.

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

Оформление главной — это бесконечный процесс

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

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

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

Что должно быть на главной странице сайта? Важные элементы оформления.

Что отталкивает пользователей от главной страницы сайта?

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

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

  1. Информативной. Заходя на сайт, посетитель сразу же должен получить на первой странице короткие и четкие ответы на вопросы:
    • Что это за сайт?

Что здесь можно найти?

Можно ли доверять этой компании?

Чем этот сайт лучше других?

Что делать дальше?

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

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

Удобной и функциональной. Информация и ссылки на главной странице должны быть расположены грамотно, чтобы посетителю было удобно пользоваться ресурсом. Интуитивно понятная навигация, контакт для обратной связи, популярный контент\товар и возможность его заказать непосредственно с главной страницы, адаптированный дизайн сайта — вот только некоторые элементы, которые делают страницу удобной. Но при этом всего должно быть в меру, поскольку перегруженная контентом и функциональными блоками страница отпугнет пользователя.

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

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

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

Важные элементы оформления: что должно быть на главной странице сайта?

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

Навигация

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

Пример главной страницы сайта с удачной навигацией:

Если это интернет-магазин, рекомендуем оформить на главной странице небольшой каталог с наиболее популярными товарами, скидками и/или новинками. Если это информационный портал, то это могут быть ссылки на наиболее популярные статьи, последние материалы и т. п. Например:

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

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

Графический контент

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

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

Сравните следующие главные страницы сайтов:

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

Текст

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

Целевые кнопки

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

Что отталкивает пользователей главной страницы сайта?

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

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

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

требование регистрации. Никто не захочет тратить свое драгоценное время, чтобы зарегистрироваться на Вашем сайте. Разве что ради внушительной скидки;

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

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

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

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

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

Оформление главной страницы сайта — это процесс практически бесконечный. Если Вы думаете, что можно один раз постараться и после этого забыть о проблеме, то Вы глубоко заблуждаетесь. Главная страница должна постоянно развиваться и совершенствоваться. Чтобы оставаться востребованным и не терять клиентов, следите за тенденциями в копирайтинге, юзабилити и SEO, используйте Вебвизор, чтобы понимать поведение и потребности посетителей Вашего сайта. Анализируйте популярность различных информационных блоков с помощью инструментов Яндекс.Метрики и удаляйте некликабельные элементы, заменяя их другими материалами.

Как оформить главную страницу сайта: 11 ценных рекомендаций

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

Содержание этой статьи:

Кстати! На тренинг ко мне приходят все, кто хочет запустить собственный проект. Личный сайт – это отличная возможность заявить о себе и получить надежный источник стабильного и, фактически, неограниченного заработка. Тренинг – бесплатный. Он идет всего 4 дня, а по его завершению у каждого участника – свой готовый сайт с первыми посетителями.

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

Ответ на вопрос «Главная страница сайта как оформить?» зависит от нескольких факторов. В частности, следует учитывать, какую основную цель преследует сайт:

  • продает;
  • предлагает услуги;
  • делится информацией и т.д..

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

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

Главная страница сайта как оформить её правильно, по пунктам

1. Информативность

Читайте также: Руководство для новичков: как в 5 шагов раскрутить сайт и ничего не забыть

Попадая на первую страницу, пользователь должен без труда найти основную информацию:

  • что именно предлагает сайт;
  • чем занимается компания;
  • какие продукты или услуги доступны клиентам;
  • какую выгоду они получат от их использования;
  • контактные данные.

2. На одной «волне» с ЦА

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

3. Ценность предложения

Необходимо максимально лаконично рассказать о выгодах сотрудничества. Для этого не обязательно использовать только текстовое описание.

4. Функциональность и юзабилити

Читайте также: Как проверить сайт на ошибки: 5 важных правил

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

  • понятная навигация;
  • удобная регистрация и быстрая авторизация;
  • форма для заказа обратного звонка;
  • кнопка целевого действия.

Совет! Избегайте чрезмерной перегрузки контентом, визуальными элементами. Все это приведет к невосприимчивости главной информации.

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

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

6. Изменяемость

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

  • анонсов;
  • коммерческих предложений;
  • новостных заметок;
  • списка предлагаемых продуктов и т.д.

7. Приятный дизайн

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

8. Логотип

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

Идеальный вариант размещения – левая верхняя часть экрана. Так пользователям привычнее.

9. Понятная навигация

Читайте также: Контент стратегия: 12 шагов к ее созданию

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

Меню чаще всего двух видов – вертикальное и горизонтальное. Расположение кнопок у них – практически идентичное. Например, кнопка «Контакты» находится в правой части экрана в горизонтальном меню или в нижней части вертикального меню.

Не пытайтесь выделиться на навигации. Здесь придерживайтесь принятых «стандартов».

10. Помощь в выборе действия

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

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

Если их все-таки несколько, визуальным оформлением выделите наиболее важное для вас. Таким образом, вы ненавязчиво покажите пользователю, что именно ему нужно сделать. Добиться этого можно следующим образом:

  • сделать кнопку другого цвета;
  • изменить шрифт;
  • поменять форму кнопки и т.д.

А еще – просто поместить его в центре. Не обязательно всей страницы, а конкретного «экрана».

11. Изображение

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

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

Как оформить главную страницу: личный совет

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

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

15 гениальных примеров главной страницы сайта

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

Что делает главную страницу привлекательной? Как получить высокую конверсию и низкий коэффициент отказов? Как оформить главную страницу блога? Каковы удачные примеры текстов о компании? В этой статье вы найдете ответы на эти вопросы.

На любой главной странице должны быть следующие элементы:

  • Ясный ответ на вопросы пользователя: «Кто вы?», «Что вы предлагаете?» и/или «Что я могу сделать здесь?». Ваша компания ​​должна ответить на эти вопросы так, чтобы каждый посетитель понял, что оказался в нужном месте. Если пользователи в течение нескольких секунд не смогут найти ответ на поставленные вопросы, следующий их шаг — это отказ!
  • Резонанс с целевой аудиторией. Главная страница должна говорить с целевой аудиторией на ее языке. Старайтесь избегать «корпоративной абракадабры» и устраните все лишнее и отвлекающее.
  • Ценное предложение. Заголовок и еще раз заголовок! Выразите смысл своего товара или услуги в одном предложении так, чтобы у пользователей не возникло желания поискать что-то получше у ваших конкурентов. Решение проблемы — вот о чем необходимо писать; не нужно перечислять технические составляющие оффера.
  • Юзабилити. Все страницы, показанные ниже, очень удобны: на них легко ориентироваться, на них нет «кричащих» объектов, например, флэш-баннеров, анимаций или других чрезмерно сложных и ненужных элементов. Многие также оптимизированы для мобильных устройств, что очень важно в современном веб-маркетинге.
  • Призыв к действию (СТА-элемент). На каждой из 15 примеров главной страницы эффективно использованы первичный и вторичный СТА-элементы. Они направляют посетителей к следующему шагу. Например, «Бесплатная пробная версия», «Купить сейчас» или «Подробнее». Помните, что цель главной страницы — удержать посетителей на вашем сайте и провести их до конца воронки конверсии.
  • Общий дизайн. Хорошо продуманная страница — залог успеха в воспитании лояльности пользователей к бренду, настройке связи с целевой аудиторией и продвижении пользователей в воронке конверсии.
  • Не останавливайтесь на достигнутом. Если вас устраивает коэффициент конверсии вашего ресурса, знайте, что его можно увеличить на 10-50% с помощью несложного сплит-теста главной страницы.

2. Золотая семерка: lp пример с удачным оформлением отзывов

3. CloudPassage: видео на главной странице

5. Aweber: пример хорошей текстовой страницы

7. Evernote.com: пример страниц описания сайта

9. Tribal Media: образец для панорамы на главной странице

11. Basecamp: сайт с удачной лид-формой

12. Eventbrite: новость на главной странице

13. GoodData: удачная картинка на главной странице сайта

1. FreshBooks

Этот пример главной страницы сайта html гениален, потому что:

  • Удачно использовано сочетание цветов и эффективно расставлены СТА-элементы.
  • Очень заманчивый текст на СТА-элементе: «Попробуйте бесплатно в течение 30 дней».
  • Эффектный подзаголовок: «Для более 5 миллионов людей, использующих FreshBooks, финансовая отчетность теперь не проблема». Это заявление привлекательно для целевой аудитории, потому что освоение бухгалтерского программного обеспечения, как правило, мучительно сложно для фрилансеров и владельцев малого бизнеса.

2. Золотая семерка: lp пример с удачным оформлением отзывов

Это гениально, потому что:

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

3. CloudPassage: видео на главной странице

Это гениально, потому что:

  • Четкий и чистый дизайн страницы. Текстовый контент, точно передающий суть деятельности CloudPassage. Вот как на главной странице сайте разместить вместо фото презентацию или видео, закрепляя послание (месседж, message) с его помощью.
  • Только один направляющий призыв к действию. Чтобы у пользователей не оставалось сомнений, ниже указаны два сообщения: «Без кредитных карт», «Без обязательств».

4. Box

Это гениально, потому что:

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

5. Aweber: пример хорошей текстовой страницы

Это гениально, потому что:

  • Текстовая страница с сильным заголовком «7 причин подписаться на рассылку бесплатных советов по емейл-маркетингу» сообщает посетителю о множестве бонусов и предъявляет социальные доказательства.
  • Данная страница повысила процент подписок на рассылку на 321%.

6. Carbonmade

Это гениально, потому что:

  • Оригинальная и забавная графика наглядно демонстрирует, на что способны специалисты этой компании.
  • Цифры и краткий, но емкий список преимуществ выглядят очень убедительно.
  • Красивая интеграция меню с иконками. Значки главной страницы для сайта, разделов «О нас», «Примеры работ» и «Цены» вызывают улыбку и запоминаются.

7. Evernote.com: пример страниц описания сайта

Это гениально, потому что:

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

8. Unlocking

Это гениально, потому что:

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

9. Tribal Media: образец для панорамы на главной странице

Это гениально, потому что:

  • Впечатляющая городская панорама в хедере главной страницы привлекает максимум внимания. Как сделать картинку для главной страницы сайта? Вы не прогадаете, если последуете примеру Tribal Media.
  • Сила заголовка — в отсутствии лишних слов.

10. eWedding

Это гениально, потому что:

  • Главная страница включает в себя только самые необходимые элементы и ничего лишнего.
  • Отличный заголовок и убедительный призыв к действию, который уменьшает сомнения благодаря тексту: «Создайте свой ​​бесплатный свадебный сайт за 5 минут». Простой нтмл 5. Пример кода главной страницы будет предоставлен клиенту.

11. Basecamp: сайт с удачной лид-формой

Это гениально, потому что:

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

12. Eventbrite: новость на главной странице

Это гениально, потому что:

  • Заголовок на главной странице «Если что-то происходит, здесь вы об этом узнаете» работает потому, что любопытство всегда двигало деятельностью людей.
  • Интересный подзаголовок. В нем пользователям предлагают либо просмотреть тысячи событий, либо создать собственное событие и продавать на него билеты.
  • Яркое праздничное фото, лаконичный дизайн, новости на главной странице, повествующие о грядущих интересных событиях, усиливают эффект.

13. GoodData: удачная картинка на главной странице сайта

Это гениально, потому что:

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

14. TechValidate

Это гениально, потому что:

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

15. Endeavor.org

Это гениально, потому что:

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

Высоких вам конверсий!

По материалам: blog.hubspot.com

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

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

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

Подпишись на рассылку и получи книгу в подарок!

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Подвал

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

Советы

Не перегружайте

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

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

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

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

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

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

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

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

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

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

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

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

Итоги

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

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

Главная страница сайта: как сделать и оформить — лучшие примеры

  • Новости
  • Интернет-маркетинг
  • PPC
    • Блог Google Adwords
    • Обновления Google Adwords
    • Блог Яндекс Директ
    • Обновления Яндекс Директ
  • SEO
    • SEO кейсы
  • SMM
    • YouTube
    • Блог о ВКонтакте
    • Обновление ВК
    • Блог про Facebook
    • Обновления Facebook
    • Блог про Twitter
    • Блог про Инстаграм
    • Обновления в Instagram
    • Блог про Одноклассники
    • Обновления в Одноклассниках
    • Таргетированная реклама
    • Яндекс.Дзен
  • Ещё
    • Брендинг
    • Веб-аналитика
      • Блог Google Analytics
      • Блог про Гугл Вебмастер
      • Обновления в Гугл Вебмастер
      • Блог про Яндекс Вебмастер
      • Обновления Яндекс Вебмастер
      • Блог Яндекс Метрики
      • Обновления Яндекс Метрики
    • Дизайн
    • Контент-маркетинг
    • Мессенджеры
    • Продажи
    • WordPress
  • Услуги
    • SEO & MARKETING
    • Продвижение на рынке B2B
  • Блоги
  • Спецпроекты
    • Click.ru
    • PromoPult
    • ukit
  • Реклама
  • ⚡ Сервисы

Секреты эффективных объявлений в контекстной рекламе

Agile-методология: что это такое, принципы и внедрение

Конструкторы писем для email рассылок: лучшие бесплатные и платные сервисы

Мультилендинг: что это такое и как его сделать

Как получать сильные ссылки и не попасть под санкции ПС: пошаговая…

PPC

    ВсеБлог Google AdwordsОбновления Google AdwordsБлог Яндекс ДиректОбновления Яндекс Директ

    Секреты эффективных объявлений в контекстной рекламе

    Реклама без сайта: простые решения для компаний, у которых бизнес есть,…

    Форматы рекламных объявлений в Яндекс.Директе и Google Ads

    Профессия специалист по контекстной рекламе. Или кто такой директолог и что…

SEO

    ВсеSEO кейсы

    10 лучших SEO-модулей для OpenCart: бесплатные и платные

    Идеальная SEO оптимизация страниц сайта: пошаговая инструкция

    Как подготовить статью к публикации на внешнем ресурсе, СМИ, портале

    Как получать сильные ссылки и не попасть под санкции ПС: пошаговая…

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

    Автор LANCIO Рубрика Блог Дата Октябрь 31, 2020

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

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

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

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

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

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

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

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

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

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

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

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

    Мастер Йода рекомендует:  5 особенностей языка Java, о которых вы должны знать
Добавить комментарий