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

Аудит юзабилити №439

Дата аудита: март 2017 года

Объем отчета: 40 страниц 

 

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

 

Вводная информация

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

Перед просмотром дополнительных материалов их желательно скачивать на компьютер.

Также по всем выявленным проблемам даны рекомендации по их устранению.

Красным текстом и красными маркерами выделены обнаруженные ошибки и важная информация.

Общая информация по статистике сайта

Для более точного понимания текущего состояния сайта и возможных источниках проблем ниже приведены важные данные Яндекс.Метрики за последний квартал.

Источники трафика:

Анализ источников трафика

Статистика сайта по источникам трафика

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

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

Регионы посетителей

Возраст посетителей сайта распределен следующим образом:

Возраст посетителей

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

Популярное содержимое

Анализ посещаемости страниц сайта

Распределение посетителей по типу используемых устройств:

Статистика по устройствам просмотра

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

Анализ показателя отказов

Используемые разрешения экранов:

Разрешение экрана

Статистика по разрешению экрана

Используемые браузеры:

Используемые браузеры

Анализ статистики по браузерам

Наибольший показатель отказов – у пользователей, использующих Mobile Safari.

Также стоит отметить, что подавляющее большинство посетителей сайта используют операционную систему Windows:

Использование операционных систем

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

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

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

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

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

Три варианта дизайна главного меню

Три варианта дизайна главного меню

Три варианта дизайна главного меню

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

В пунктах главного меню никак не обозначено наличие выпадающих подменю. Это отрицательно сказывается на юзабилити. Видео продемонстрировано по ссылке https://yadi.sk/i/w-fy0JX03EtiaN.

Не обозначены подразделы в главном меню

Также никак не обозначено наличие выпадающего меню третьего уровня в подразделах каталога. Видео показано по ссылке https://yadi.sk/i/3tGgB3Tq3EtjpH

Не обозначено наличие выпадающего подменю

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

На подстраницах сайта выпадающее меню в разделе «Каталог» отсутствует. Видео продемонстрировано по ссылке https://yadi.sk/i/PgPprkPc3Etkdc.

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

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

Аналогичная проблема наблюдается и при переходе по ссылкам нижнего меню:

Не выделяется текущий раздел сайта

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

Ошибки в юзабилити каталога домов

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

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

Последний пункт должен быть текстом, все остальные – ссылками. В данный момент ссылки и текст оформлены одинаково.

Ссылки оформлены как обычный текст

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

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

Ссылки оформлены как обычный текст

Ссылки оформлены как обычный текст

Ссылки оформлены как обычный текст

Ссылки оформлены как обычный текст

Ссылки оформлены как обычный текст

Ссылки оформлены как обычный текст

Ссылки оформлены как обычный текст

Ссылки оформлены как обычный текст

Ссылки оформлены как обычный текст

Ссылки оформлены как обычный текст

Ссылки оформлены как обычный текст

Ссылки оформлены как обычный текст

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Также не реагируют на наведение курсора ссылки в блоке «Наши основные предложения»:

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

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

На подстраницах ссылки в блоке «Основные предложения» подсвечиваются белым цветом и не видны на светлом фоне:

Недостаточная контрастность элементов интерфейса

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

Компоновка страниц сайта

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

Они отличаются:

  •  дизайном и компоновкой верхнего главного меню;
  • дизайном и расположением меню каталога домов;
  • дизайном и расположением формы поиска по сайту;
  • дизайном и компоновкой нижней части страницы;
  • дизайном и компоновкой модуля постраничной навигации;
  • оформлением и функционалом элементов форм.

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

Кроме этого существенно отличается и дизайн некоторых типовых разделов сайта.

Рекомендуем привести оформление всех страниц и элементов сайта к единому стилю. Это придаст дизайну завершенный вид и позитивно скажется на юзабилити.

Поиск по сайту

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

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

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

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

Четыре варианта дизайна модуля поиска

Четыре варианта дизайна модуля поиска

Четыре варианта дизайна модуля поиска

Четыре варианта дизайна модуля поиска

Четыре варианта дизайна модуля поиска

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

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

На видео https://yadi.sk/i/9w3pwK613EzZEc показан процесс поиска по некоторым запросам, которые есть на сайте, но не выводятся в результатах.

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

