UX и структура каталога для магазина одежды и обуви: на что обратить внимание

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

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

Чем каталог одежды сложнее обычного

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

Отсюда особые требования к каталогу:

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

1С-Битрикс с его торговым каталогом и торговыми предложениями хорошо подходит под эту задачу — если правильно спроектировать структуру.

Размеры и цвета через торговые предложения

Базовое архитектурное решение — использовать торговые предложения (SKU). Модель заводится как товар в инфоблоке торгового каталога, а каждая комбинация «цвет + размер» — как отдельное торговое предложение, привязанное к этому товару. Размер и цвет становятся свойствами предложений, связанными со справочниками значений.

Тогда на карточке покупатель выбирает цвет и размер, а система подставляет наличие, цену и фото именно этой комбинации. Такой подход — стандарт для одежды на 1С-Битрикс: он совпадает с тем, как номенклатура ведётся в 1С, поэтому остатки по конкретным размерам приходят обменом без искажений.

Одна карточка на модель или много

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

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

Дерево категорий одежды и обуви

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

1. Пол и возраст. «Женщинам», «Мужчинам», «Детям» — верхний уровень навигации.
2. Тип изделия. Платья, джинсы, кроссовки, ботинки — основные разделы.
3. Уточнение. Назначение, сезон, стиль — «вечерние», «зимние», «спортивные».

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

Фильтры, которые реально нужны

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

• Размер. Самый важный фильтр; должен учитывать наличие именно этого размера.
• Цвет. С образцами цвета, а не только текстом.
• Бренд. Многие ищут конкретную марку.
• Цена. Диапазон под бюджет.
• Для обуви — полнота и материал. Верх, подкладка, сезонность.

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

Наличие по размерам в каталоге

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

Что стоит показывать:

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

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

Размерные сетки как данные

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

Хорошая размерная помощь включает:

• Таблицу для конкретной модели и бренда. С реальными замерами изделия, а не усреднённую.
• Соответствие систем. RU, EU, US, международные обозначения рядом.
• Замеры по параметрам. Обхват груди, талии, длина стельки для обуви.
• Подсказку по посадке. «Маломерит, берите на размер больше» — из отзывов и опыта.

Когда сетка — это данные, её можно показывать в удобном виде, подсвечивать подходящий размер по введённым замерам и даже фильтровать. Хранят такие таблицы обычно как свойства или связанные записи; работать с ними в коде удобно через современный слой доступа к данным — D7 и ORM в 1С-Битрикс позволяют аккуратно вести и подтягивать размерные соответствия.

Фото и единый визуальный стандарт

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

• Несколько ракурсов. Спереди, сзади, деталь ткани, посадка на модели.
• Фото на модели с параметрами. Рост модели и её размер помогают оценить посадку.
• Единый фон и свет. Каталог выглядит как единое целое, а не сборная солянка.
• Реальные цвета. Оттенок на фото должен совпадать с реальностью, иначе — возвраты.

Много фото в высоком качестве — это нагрузка на страницу, поэтому важна работа с изображениями: адаптивные размеры, современные форматы, ленивая загрузка. Скорость витрины с тяжёлым визуалом держится в том числе на инфраструктуре — как её готовят под нагрузку, описано в статье про хостинг и инфраструктуру для 1С-Битрикс.

Карточка товара: что снижает возвраты

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

1. Точная размерная таблица. Для этой модели и бренда, с реальными замерами.
2. Понятный выбор размера и цвета. С наличием комбинации и подсветкой отсутствующего.
3. Параметры модели на фото. Рост и размер, чтобы примерить на себя.
4. Состав и уход. Ткань, посадка, рекомендации — снимают лишние вопросы.
5. Отзывы про посадку. «Маломерит/в размер» из реального опыта покупателей.

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

Обмен с 1С: остатки по размерам

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

На что смотреть в обмене:

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

Настройку такого обмена и автоматизацию продаж и складского учёта мы закрываем услугой автоматизации на 1С. А общие принципы надёжного обмена между сайтом и учётной системой мы разбирали в материалах про интеграции — они одинаково важны для любого товарного магазина.

Частые ошибки каталога одежды

• Цвета отдельными карточками. Десяток дублей на модель вместо одной карточки с торговыми предложениями.
• Размер и цвет текстом, а не справочником. Фильтр не работает, значения дублируются.
• Фильтр по размеру без учёта наличия. Показывает модели, у которых нужного размера нет.
• Сезон и стиль отдельными ветками. Одна модель размножается копиями по разным разделам.
• Размерная сетка картинкой. Нельзя показать удобно, подсветить размер или фильтровать.
• Разнобой в фото. Каталог выглядит небрежно, доверие и конверсия падают.
• Редкий обмен остатками. Наличие по размерам врёт, растут отмены и возвраты.

Чек-лист внедрения

1. Модель — товар, размер и цвет — SKU. Комбинации ведутся торговыми предложениями со своими остатками.
2. Свойства — справочники. Размер и цвет заведены справочниками, без дублей значений.
3. Одна карточка на модель. Цвета переключаются внутри, дубли исключены.
4. Дерево категорий по логике покупателя. Один основной раздел, подборки через свойства.
5. Фильтры настроены на предложениях. Размер, цвет, бренд, цена; наличие учитывается на уровне SKU.
6. Наличие по размерам видно в каталоге. Доступные размеры показаны уже в списке.
7. Размерные сетки — данные. Точные таблицы по модели и бренду с замерами.
8. Обмен с 1С стабилен. Коды устойчивы, остатки по размерам обновляются регулярно.

Вывод

Каталог одежды и обуви выигрывает или проигрывает на структуре. Правильная основа — модель как товар, а комбинации цвета и размера как торговые предложения торгового каталога 1С-Битрикс: это совпадает с учётом в 1С, даёт точное наличие по каждому размеру и корректные фильтры. Одна карточка на модель, категории по логике покупателя и подборки через свойства держат каталог чистым.

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