Экспресс-аудит юзабилити лендинга мебельной компании

Навигация по сайту

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

Рассмотрим, насколько выполнены эти требования на сайте http://www.luxomebel.ru.

Непонятно, в каких пунктах есть дополнительное выпадающее меню – все они оформлены одинаково.

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

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

Рекомендуем явно обозначать наличие подменю второго уровня с помощью графических маркеров.

Текущий раздел сайта не выделяется в главном меню. Например, при переходе на страницу http://luxomebel.ru/category/mebel-dlya-vannoy-komnaty/ выпадающее меню выглядит так:

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

В оформлении вспомогательной навигации по типу «хлебные крошки» допущен ряд ошибок.

Ряд пунктов начинается с маленькой буквы, хотя они должны быть написаны с большой.

Ссылки не реагируют на наведение курсора.

Непонятно, где ссылка, а где текст.

Рекомендуем явно обозначать ссылки с помощью подчеркивания. При наведении курсора рекомендуем убирать подчеркивание или изменять цвет ссылки.

Юзабилити главной страницы сайта

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

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

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

Рекомендуем расположить кнопки управления прокруткой справа и слева от фото (как на страницах каталога).

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

Рекомендуем добавить фотографии реальных клиентов, оставивших отзывы и ссылки на их профили в социальных сетях.

Юзабилити каталога мебели

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

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

Например, по ссылке https://yadi.sk/i/CRRVNhofnLBoN можно увидеть карту скроллинга страницы «Кухни» http://luxomebel.ru/category/kuhni-na-zakaz/. Максимум соответствует красной зоне карты.

По ссылке https://yadi.sk/i/QLfLpBC9nLD7U находится скриншот карты скроллинга для страницы «Шкафы-купе» http://luxomebel.ru/category/shkafy-kupe-v-lipecke/.

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

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

Заголовки в тексте написаны с маленькой буквы и оформлены как обычные параграфы. Это отрицательно сказывается не только на юзабилити, но и на поисковой оптимизации сайта.

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

В ходе тестирования были обнаружены страницы с ошибками заполнения и работы. Ниже приведены ссылки и скриншоты:

Страница «Двери купе»

http://luxomebel.ru/category/dveri-kupe/

http://luxomebel.ru/dveri-kupe/shkaf-vstroennyiy-vstavka-kozha/

http://luxomebel.ru/category/mebel-dlya-vannoy-komnaty/

Аналогичные проблемы на страницах http://luxomebel.ru/mebel-dlya-vannoy-komnaty/mebel-dlya-vannoy/ и http://luxomebel.ru/mebel-dlya-vannoy-komnaty/910/

Раздел «Корпусная мебель» опубликован на сайте, но не содержит практически никакой полезной информации. Это продемонстрировано на видео по ссылке https://yadi.sk/i/8Px1gJ7EnLJc2 .

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

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

Размер фотографий не приведен к единому стандарту. Поэтому страница детального просмотра выглядит неаккуратно. Например, по ссылке https://yadi.sk/i/c33AJVHDnLN95 продемонстрирован вид экрана для страницы http://luxomebel.ru/kuhni-na-zakaz/malenkie/kuhnya-uglovaya/.

Рекомендуем сделать все фотографии единого размера и подключить скрипт для просмотра увеличенного фото, шириной не менее 1000 пикселей.

Доступность контактной информации

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

К сожалению, в данный момент это требование не выполняется.

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

Фактически, контактная информация на всех страницах сайта (кроме «Контакты») расположена в правом нижнем углу страницы и видна только после прокрутки всей страницы.

Для примера по ссылке https://yadi.sk/i/SWlw96YdnHmxi предоставлен полный скриншот главной страницы сайта.

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

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

Рекомендуем явно обозначить ссылку на email с помощью подчеркивания.

По умолчанию карта выводится со спутниковыми фото. Такое решение является малоинформативным. Более оптимальным с точки зрения юзабилити, будет использовать интерактивную карту в режиме «Схема».

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

Рекомендуем разработать и разместить на сайте форму обратной связи для отправки сообщения.

Также отсутствует возможность связи с помощью современных сервисов типа Skype, Viber и т.д.

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

Кроме этого, невозможно в реальном времени общаться с менеджером с помощью on-line чата. Это отрицательно сказывается на юзабилити и конверсии сайта.

Рекомендуем рассмотреть возможность использования комплексных систем on-line чата, отправки форм и заказа обратного звонка. Например, krible.com или аналогичных.

Юзабилити формы заявки

В данный момент в форме заявки нет проверки правильности введенных данных.

Рекомендуем осуществлять проверку правильности ввода и формата данных на лету, прямо в процессе заполнения формы пользователем.

Со страницы контактов http://luxomebel.ru/address-2/ заявку можно отправить с пустыми полями. После отправки открывается страница с сообщением об ошибке прав доступа. Это продемонстрировано на видео по ссылке https://yadi.sk/i/VtdZEy6dnKfaH.

С главной страницы сайта после отправки пустой формы появляется сообщение об успешной отправке. Это продемонстрировано на видео по ссылке https://yadi.sk/i/dpHgZVr_nKhgz.

Также не совсем понятно, для чего на странице подтверждения заявки снова выводится форма заказа дизайн-проекта.

Аналогичная проблема наблюдается и для формы заявки, которая открывается при нажатии на ссылку «Расчет стоимости» в главном меню сайта. Это продемонстрировано на видео по ссылке https://yadi.sk/i/wQukZqXZnKxmB.

Рекомендуем обеспечить корректную работу формы заявки и исправить ошибки, указанные выше.

Аудит верстки сайта

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

Полная таблица разрешений представлена на скриншоте по ссылке https://yadi.sk/i/80odwUVRnKqog.

Проверим, насколько корректно отображаются страницы при разном разрешении экрана.

При уменьшении количества контента в центральной части сайта футер не остается прижатым к нижней части экрана, а поднимается вверх. Из-за этого визу экрана появляется широкая белая полоса и дизайн выглядит неаккуратно. Это продемонстрировано на скриншоте по ссылке https://yadi.sk/i/oRKaz7WenKyqx.

Рекомендуем обеспечить отображение футера в низу страницы независимо от высоты контента.

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

Данная проблема продемонстрирована на видео по ссылке https://yadi.sk/i/uNBrOSzonL63U.

Отдельно стоит отметить, что верстка сайта в данный момент абсолютно не оптимизирована для работы с сайтом через мобильные устройства и планшеты.

Это подтверждается и данными Яндекс.Метрики – у посетителей сайта с мобильных устройств выше показатель отказов и меньшее время работы с сайтом и глубина просмотра.

Для примера по ссылкам https://yadi.sk/i/bhz8VVrznL8NK и https://yadi.sk/i/2QlaxvePnL8WZ можно посмотреть вид страниц сайта при просмотре на экране iPhone.

Учитывая характер ошибок верстки рекомендуем рассмотреть возможность полной переделки HTML и CSS кода сайта с использованием адаптивной верстки и современных решений, которые обеспечат правильное отображение и работу сайта на всех устройствах и при любом разрешении экрана.

С радостью отвечу на Ваши вопросы по результатам аудита по email, skype или телефону.