Непонятно, по какому принципу отсортированы результаты поиска по умолчанию (цене, дате добавления, названию, коду проекта или релевантности). По ссылке https://yadi.sk/i/O7U5luWN3EzaQR показан полный скриншот страницы поиска по запросу «каркасный дом».

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

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

Компоновка страницы результатов поиска

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

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

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

Не подсвечивается текущий вариант сортировки результатов поиска. Видео показано по ссылке https://yadi.sk/i/h08Pe__-3Ezc7h.

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

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

Далее рассмотрим дизайн и юзабилити главной страницы сайта.

В верхней части расположен блок с баннерами, который занимает практически весь первый экран страницы.

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

Анализ данных карты кликов

При нажатии на кнопку «Связаться с менеджером» открывается страница с результатами поиска, что не соответствует ожиданиям пользователя. Видео показано по ссылке https://yadi.sk/i/LgZbNnBk3F9B4r

Ошибки в юзабилити страницы

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

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

Ошибки в юзабилити сайта

В модуле подбора по параметрам есть возможность выбора вплоть до 45 комнат и 46 санузлов.

Ошибки в юзабилити модуля подбора по параметрам

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

Ошибки в юзабилити каталога домов

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

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

Параметры фильтра не связаны между собой. В результате, например, возможен выбор дома площадью 21 квадратный метр, с 20-тью комнатами и 46-тью санузлами. Это противоречит логике и не соответствует ни одному из домов, представленных в каталоге:

Ошибки в юзабилити фильтра объектов

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

В выпадающем списке не помещается текст:

Ошибки в юзабилити выпадающих списков

Ошибки в юзабилити выпадающих списков

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

Ошибки в дизайне формы фильтра объектов

Ошибки в дизайне формы фильтра объектов

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

Кроме этого, набор полей фильтра не привязан к конкретному типу проектов. В результате, в форме подбора бани выводятся поля «Терасса» и «Гараж», что отрицательно сказывается на юзабилити. Видео показано по ссылке https://yadi.sk/d/QKHbYVDg3F9Kew

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

При нажатии на фото дома открывается блок с информацией об объекте. При этом название некоторых домов обрезано:

Ошибки в юзабилити сайта

Ошибки в юзабилити сайта

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

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

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

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

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

Выравнивание текстовых блоков

Квадратные метры должны быть обозначены в виде М2:

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

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

Ошибки в модуле отзывов

В блоке просмотра сертификатов нет возможности перехода к предыдущему и последующему изображению в режиме просмотра увеличенного фото. Это отрицательно сказывается на юзабилити. Видео показано по ссылке https://yadi.sk/i/_3Ay4iHv3F9UYS.

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

Каталог проектов

Допущена ошибка в тексте:

Ошибки в текстах сайта

Непонятно, что обозначает заголовок «Наши»:

Ошибки в заголовках сайта

Дизайн данного блока разваливается:

Ошибки в дизайне

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

Допущена ошибка в тексте:

Ошибка в тексте сайта

Кнопка не реагирует на наведение курсора:

Кнопки не реагируют на курсор

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

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

Юзабилити блока характеристик домов

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

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

Юзабилити рейтинга проектов

Страница детального просмотра проекта

Юзабилити страницы детального просмотра проекта рассмотрим на примере https://www.stroy-kotedj.ru/products/dom-iz-kleenogo-brusa-06-302–9-x-132–172-m2/

Кнопки и ссылки не реагируют на наведение курсора:

Элементы интерфейса не реагируют на курсор

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

Непонятно, это ссылка или текст:

Ссылки оформлены как текст

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

Ссылки и текст оформлены одинаково:

Ссылки оформлены как текст

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

Нет вертикальных и горизонтальных отступов между элементами:

Нет отступов между элементами

Не согласовано взаимное расположение элементов и текста:

Не согласовано расположение элементов

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

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

Не указаны цены

Абсолютно не понятно, как работает калькулятор. Стоимость всех комплектаций – 0 рублей. При изменении комплектаций пересчет цены не происходит. Видео показано по ссылке https://yadi.sk/i/-gd1thSG3F9gWQ.

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

Текст выходит за границы блока:

Ошибки в оформлении текстов

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

Всплывающие подсказки не помещаются по высоте и текст в верхней части обрезан. Видео показано по ссылке https://yadi.sk/i/CQ9cGIf83FBgdq.

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

