Страница товара: как научить ее продавать?

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

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

Сегодня поговорим о главной вашей продающей странице – странице товара.

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

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

Изображение товара

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

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

Плохой пример:

Интернет магазин all-time наложил свой логотип поверх изображения товара, что выглядит неэстетично и мешает рассмотреть детали.

Хороший пример:

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

Описание товара

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

Плохой пример:

На сайте zakazsad.ru неподготовленный пользователь может запутаться в характеристиках мини-мойки, просто потому, что ему незнакомы некоторые технические названия аксессуаров и частей инструмента.

Хороший пример: на сайте karex.ru описание мини-мойки будет понятно даже неподготовленному пользователю. Большой плюс – есть видеообзор товара.

Варианты товара

Если в ассортименте вашего магазина – вариативные товары (например, одежда и обувь разных цветов или моделей), важно правильно показать пользователю все возможные варианты:

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

Хороший пример:

На сайте vsemayki.ru можно с легкостью выбрать нужную модель изделия и цвет на одной странице товара.

Плохой пример:

На сайте fytbolki.ru не так легко разобраться – какая это модель, женская или мужская, и есть ли возможность выбрать иной цвет.

Опции товара

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

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

Хороший пример:

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

Добавление товара в корзину

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

Плохой и хороший пример:

На сайте frenza.ru кнопка "Купить" сливается с общим оформлением и заметна не с первого взгляда – нам даже пришлось обвести ее красным.

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

Что еще стоит показать на странице товара?

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

Также стоит на видном месте указать реальные сроки и интервалы доставки.

Хороший пример:

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

Товар, которого нет

Распространенная ситуация: товара нет в наличии. Гуру юзабилити Якоб Нильсен в своей книге «Ecommerce Use rExperience» утверждает, что страницы товара, которого нет в наличии, не должно быть в интернет магазине. Логика рассуждений довольно проста: «пользователи, которые долго шли по навигации сайта, нашли нужный товар и обнаружили, что его нет, пребывают в ярости».

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

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

Вдохните жизнь в описание

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

Однако и в Интернете можно усилить впечатление о товаре, апеллируя к эмоциям покупателя, делая акцент на ценностях товара.

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

В завершение приведем два примера, показывающие, как по-разному можно представить покупателю один и тот же товар – духи Chanel Chance. Как вы думаете, какая страница товара больше понравится женщине?