14.09.2017

55

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

Рассмотрим ещё один сайт в рамках тарифа «Экспресс-аудит». Компания клиента занимается продажей автомобильных аксессуаров российского производства.

Обзор Главной страницы

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

После поиска в интернете находим данный сайт и попадаем на Главную страницу:

Главная страница

Отлично, что в шапке сайта сразу указано что продает компания, но не ясно в каком регионе. Сможем ли мы заказать товары в Хабаровск? Не хотелось бы на этапе оформления заказа узнать, что в наш город нет доставки. Также не хватает режима работы рядом с номером телефона и формы заказа обратного звонка.

Совет 1: указывайте регионы доставки в шапке сайта, чтобы клиент не искал эту информацию по сайту.

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

Слайдер на Главной

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

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

Под слайдером видим три группы товаров, без подзаголовков и объяснений почему именно эти товары. Наверное, это самые популярные товары.

Группы товаров на Главной

Вместо данного блока лучше показать основные виды товаров, добавив изображения и ссылки на соответствующие страницы каталога. Тем более, что на сайте всего 9 категорий товаров, которые можно аккуратно расположить в виде плитки изображений 3×3. Такой вариант представления помог бы посетителям ознакомиться с ассортиментом магазина и направил бы их в каталог.

И чтобы не дублировать ссылки на разделы товаров, боковое меню на Главной странице можно убрать, оставив общую ссылку на каталог.

Боковое меню на Главной

Совет 3: используйте Главную страницу, чтобы как можно привлекательнее рассказать об ассортименте товаров, добавляйте изображения и ссылки на соответствующие разделы.

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

Блок с информацией о системе скидок

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

Основной текст на Главной странице

Информация о преимуществах компании есть, но почему-то на отдельной странице «Наши преимущества», что не самый удобный вариант для пользователей, ведь им нужно еще ее заметить и перейти. Преимущества должны быть на Главной странице.

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

Ссылка на соцсеть в подвале сайта почему-то не ведет на аккаунт компании, хотя текст «Мы в соц. сетях» подразумевает переход в группу.

Ссылка на соцсеть в подвале сайта

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

Страница о компании

Попробуем узнать больше о компании и перейдем на соответствующую страницу:

Страница о компании

Узнали ли мы что-нибудь о компании? К сожалению, нет. Ссылку на контакты мы и так можем найти в главном меню, а слова «команда молодых и амбициозных людей, любящих свое дело» можно встретить на многих других сайтах. Хотелось бы лучше познакомиться с компанией, кто работает в ней, есть ли у них собственное производство, как выглядит процесс работы и т.д. А вот блок с информацией о скидках на данной странице совсем не нужен.

Совет 5: страница о компании это как ваш личный профиль в соцсетях, она должна рассказывать именно о компании, содержать изображения офисов, производства, складов и сотрудников, а в идеале видео. Здесь же можно добавить отзывы, сертификаты, награды и т.д. Помогите пользователям убедиться, что вы реальная компания и вам можно доверять.

Страница о компании слишком «пустая», чтобы расположить к себе посетителей. Доверия нет.

Обзор страниц каталога и процесса покупки

Вернемся к выбору товаров. Допустим нас заинтересовали органайзеры в багажник, кликаем по нужной ссылке в меню и видим следующее:

Раздел каталога

Каждый блок товара перегружен лишней информацией, которая только удлиняет список товаров. Не ясно, зачем добавлено описание товара, ведь пользователь сможет найти его в карточке товара. Информация о системе скидок общая для всех товаров и уже указана в отдельном блоке справа, поэтому вместо данного текста достаточно было бы пометки «Товар участвует в акции».

Товары в списке

Выбор товара для сравнения и количества можно было тоже оставить только в карточке товара.

Совет 6: товары в каталоге лучше располагать компактней, чтобы в экран помещалось больше товаров. Для получения более подробного описания, клиент спокойно перейдет в карточку заинтересовавшего товара.

Производитель для всех товаров один и тот же, поэтому «выбор» данного параметра в фильтрах не нужен.

Фильтр поиска в каталоге

Совет 7: фильтры должны помогать клиенту отобрать товар, а не путать его, поэтому если у вас всего одно значение параметра, то нет смысла добавлять для него фильтр.

Выбираем нужный органайзер и перейдем в карточку товара:

Карточка товара

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

Фотографии товара

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

Блок с похожими товарами

Длинный текст о товаре можно было бы разделить на блоки и оформить вкладками. Например, информацию о доставке и оплате можно перенести на отдельную вкладку.

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

Совет 8: Длинные тексты плохо воспринимаются, поэтому разбивайте их на подтемы. Части текста размещайте в виде вкладок или «прячьте» под заголовком и разворачивайте только после клика по нему

Добавляем необходимые товары и переходим на страницу корзины:

Страница корзины

Хорошее отображение товаров в корзине, но почему-то не указана цена товаров со скидкой, хотя выбранные товары участвуют в акции.

Совет 9: Если запускаете акцию, то обязательно продумайте, как будет меняться цена в корзине, чтобы пользователь не думал, что его обманули.

Далее заполняем форму заказа, выбираем способ оплаты, доставки и попадаем на страницу подтверждения отправки данных:

Страница оплаты заказа

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

Совет 10: Не перегружайте страницы оплаты информацией, чтобы не отпугнуть пользователя, но обязательно давайте возможность проверить данные перед оплатой.

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

Выводы: непродуманная Главная страница и перегруженные описания товаров в каталоге

Задача Главной страницы – кратко рассказать о возможностях сайта и привлечь пользователя перейти на внутренние страницы. В нашем случае необходимо наглядно представить категории товаров и показать преимущества данной компании, чтобы клиент не ушел к конкурентам. Сейчас среди интернет-магазинов большая конкуренция, поэтому покажите клиенту, чем вы отличаетесь от других.

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

P.S. Нужна помощь в поиске ошибок на вашем сайте? Закажите экспресс-аудит.

аудит сайта, кейсы, юзабилити-аудит

Автор Кира Светлова
Специалист по юзабилити сервиса 1PS

 

Дайджест новых статей
по интернет-маркетингу
раз в неделю на ваш email

Правила комментирования блога