Аудит юзабилити портала по аренде и продаже недвижимости в Казани

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

Дата аудита: июнь 2016 года

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

 

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

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

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

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

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

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

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

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

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

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

Часть ссылок на сайте оформлены как обычный текст. Это снижает количество кликов по ним.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Юзабилити вспомогательной навигации

Далее рассмотрим работу вспомогательной навигации по типу «Хлебные крошки».

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

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

К сожалению, в данный момент есть несколько ошибок в работе вспомогательной навигации.

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

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

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

При переходе на страницу конкретного объявления его заголовок не выводится в навигационной цепочке. Например, https://kazned.ru/note/250922:

Ошибки в юзабилити навигации

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

Аналогичная проблема наблюдается и в разделе «Новости». Например, https://kazned.ru/news/6440:

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

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

Такая же проблема наблюдается и в разделе «Жилые комплексы».

Рекомендуем добавить ссылки для перехода на предыдущую/следующую страницу просмотра новости (статьи).

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

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

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

Ошибки регистрации

Согласно данным Яндекс.Метрики за последний месяц раздел «Избранное» посещало всего 0,083% пользователей. Т.е. он фактически не интересен для абсолютного большинства посетителей. Это подтверждается и данными карты кликов.

Анализ данных Яндекс.Метрики

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

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

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

Ошибки в модульной сетке сайта

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

В правой части главной страницы размещены рекламные баннеры. Но клики по ним практически отсутствуют. Аналогичная ситуация и с другими баннерами на главной. По ссылке https://yadi.sk/i/EDjNoWB7sjJBu приведен полный скриншот с наложением карты кликов за последний квартал.

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

Анализ юзабилити страницы

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

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

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

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

Анализ карты ссылок

Значения показателей популярности разделов среди посетителей главной страницы показаны на видео по ссылке https://yadi.sk/i/RIBcTA8osjKg8.

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

Далее рассмотрим блок с заголовком «Жилые комплексы».

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

Картинка вместо карты

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

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

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

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

Не согласована высота элементов и величина вертикальных отступов.

Ошибки в модульной сетке сайта

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

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

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

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

Стоит отметить, что при уменьшении ширины окна браузера появляется полоса вертикальной прокрутки страницы. Это продемонстрировано на видео по ссылке https://yadi.sk/i/P7_Z4tMEsjQGR.

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

Просмотр объявления

Используются фотографии разной геометрии. Из-за этого дизайн смотрится неаккуратно. Например, https://kazned.ru/note/245299:

Разный размер фотографий

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

Превью фотографий не реагируют на наведение курсора. Это показано на видео по ссылке https://yadi.sk/i/-Tn9ARmOsjR53.

Если в ленте присутствует фото с большой высотой, то в блоке просмотра увеличенного фото сверху и снизу появляются пустые зоны. Например, https://kazned.ru/note/253868. Полный скриншот страницы можно увидеть по ссылке https://yadi.sk/i/tqHCHXVisj6RC.

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

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

Ссылки или текст

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

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

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

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

Юзабилити карты объектов

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

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

Отдельно стоит отметить, что при открытии карты дизайн страницы разваливается – она увеличивается по высоте и появляются большие пустые зоны. Описание объекта уходит в нижнюю часть страницы. Это продемонстрировано на скриншоте по ссылке https://yadi.sk/i/42y5lhZ1skkg4

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

Список объявлений

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

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

В данный момент геометрия и взаимное расположение полей формы хорошо согласовано только на вкладке «Квартира». На остальных вкладках дизайн формы разваливается.

Модульная сетка формы поиска объектов

Модульная сетка формы поиска объектов

Модульная сетка формы поиска объектов

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

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

Ошибки в юзабилити формы

Текст выходит за границы поля ввода.

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

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

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

Раздел с коммерческой недвижимостью не содержит объектов. Из-за этого некорректно работает выбор площади помещения и страница не содержит полезной информации. Это продемонстрировано на видео по ссылке https://yadi.sk/i/fDPrujYuskwNh.

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

