Как должна выглядеть главная страница интернет-магазина? Структура + примеры
Главная страница — это лицо сайта и оно должно быть в полном порядке. Особенно, если речь идет об интернет-магазине. SEO-специалисты Bquadro собрали основную информацию о том, как должна выглядеть главная страница интернет-магазина, ее структура и примеры наполнения с позиции SEO.
Мы в Bquadro более 19 лет занимаемся разработкой и продвижением сайтов (в том числе SEO, например, здесь рассказываем про классическое продвижение промышленного сайта)
От того как выглядит главная страница интернет-магазина зависит продолжит ли пользователь знакомство с брендом и, как следствие, уровень продаж. Здесь важен не только дизайн, но и структура — наличие и корректный порядок нужных блоков положительно влияют на позиции в поисковой выдаче.
В целом, главная страница должна отвечать на вопросы:
- Что продают?
- Кто продает?
- Как купить?
Правильная структура:
Шапка или хедер
- Меню
- Промо-блок с акциями и спецпредложениями
- Блок «Повышение лояльности» с отзывами, лицензиями, сертификатами, наградами и пр.
- Информационный блок с основными ключевиками и преимуществами компании
- Футер
А теперь подробнее разберем каждый из этих пунктов.
Шапка
Шапка сайта (она же хедер) — первое, что видит посетитель ресурса. Она помогает сориентироваться пользователю где он находится и следует за ним на всех страницах ресурса.
Элементы шапки:
- логотип компании
Располагаем в левом верхнем углу сайта. Его площадь не должна занимать более 20-25% всего хедера. Рекомендуем «зашить» в него ссылку на главную страницу (на большинстве сайтов делают именно так, поэтому пользователи уже привыкли к такому сценарию.) - краткая информация о компании
Здесь можно написать о деятельности компании или специфике сайта. Это также поможет пользователю сориентироваться и понять, а туда ли он попал. Например: «интернет-магазин одежды”/”Оборудование для лазерной обработки материалов»
телефон
Его место справа или в центре. Можно разместить один основной номер (например, 8-800…), настроить автоматическое отображение номера для отдельных регионов (актуально, если ваш магазин работает по всей стране или миру) или сделать раскрывающийся список с выбором подходящего номера. Не забудьте подключить набор номера, чтобы пользователь мог позвонить вам при нажатии на номер телефона.- корзина
Во-первых, это подтверждение того, что ресурс — интернет-магазин. Во-вторых, неплохой психологический ход. «Ваша корзина пуста! Наполните ее скорее» — как бы намекает, что пора наполнить ее товарами с сайта.
Для ранжирования по коммерческим факторам важным будет добавление следующей информации и функционала:
- часы и график работы;
- адрес компании;
- заказ обратного звонка;
- поиск;
- блок «О компании”, «Контакты», “Доставка и оплата»;
- вход в «Личный кабинет” и “Регистрация».
Но не рекомендуем сильно нагружать шапку. Помните о фирменном стиле и лаконичности. Если не можете решить какую информацию добавлять — посмотрите интернет-магазины популярных брендов в вашей нише и ориентируйтесь на привычки именно вашей целевой аудитории. В разных сферах они могут отличаться.
Меню
Этот блок также отвечает за навигацию на ресурсе. В меню обязательно размещаем ссылки на разделы каталога, новинки, акции. Если в хедер не поместились ссылки «О компании”, «Контакты» и “Доставка и оплата», смело добавляйте их в меню.
Можно сказать, что шапка и меню логично дополняют друг друга, создавая полноценный навигатор по сайту.
Промо-блок
Именно здесь мы размещаем промо-материалы. Свежие акции, спецпредложения, информация о конкурсах — все сюда!
Обычно промо-блок представляет собой слайдер с 3-5 рекламными баннерами. Его можно листать вручную и настроить автоматическое пролистывание.
Кроме этого, сюда можно добавить каталог с товарами. Выбирайте основные позиции, которые наверняка заинтересуют целевую аудиторию и размещайтесь со ссылкой на карточку товара.
Какие товары размещать на главной:
- самые популярные на вашем сайте;
- самые выгодные, по сравнению с конкурентами;
- уникальные товары, которые есть только у вас;
- интересные новинки в вашей нише.
Блок «Повышение лояльности»
Как уже написали выше, в этом блоке размещаем отзывы, сертификаты, награды, лицензии и другую информацию, которая помогает увеличить лояльность пользователей. Другими словами: все то, что подтверждает ваш профессионализм и помогает посетителю сделать выбор в вашу пользу.
Информационный блок
В этот блок можно «посадить» ключевые слова, рассказать о своей компании и основных преимуществах.
Кроме этого, сюда можно добавить раздел с новостями индустрии и компании, блог со статьями, анонсы предстоящих мероприятий.
Футер
Или нижняя часть страницы сайта. Его еще называют «подвал».
Можно точно сказать, что футер — неотъемлемая часть любого сайта и он важен вне зависимости от специфики сайта. Но в случае с интернет-магазином, подвал становится полноценным инструментом продаж: он работает с уже «теплыми» посетителями, стимулирует их на продолжение знакомства с сайтом и дальнейшим заказам.
Что должно быть в футере:
- Ссылки на страницы сайта
Помогите пользователю найти ответы на свои вопросы. Разместите здесь информацию о доставке, оплате, компании, возвраты и обмен товара и т.д. Вариантов размещения ссылок несколько: отдельные страницы, которые отвечают на основные запросы вашей ЦА или ссылки на основные разделы сайта; - Контактная информация
Здесь будет уместно продублировать информацию из шапки, но футер позволяет разместить больше данных. Поэтому, можете смело добавлять дополнительные номера и не забудьте про ссылку на страницу «Контакты» - Call-to-action
Или форма обратной связи. Футер — самое логичное место размещения кнопки призыва к действию. Пользователь уже зашел, уже ознакомился с основной информацией и теперь хочет связаться с вами — а кнопка уже здесь! Ждет его и как будто шепчет «Нажми на мен…. » - Ссылки на ваши социальные сети
Во-первых, это повышает лояльность и вовлеченность молодой аудитории, которой удобнее получать информацию из соц. сетей. Во-вторых, связь сайта с социальными сетями и последующая работа бренда в соц. сетях (отзывы, комментарии и т.д.) положительно влияют на позиции сайта в поиске (частично прорабатываются пункты «Добросовестность” и “Авторитетность» принципа E-A-T от Google. Основные требования можно прочитать здесь) - Политика конфиденциальности
Наличие страницы с прописанными правами и возможностями сайта, порядок использования предоставленных контактных данных — обязательное условие. Это помогает избежать ряда проблем с законом и пользователями. А еще это повышает доверие со стороны посетителей интернет-магазина. - Логотипы и бренды
Говорить об известных партнерах — правильно. Сотрудничество с популярными брендами «прокачивает» доверие пользователей, повышает вас в глазах потенциальных клиентов и одновременно помогает им сориентироваться в общей массе товаров (например, когда ищут вещи определенного бренда). На некоторых ресурсах логотипы партнеров выносят в отдельный блок. Это также допустимо, но может отвлечь от промо-материалов и преимуществах вашего интернет-магазина. - Возраст сайта
Еще один показатель, влияющий на лояльность и доверие пользователей. А также подтверждение надежности интернет-магазина.Стандартный формат: XXXX – YYYY, где XXXX – год запуска сайта (открытия интернет-магазина), а YYYY – текущий год.Не забывайте обновлять значение YYYY, в противном случае, пользователи могут подумать, что сайт заброшен и все труды пойдут насмарку.
Самое важное
Если сложить все вышеперечисленные блоки, получится вот такой макет:
Разумеется, не стоит забывать про наполнение и визуальное оформление. Пишите просто и понятно, показывайте (и продавайте) качественные товары, не забудьте про общую дизайн-концепцию сайта и то, что главная страница — хоть и важная, но все-таки часть сайта. Используйте качественные графические элементы и адаптируйте сайт под мобильные устройства. И помните: каждый сайт требует индивидуального подхода. Шаблоны и структура — основа, которая помогает облегчить процесс создания, но полностью его не исключает.
Хорошая статья и все по делу, нет воды. Порадовало возможность скачать шаблон. Спасибо.🤝
Вы хоть что нить читать пытались? А смотреть?? Шаблон вам? Да их в инете - любой магазин!!!
Хотя, что распинаться, это ж группа поддержки Маши и Жанны.... 🤣🤣🤣🤣
Так так так... Увидела своё имя и не поняла: а я тут каким боком, а?
Поподробнее с этого места, молодой человек. Или вы, как очередной недотролль гадите и испаряетесь?
Жанна, ну а то не видно, кто плюсует Маше)))
И? Других там имён нет? Если только это ваше объяснение - то... Ну как бы да, очередной недотролль, который не может нормально аргументировать свою позицию. Окей.
Я не тролль))
Ваш коммент, буквально: "комментарий ради комментария", адресованный пользователю 'привет', говорит сам за себя)))
За молодого, спасибо!)))
Далее, ничего не гадил. Маша написала, как в лужу пукнула. Море - синее!!! И все кинулись плюсовать.... Что, зачем, кому... ? Ей плюсиков набрать нужно?)))
Камон, выдыхайте. Иначе скорую вызывать придётся, чего то прям сильно эмоционируете.
Там же написано - для новичков. А, ну и да, лично я (имхо) не нашла подобный шаблон.
Вишенка на торте - а че, вы где то на vc видели супер уникальную статью? Вроде здесь сидят разные люди, с разным уровнем знаний.
Написали вредное что то? Вроде нет. Так че залупаться то (извините за жаргон)?
По жаргон, не дай бог мне начать так писать))
По сути, "Машенька" накорябала нерелевантную заголовки статью. Что угодно, ui, ux, маркетинг, но никак, блядь не seo она описала.
На SEO в этой статье и намёка нет.)))
Там выше в комментариях писали же, что SEO это не только про оптимизацию текста.
Да и тот материал, что я читала (опять же имхо, не претендую на супер знания) - очередность блоков, их наполнение, также имеет значение.
Забудьте слова "имхо", "камон". Либо извольте изъясняться нормальной лексикой, либо будьте на самом деле СПЕЦИАЛИСТОМ.
По тому что вы читали - Википедия в помощь, шо есть такое SEO. Разжевывать детям понятие поисковой оптимизации я не собираюсь. Вам рекомендую - смените источники. Иначе будет у вас не SEO, а обычная ЖОПА.
И не забываем читать Google, руководство для асессоров.
Эм... Вы, незнакомый человек, некто из интернета пишущий гадости и никак не аргументирующий свою позицию, будете мне указывать как изъясняться?
Ничего не перепутали, дедушка?)))
И порекомендую вам - вылезайте из Википедии и пещеры. SEO уже давно больше, чем просто работа с ключевиками. Проработка пользовательского опыта - одно из трендов в SEO 2020 года.
Модное слово, "тренды", что значит? Именно слово "тренд"? Только быстро ответь.
И что оно значит в SEO, раскроешь?)))
Только быстренько, без литературы!))
Откройте википедию, дедушка 😉
Блин, мне не надо, я знаю!)) а вот вы, знаете?))
Проработка пользовательского опыта... Вы хоть представляете что это и по каким метрикам оценивается?)))
При чем сеошник и дизайн магазина?))) вы пытаетесь смешать эти понятия, потому что далеки и от первого и от второго.
И это не "гадость", это истина)))
Ох... Я не сторонник дискуссий «ни о чем». Все то, что вы написали - даже не глупость, а настоящее вредительство. SEO - это инструмент для продвижения. И здесь важно абсолютно все: от структуры страницы до ее наполнения (не говорю уже о метатегах и пр. Тут и так понятно)
Из ваших комментариев не видно, что вы эксперт. И на вашем профиле нет ни одной статьи, которая бы могла подтвердить вашу экспертность. Поэтому далее продолжать пустой разговор не намерена и пойду, пожалуй, займусь полезными делами.
А вам советую почитать свежие материалы по SEO и все таки выйти из пещеры. Не википедией единой, знаете ли.
Удачи!
Жанна, идите. С богом.))
На вашем профиле тоже нет статей)))