Аудит юзабилити интернет-магазина жалюзи, роллетов и штор

Позиционирование сайта

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

На странице «О компании» указано:

На странице с контактами сайт уже позиционируется как интернет-магазин:

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

Также на сайте не указана региональная принадлежность компании (кроме страницы «Контакты»).

Аналогичная ситуация и с формами вызова замерщика – в них есть поле ввода только улицы и дома. Поле ввода города отсутствует.

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

Информация о том, что компания работает в Москве есть только на странице контактов:

Рекомендуем явно указать в верхней части сайта «г.Москва».

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

Качественная навигация по сайту является основой для построения эффективного юзабилити сайта.

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

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

Рассмотрим, насколько выполнены эти требования на сайте.

При переходе в подразделы сайта не подсвечивается соответствующий пункт главного меню. Пользователю сложно понять, в каком разделе сайта он находится в конкретный момент времени. Это продемонстрировано на видео по ссылке https://yadi.sk/i/4Fg2iSsDtX5BS.

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

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

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

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

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

Наибольшее внимание пользователя привлекают разделы «Цены» и «Контакты».

Это подтверждается и картой ссылок:

Рекомендуем расположить разделы «Цены» и «Контакты» ближе к началу главного меню.

Каталог товаров

Ссылка на главную страницу каталога отсутствует в верхнем меню. Это отрицательно сказывается на юзабилити и конверсии.

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

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

Для части подкатегорий каталога информация о примерной цене отсутствует.

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

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

При этом количество кликов по верхним ссылкам минимально. Это подтверждается данными статистики. Для примера по ссылке https://yadi.sk/i/2ej6BmultXFuW показана карта кликов для главной страницы сайта.

На странице просмотра раздела каталога есть блок «Примеры работ».

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

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

Для примера возьмем фото:

Его легко можно найти на следующих сайтах:

http://www.allblinds.ru/zhalyuzi/na-plastikovye-okna/

http://xn--62-8kc3bpe.xn--p1ai/zhalyu/

http://www.xn—-7sbabwiiitgqv7b4l.xn--p1ai/

http://andecor.ru/goriz.html

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

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

В каталоге не указано, сколько образцов представлено в каждой категории.

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

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

При просмотре увеличенного фото цифровой индекс и какое-либо описание конкретного товара не выводится. Это продемонстрировано на видео по ссылке: https://yadi.sk/i/MuuHwZrKtXQKD.

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

Следует отметить, что на сайтах-конкурентах такая информация представлена.

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

В некоторых разделах каталога размещена только текстовая информация. Нет примеров работ и товаров в каталоге. Например:

http://jaluzi-butik.ru/catalog/zhalyuzi-s-elektroprivodom-na-okna

http://jaluzi-butik.ru/catalog/rolstavni-photo-tseny

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

Форма вызова замерщика

В форме в явном виде не указано, какие поля являются обязательными для заполнения. Соответствующее сообщение появляется только после попытки отправки данных формы. Это продемонстрировано на видео по ссылке https://yadi.sk/i/3IwZL5SStXRNZ.

Аналогичная ситуация и со второй формой вызова замерщика, размещенной на странице http://jaluzi-butik.ru/zamer-jaluzi-dlya-okna. Это продемонстрировано на видео по ссылке https://yadi.sk/i/5txzJRuKtXV5N.

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

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

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

Кроме этого, рекомендуем заголовок формы сделать с указанием города – «Вызвать замерщика бесплатно в Москве».

Форма заказа обратного звонка.

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

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

Страница «О компании»

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

Не указано, с какими поставщиками сотрудничает компания.

Страница «Услуги»

Обычный текст оформлен как ссылки. Ниже представлены скриншоты таких элементов:

Рекомендуем оформить данные элементы как заголовки.

Информацию о ценах и сроках рекомендуем выделить жирным шрифтом.

Не указан номер телефона, по которому надо звонить:

Страница «Фотогалерея»

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

Страница «Цены»

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

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

Данные кнопки рекомендуем расположить в один ряд.

Слишком маленькое межстрочное расстояние в заголовке:

Страница «Отзывы»

Непонятно, что обозначают звездочки рядом с названием полей:

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

Нет отступов между: границами фоновой плашки и текстом; картинкой с кодом и полем ввода.

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

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

Страница «Вопросы и ответы»

Замечания, указанные для страницы «Отзывы» верны и для страницы «Вопросы и ответы».

Страница «Контакты»

На странице не указаны какие-либо официальные реквизиты и организационная форма компании. Это отрицательно сказывается на доверии посетителей сайта и как следствие – количестве заявок.

Отсутствует адрес офиса и схема проезда, хотя размещен адрес интернет-магазина.

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

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

Рекламные блоки

В верхней центральной части всех страниц сайта размещен блок с рекламными и информационными баннерами. Это верное решение.

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

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

Верстка сайта

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

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

Рассмотрим, как выполнены эти требования на сайте.

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

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

Причина – использование фиксированной ширины страниц сайта в 940 пикселей и отсутствие адаптации размеров элементов в зависимости от ширины окна браузера и типа устройства. Это не соответствует современным стандартам.

В результате сайт отображается с полосами вертикальной и горизонтальной прокрутки, для работы с ним на мобильных устройствах необходимо использовать масштабирование и т.д. Это продемонстрировано на видео по ссылке https://yadi.sk/i/keEnoHFBtXo2h.

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

Практически у всех ссылок на сайте не заполнен title:

Аналогичная проблема и с тегами изображений – не заполнены alt и title:

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

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