Блок с выбором количества выводимых объявлений находится достаточно далеко от самой ленты с объявлениями.

Модуль сортировки

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

В поле выбора количества объявлений на странице указано «20», при этом фактически выводится 10 обычных объявлений плюс платные. Это показано на скриншоте по ссылке https://yadi.sk/i/-EVmr6cPskxtx

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

После двоеточия и скобок слова должны начинаться с маленькой буквы.

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

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

Пустые поля

Пустые поля

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

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

Например, https://kazned.ru/note/245096.

Юзабилити карточки объекта

Юзабилити карточки объекта

Юзабилити карточки объекта

https://kazned.ru/search/doma/-/-/kazan

Юзабилити карточки объекта

https://kazned.ru/note/282618

Юзабилити карточки объекта

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

Личный кабинет

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

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

При переходе по страницам кабинета текущий раздел не выделяется в меню. Это показано на видео по ссылке https://yadi.sk/i/HGVZaqsqsm3AZ

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

Часть заголовков в личном кабинете оформлены как ссылки, хотя такими не являются. Это показано на видео по ссылке https://yadi.sk/i/jmkZuGDIsm3d4

Ошибки оформления заголовков

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

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

Анализ юзабилити

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

Не совсем понятно, для чего номер телефона выводить после нажатия кнопки «Увеличить».

Ошибки юзабилити

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

В окне, которое открывается после нажатия, фактически три кнопки закрытия окна.

Дублирование элементов интерфейса

При этом допущены ошибки в алгоритме работы скриптов. Это продемонстрировано на видео по ссылке https://yadi.sk/i/HdqmsswFsm4fw.

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

В личном кабинете не работает поиск и ввод кода бонуса. Также непонятно, где и как можно получить код бонуса. Это продемонстрировано на видео по ссылке https://yadi.sk/i/t3NbnqHxsm5EG

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

Пополнение счета

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

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

Юзабилити страницы пополнения счета

Эта информация доступна только после перехода на страницу платежного шлюза:

Юзабилити страницы пополнения счета

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

Более привычным для большинства пользователей является вывод даты в формате число/месяц/год, а не месяц/число/год.

Вывод даты

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

Юзабилити подсказок

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

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

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

Ошибки юзабилити формы

При уменьшении ширины окна браузера данный элемент ведет себя некорректно. Это продемонстрировано на видео по ссылке https://yadi.sk/i/tqJ_xDsQsm8ab.

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

Подача объявления

Далее рассмотрим юзабилити процесса подачи объявления.

Не совсем понятно, почему заголовок объявления помечен как необязательное поле.

Ошибки юзабилити формы

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

Непонятно, является ли данный элемент полем ввода или состоит из нескольких выпадающих списков.

Ошибки юзабилити формы

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

Ошибки юзабилити формы

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

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

Не указаны обязательные поля формы

Не указаны обязательные поля формы

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

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

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

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

Юзабилити выпадающего списка

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

Также допущены ошибки в алгоритме работы. В выпадающем списке выбора города или региона снова указана Россия и за рубежом.

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

При изменении страны, региона или города положение метки на интерактивной карте не меняется. Это показано на видео по ссылке https://yadi.sk/i/SVSa-RcysmCiP

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

Также выявлен баг при попытке отправки незаполненной формы и последующего обновления страницы. Это показано на видео по ссылке https://yadi.sk/i/8gOIEj3lsmD8C

Ширина и количество вводимых символов для большинства полей формы сделана избыточной. Соответствующие поля обозначены на скриншоте по ссылке https://yadi.sk/i/9KTyFfozsmDhp

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

На страницах с небольшим количеством контента футер поднят вверх, а не прижат к нижней части экрана. Из-за этого дизайн выглядит неаккуратно. Например, https://kazned.ru/hestates/a.

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

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

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

 

Get new case studies by email:

More Case Studies

See all