Не выводится нижняя и боковая граница для части картинок:

Ошибки в выводе элементов страницы

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

Непонятно, что за проекты находятся в нижней части страницы:

Ошибки в юзабилити страницы

Кнопки прокрутки не работают. Видео показано по ссылке https://yadi.sk/i/gdolaqWV3F9htq.

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

Кнопка отправки заявки не реагирует на наведение курсора:

Кнопка не реагирует на наведение курсора

Нет проверки правильности формата ввода данных в полях формы. Видео показано по ссылке https://yadi.sk/i/gCiskC0H3F9iwi

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

Фото масштабируется средствами браузера. Из-за этого нарушаются пропорции и появляются видимые искажения.

Масштабирование изображений в браузере

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

Текст оформлен как ссылка, хотя таковым не является.

Текст оформлен как ссылка

Текст оформлен как ссылка

Текст оформлен как ссылка

Текст оформлен как ссылка

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

Раздел «Статьи»

Создается впечатление, что статьи предназначены для поискового продвижения сайта, а не его пользователей.

В тексте статей нет иллюстраций и фото, не выделены заголовки и смысловые блоки.

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

Для примера по ссылке показаны несколько статей https://yadi.sk/i/Y6LzR-nn3FBwLs

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

Раздел «Сотрудники»

Допущена опечатка в тексте:

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

Для части сотрудников нет фотографий:

Нет фотографий сотрудников

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

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

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

К сожалению, в данный момент она не соответствует своим задачам.

В верхней части страницы расположен блок подбора проектов по параметрам, далее – блок с выводом спецпредложений и лента со всеми проектами.

Какая-либо информация об услугах на странице отсутствует. Полный скриншот страницы показан по ссылке https://yadi.sk/d/Xx70a8ru3FByQe

В заголовке допущена опечатка:

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

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

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

Страница https://www.stroy-kotedj.ru/catalog/fundament.html

Опечатка в заголовке:

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

Рекомендуем исправить ошибки в текстах страницы.

Пустой блок с видео:

Пустой блок с видео

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

Размещены маленькие фото плохого качества. Возможность просмотра увеличенных фото отсутствует:

Плохое качество фото

Рекомендуем добавить на сайт качественные фото объектов и скрипт просмотра увеличенных фото.

Страница https://www.stroy-kotedj.ru/catalog/zabor_ograzhdeniy.html

Ошибка в заголовке:

Ошибки в заголовке страницы

Нет просмотра увеличенных фото:

Нет просмотра увеличенных фото

Пространство страницы используется неэффективно. Полный скришот страницы показан по ссылке https://yadi.sk/i/l80S88WJ3FC2M2

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

Страница https://www.stroy-kotedj.ru/catalog/stoimost-obkladki-doma-kirpichom.html

Небольшое количество информации об обкладке дома кирпичом размещена в верхней части страницы. После нее выводится каталог проектов. Полный сриншот страницы показан по ссылке https://yadi.sk/i/EILz16aN3FCDfA.

Страница https://www.stroy-kotedj.ru/catalog/stroitelstvo-derevyannyh-domov.html

Размещены фото 2012-го года.

Нет возможности просмотра увеличенных фотографий.

Между изображениями нет вертикального и горизонтального отступа.

Нет отступа между фото

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

Страница «Производство»

Для главной и подстраниц раздела свойственны те же типичные проблемы, что и для страниц раздела «Услуги»:

  • ошибки в заголовках;
  • отсутствие просмотра увеличенных фото;
  • ошибки в компоновке макета страницы.

Рекомендуем выполнить доработки, озвученные в аудите для страниц «Услуги».

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

Под заголовком нет фотографий соответствующих категорий.

Нет фотографий категорий

Указан только один тип постройки – клееный брус. Допущена ошибка в слове «клееный».

Ошибки в текстах сайта

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

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

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

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

Рекомендуем разместить карту и схему проезда на базе сервиса Яндекс.Карты.

Ссылки оформлены как обычный текст:

Ссылки оформлены как обычный текст

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

Время работы офиса с 10 до 19 не совпадает с временем работы многоканального телефона с 9 до 18.

Ошибки в текстах сайта

 

Get new case studies by email:

More Case Studies

See all