На сегодняшний день, есть основные 3 причины для редизайна интернет магазина, в прочем, как и для любого сайта:
- Наличие украинского языка (Для Украины). Он должен быть главным на сайте.
- Отсутствие удобной мобильной версии сайта. До 80% посещений сайтов сегодня уже происходит на смартфонах. Для всех них!
- Отсутствие удобной и понятной структуры сайта/магазина. Для интернет-магазина — это особенно важно, так как чаще всего требуется найти 1 конкретный товар из тысяч.
В этой статье подробно рассмотрим проблему и задачи по третьему пункту — как создать удобную навигацию по сайту, что и есть структурой сайта.
Удобная навигация по сайту — правильная структура сайта
Структура любого сайта определяется «меню». Структура интернет-магазина определяется меню и фильтрами. Как правило, товары имеют огромное кол-во характеристик и свойств. Именно из них мы должны сформировать:
- меню, которое состоит из категорий и подкатегорий,
- фильтра — более тонкие настройки по характеристикам товара.
Если предполагается, что в интернет магазине будет продаваться какой-то простой товар, то сформировать меню и фильтра довольно просто. Так же, это просто сделать, если магазин специализируется на каком-то одном виде товаров, например, одежда или телефоны.
Но, если интернет магазин специализируется на широком спектре товаров, то определить категории, подкатегории и два-три-пять фильтра — это становится порой непосильной задачей.
Например, если это будет магазин электроники и там будут продаваться телефоны, компьютеры, бытовая техника, товары для спорта и многое другое, как в известном нам магазине Allo. Или, например, в интернет магазине для рыбалки могут продаваться приманки, удилища, одежда и даже посуда. Именно работа над последним сайтом из примеров сподвигла меня на написание этой статьи.
В чем сложность создания структуры интернет магазина?
На самом деле, за словом «Структура» стоит много задач:
- Зайдя на главную или любую другую страницу, человек должен найти желаемый товар максимум в 3 клика.
- Ссылки должны быть ЧПУ — желательно короткие (не более 3-х уровней) и понятные.
- Любой человек, даже ваша бабушка, зайдя в интернет магазин должна легко понять логику навигации.
- На карточках товара могут быть дополнительные разделы: «сопутствующие товары», «рекомендованные товары» или «с этим товаром часто ищут». Техническая реализация (то, что делают программисты) часто ограниченна возможностями движка и финансовыми возможностями заказчика. И об этом нужно подумать еще до того, как дизайнеры начнут отрисовывать дизайн, а не, когда ТЗ пишется программистам. И не дай Бог, чтобы эта проблема вылезла, когда контенщик наполняет сайт.
- Нужно учитывать, что сегодня 80% посещаемости интернет магазина будет на смартфонах. Это означает, что очень сложное меню и фильтр надо сделать очень простым для навигации.
- Если вы планируете писать SEO статьи в категориях, то важно помнить, что их можно написать именно на страницах категорий, а не фильтров. В ином случае, вы сможете писать SEO статьи только в разделе «Блог». Этот пункт на прямую связан с семантическим ядром (СЯ).
Думаю, важно ввести одно правило для интернет-магазина:
Нужно сделать все, чтобы не вводить новую сущность / переменную!
Свойство товара отправлять в меню или в фильтр?
Чем шире запрос, по которому потенциальный клиент может искать ваш товар, тем вероятнее, что он станет составляющей меню, то есть категории или подкатегории. Чем уже свойство, тем вероятнее, что оно станет частью фильтра.
То есть при создании категорий и фильтра можно (я рекомендую!) опираться на семантическое ядро (СЯ). Так же, в этом вопросе, вам всегда даст свои рекомендации заказчик. Но иногда эти два фактора идут в разрез.
На помощь придет технический аспект, который лежит в основе программирования. На страницах категорий и подкатегорий, на которые мы попадаем из меню, мы можем написать SEO текст. Когда же мы падаем на какие-то страницы из фильтра, может казаться, что мы также попадаем на независимые статические страницы по типу категорий. Но это совсем не так. К тому же, часто эти страницы вообще закрыты для индексации роботами, для того, чтобы на сайте не создавалось огромное кол-во дублирующих неуникальных страниц. Следовательно, на них нет смысла вообще писать SEO статьи. Поэтому, если вы отправите в фильтр, какой-то широкий запрос, то в последствии возможно не сможете написать SEO текст на странице категории или подкатегории.
Как связанны категории/подкатегории и фильтр с сопутствующими товарами?
Это прямо очень важно понять! Например, есть интернет магазин для рыбаков, где продаются удилища и катушки к удилищам.
В этих разделах есть подкатегории: фидерные, карповые, сомовые, спиннинговые удилища и соответственно катушки. Мы легко можем указать, чтобы на товарах с карповыми удилищами сопутствующими товарами выводились карповые катушки, если эти виды находятся именно в подкатегориях. Но, если квалификация фидерные, карповые, сомовые, спиннинговые удилища и соответственно катушки окажутся в фильтре, мы уже не сможем указать их как сопутствующие друг для друга. Это технически сделать невозможно! То есть, сопутствующие товары привязаны к категориям и подкатегориям.
Пример категорий, подкатегорий и фильтров в обычной жизни
Категории можно сравнить с навигацией в супермаркете. Это указатели, которые обычно свисают над каждым отделом.
Например, каши, макароны, молочная продукция, ликеро-водочные изделия.
Подкатегории, можно сравнить с наименованием продукции. Например, в молочном отделе будет секции с молоком, творогом, сыром, кефиром и мороженным.
Деление конкретной продукции по производителям — может быть отнесена, как в подкатегории, так и в фильтра. Это будет зависеть от количества ассортимента. Если ассортимент небольшой, то на сайте часто можно встретить сегментацию по производителям именно в меню. Если ассортимент большой, то производители скорее всего уйдут в отдельный фильтр.
Свойство мороженного по вкусам пойдет в фильтр. Например, это может быть мороженное шоколадное, белое, клубничное или с орешками. Или для колбасы это будет фильтр по сортам: молочная, копченная, балык и т.д.
В чем разница между структурой в интернет магазине, когда одна и несколько категорий товаров?
Покажу на примерах.
Сайт спортивной одежды Марафон. Когда мы заходим на главную страницу сайта, то сразу видим все категории одежды. Также выделены категории по полу и возрасту: мужчинам, женщинам, детям. Заметьте, мы еще не сделали ни одного клика мышкой. Идеально и все понятно.
Давайте посмотрим на сайт Алло. Мы видим много категорий. И среди них есть общая категория «Одежда, обувь, аксессуары». Мы уже нажали один раз мышкой, чтобы открыть «Каталог товара».
И нам нужно нажать еще раз (второй) мышкой на интересующий нас раздел, чтобы увидеть категории и подкатегории.
А теперь, давайте посмотрим, как будут выглядеть ссылка и хлебные крошки, если мы нажмем на кроссовки в обоих случаях.
На сайте компании Марафон:
- короткая ссылка;
- короткий путь в хлебных крошках со 2-м уровнем вложенности.
На сайте компании Алло:
- короткая ссылка, которую такой сделали искусственно, как требует SEO оптимизация;
- хлебные крошки показывают 5 уровней вложения! Реальная, естественная ссылка так же имеет 5 уровней, но, как я уже сказала, ее подправили намеренно.
На реальных примерах вы сами увидели, в чем разница между структурой в интернет магазине, когда одна и несколько категорий товаров. Во втором варианте добавляется один, два, а иногда и 5 уровней вложенности. А вы помните, я чуть выше писала о том, что в идеале, пользователь сайта должен найти нужный товар в идеале в 3 клика. В большом интернет-магазине реализовать это правило почти невозможно.
Но магазин Алло хорош в этом. Давайте посмотрим, как он решает эту задачу? Он предлагает сразу несколько вариантов.
Если мы просто нажмем на корневую категорию «Одежда, обувь, аксессуары», то попадем на промежуточную страницу с подкатегориями по полу. Это длинный путь.
Но мы можем и не делать этот лишний шаг, а воспользоваться всплывающим меню.
Это не стандартное представление меню. Над ним точно работают давно и кропотливо. Подозреваю, что оно еще и может меняться в зависимости от сезона года. И на самом деле, чтобы нажать на «Кроссовки» для женщин, мы сделали только один клик, когда нажали на кнопку «Каталог». Дальше, мы просто вели мышкой.
Да, возможно, посетительницы сайты Алло, нужны были бы не кроссовки, а босоножки. Тогда бы она нажала на ссылку «Все товары» и попала на промежуточную страницу.
И тогда 3-й клик ее приведет к нужной категории, где она уже сможет воспользоваться фильтром. И так мы видим, что правило 3-х шагов на сайте работает.
Чтобы вы, как пользователь увидели такой результат, я уверенна, что маркетолог и программисты потратили на это десятки, а может быть и сотни часов.
Коротенький итог
Давайте посмотрим, с какими сущностями мы работаем/помним, когда речь идет о структуре сайта:
- Семантическое ядро.
- Категории и подкатегории.
- Фильтра.
- Сопутствующие товары.
- Ссылки.
- Хлебные крошки.
- SEO статьи.
- Дизайн десктопной и мобильной версии.
Когда мы приступаем к разработке структуры сайта, мы также помним:
- про удобство для пользователя;
- про возможности движка / CMS или выбранного шаблона сайта;
- про стоимость для клиента. Если работают супер-специалисты программисты, то возможно они и все смогут реализовать. Но вопрос в том, сколько это будет стоить заказчику? Готов ли он заплатить за работу?
А в остальном, сегодня возможно сделать любой интернет-магазин.
Пусть ваш интернет-магазин будет вашим успешным бизнесом!