Каким бы ни был дизайн сайта, что бы ни продавал интернет-магазин, карточка товара должна быть понятной, максимально информативной, а также стимулировать посетителей на совершение покупки. Реализации поставленных задач нетрудно достигнуть: правила составления карточки товара в интернет-магазине хорошо известны и будут рассмотрены ниже.
Обязательные составляющие карточки товара
Без 8 базовых элементов нельзя обойтись ни в одном онлайн-магазине:
- Название товара.
- Изображения (стандартные/увеличенные).
- Варианты товара (размеры, цвета).
- Наличие в продаже.
- Цена.
- Кнопка Купить/Добавить в корзину.
- Характеристики продукта.
- Условия доставки.
Кратко охарактеризуем каждый из элементов.
Название товара
Наименование товара должно быть полным и включать в себя:
- бренд;
- вид товара;
- модель;
- базовые характеристики, данные производителем;
- цвет (если для данного товара это важно).
Название может быть настолько длинным, насколько это требуется. Это как раз тот случай, когда краткость - вовсе не сестра таланта. Помимо того, что полное название позволяет пользователю сразу видеть основные характеристики товара, оно также дает возможность быстрого визуального поиска на странице каталога – и, следовательно, целесообразно и в карточке. Название непременно должно быть акцентировано размером шрифта (и в некоторых дизайнерский решениях дополнительно – цветом).
Изображения
Главное правило – изображение должно быть качественным и оставаться таковым даже при увеличении. В большинстве случаев для серийных однотипных товаров (например, бытовая техника) это не является проблемой. Однако в отношении некоторых категорий, например одежды, без уникальных «живых» снимков не обойтись. 
Если говорить об интернет-магазине одежды, то очень хорошо, если изображение модели, одетой в продаваемую вещь, будет снабжено комментарием о росте, объеме груди/талии/бедер. Это полезно для покупателя, позволяет понять, как предмет одежды будет «сидеть» на нем. Так делают все крупные бренды, и это хороший пример для подражания.
Варианты товара
Аналогичный товар, но в других цветовых решениях, должен быть предложен покупателю в виде небольших иконок в общем блоке описания.
Наличие в продаже
Все современные интернет-магазины обязательно указывают, есть ли товар в продаже в настоящее время, а именно, сколько единиц:
- имеется непосредственно в магазине (т.е. могут быть доставлены сразу);
- лежит на локальном складе (могут быть доставлены через 1-2 дня);
- находится только на основном складе (доставляются дольше обычного).
Важно, чтобы информация была актуальной, для чего необходимо указывать время обновления сведений (как правило, раз в сутки).
Цена
Важно не просто указать цену, но и показать, что она выгодна для покупателя. Это можно сравнением с другими ценам, представленными на рынке:
- у конкурентов;
- в оффлайн-магазине;
- цена без скидки.
Эта информация должна быть акцентирована путем зачеркивания. Актуальную цену для покупателя целесообразно выделить шрифтом и цветом. Кроме того, очень хорошо, если потребитель будет видеть не только стоимость, но и процентное или денежное выражение суммы, которую он экономит при покупке.
Кнопка Купить/Добавить в корзину
К кнопке действия предъявляются следующие требования:
- ее должно быть хорошо заметно, поэтому традиционно ее делают контрастирующей доминантному цвету в дизайне;
- она должна находиться в общем блоке данных о товаре, как правило, ниже или выше указания стоимости.
В отношении потребительского поведения никакой разницы от того, как будет названа кнопка – «Купить» или «Добавить в корзину», нет.
Характеристики продукта
Лаконичное изложение базовых характеристик продукта – обязательный элемент для интернет-магазинов с любой номенклатурой товаров. Помимо внешнего вида, покупатели хотят знать, что представляет собой вещь «изнутри»: материал изготовления, технические параметры, производитель и прочее.
Условия доставки
Наконец, последний обязательный элемент – условия доставки – обычно размещается сразу после кнопки действия. Он должен давать пользователю четкие ответы на вопросы:
- Как можно получить товар (самовывоз, курьером, посылкой).
- Как быстро это можно сделать (для каждого способа доставки).
Дополнительные элементы
К дополнительным относятся те элементы, без которых пользователи могут совершать покупки, однако они делают интерфейс магазина более user-friendly. Будет интересно:основы продвижения интернет-магазинов
Путь каталога
Чрезвычайно удобный способ навигации для «продвинутых» пользователей. Дает понимание, в каком разделе каталога находится человек, позволяет одним кликом подняться на уровень выше, без использования основного меню сайта.
Отзывы и оценки покупателей
Идеально, если карточка товара будет сопровождаться отзывами о купленном товаре и оценками. Вот 3 основные причины:
- Наличие отзывов наглядно демонстрирует другим пользователям, что люди, действительно, приобретают товары в этом магазине.
- Для человека, намеревающегося совершить покупку, нет ничего более важного, чем мнение других людей, которые уже используют товар.
- Отзывы покупателей помогают пользователям делать выбор, что увеличивает продажи.
Не менее важно – поддерживать с покупателями обратную связь. Это позволяет не только приобретать лояльность потенциальных клиентов, но и повышает вероятность повторного возврата за покупками.
Таблица размеров
Для ритейлеров одежды желательно, чтобы в карточке товара присутствовала ссылка на таблицу размеров. Не все покупатели ориентируются в европейских, американских и прочих сокращениях и цифровых обозначения. А без знания размера, очевидно, совершить покупку невозможно.
Отложенный товар
Возможность отложить товар или «Добавить в желания» - полезная функция, позволяющая:
- удерживать внимание потенциальных покупателей в течение определенного времени;
- повышать вероятность совершения покупки с помощью рассылки;
- без лишних затрат получить лиды.
«С этим товаром покупают…» или «Дополните образ»
В обычном супермаркете спрашивают: «Что-нибудь еще?». То же, только не в форме вопроса, а виде предложения к совершению дальнейших покупок, практикуется и в онлайн-ритейле. Предложить к смартфону защитный экран, к футболке для бега – кроссовки, к мясу – фольгу для запекания – всегда полезно для покупателя и целесообразно для продавца.
Микроразметка Product
Микроразметка для товаров — это набор HTML тэгов, которые помогают поисковым роботам распознать, что на странице есть карточка товара. Какие преимущества ее использования?
С помощью микроразметки можно добиться более привлекательного сниппета — короткого «анонса» в поисковой выдаче, который включает заголовок страницы, ее описание и различные элементы, в том числе:
стоимость товара;
изображение;
рейтинг от пользователей;
статус (в наличии/нет в наличии/под заказ);
способы доставки;
бренд и другие.
Зачем это нужно
Сниппет формируется на основе данных, которые поисковые роботы собирают со страницы. Именно микроразметка Product позволяет вам указать именно ту информацию, которую вы хотите видеть в сниппете страниц с товарами вашего интернет-магазина. Помните: чем привлекательней будет «анонс» вашей страницы, тем выше шанс, что пользователи будут кликать по нему, чтобы узнать больше. Это значит, что хороший сниппет будет иметь высокий показатель кликабельности (CTR). В условиях современной конкуренции хороший сниппет это не прихоть SEO специалиста, а необходимость. Поэтому вопрос внедрять или не внедрять микроразметку на страницах возникать не должен — однозначно внедрять
На сайтах используется в основном два вида микроразметки — Shema.org и Open Graph. Последняя применяется преимущественно для создания красивого анонса для вашей ссылки при отображении ее в соцсетях (Телеграм, Фейсбук, Твиттер и т.п.). Shema.org чаще используется для разметки страниц — ее без проблем понимают популярные поисковики.
Элементы микроразметки карточки товара
Продуктовая микроразметка настраивается в коде страницы внутри тега — это можно сделать либо вручную, либо с помощью плагинов, если сайт работает на CMS. Разметка карточки товара включает следующие свойства:
Name (Text) — название товара;
Description (Text) — его описание;
Price (Number) — стоимость товара;
PriceCurrency (Text) — обозначение валюты, для корректного отображения следует использовать код валюты в системе ISO 4217;
Availability — наличие или отсутствие товара, при этом, если товар не в наличии, цена в сниппете будет автоматически скрыта;
Image (Text) — адрес, по которому лежит изображение товара для отображения в сниппете.
Дополнительно можно назначить и другие свойства, например, бренд (Brand), модель товара (Model) или способ доставки (AvailableDeliveryMethod). После внедрения микроразметки не забудьте проверить ее на валидность.
Выводы
- Карточка товара должна включать в себя 8 обязательных элементов. Остальные являются факультативными.
- Помимо рассмотренных, интернет-магазины, особенно крупные, используют в карточке товара кнопки социальных сетей. В некоторых случаях бывает полезно разместить информацию о бренде, а также детальное текстовое описание продукта.
- Основное, о чем следует помнить веб-дизайнерам при разработке карточки товара, - удобство пользователя и интуитивно понятное размещение элементов на странице.
