Аудит юзабилити сайта компании по организации переездов в Москве

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

Дата аудита: октябрь 2017 года

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

 

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

 

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

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

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

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

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

Базовая статистика сайта

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

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

Источники трафика распределены следующим образом:

Основной источник трафика – переходы из поисковых систем. На втором месте – прямые заходы (20%).

Следует отметить, что в данный момент у пользователей из прямых заходов показатель отказов почти в три раза выше, чем у посетителей из поисковых систем (58.5% и 20% соответственно). Но при этом у прямых заходов больше глубина просмотра и время, проведенное на сайте.

В данный момент преобладает поисковый трафик из Google:

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

В результате, доля трафика из Google существенно выросла. Например, за неделю 2-8 октября она составила 74%.

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

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

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

Абсолютное большинство посетителей заходит на сайт из России:

Распределение посетителей по городам:

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

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

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

Основная возрастная группа посетителей (45.7%) – люди от 25 до 34 лет. На втором месте (20%) посетители от 35 до 44 лет.

Женщины посещают сайт чаще, чем мужчины (64.1% и 35.9% соответственно):

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

В данный момент основная часть посетителей использует ПК для просмотра сайта.

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

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

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

Наиболее популярные разделы:

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

Логотип и слоган

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

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

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

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

В данный момент это требование выполнено. Логотип сделан ссылкой на главную страницу. Видео показано по ссылке https://yadi.sk/i/R7zpfh0p3Nme9s.

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

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

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

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

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

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

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

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

Главное навигационное меню расположено в самой верхней части страницы. При прокрутке контента оно скрывается с экрана и не видно пользователю. Это является отрицательным моментом с точки зрения юзабилити. Видео показано по ссылке https://yadi.sk/i/5Mr2Rot03NmfU7.

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

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

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

Согласно данным карты ссылок, самый популярный раздел – услуги, но ссылка на него расположена предпоследней в главном меню. Видео показано по ссылке https://yadi.sk/i/l6PB0WiF3NmftM

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

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

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

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

На странице «Перевозка грузов» http://www.uslugapereezd.ru/gruzoperevozki/ есть меню для выбора автомобиля в соответствии с массой груза. Текущий раздел выделяется изменением фонового изображения, но оно недостаточно контрастно по отношению к обычному. Сложно понять, какой из разделов является активным. Видео показано по ссылке https://yadi.sk/i/beXVBO-W3NmhvM

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

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

Например, при переходе в раздел «Отзывы клиентов» http://www.uslugapereezd.ru/pereezd-ofisa/otzyvy/ подсвечивается раздел «Услуги», хотя логически эта страница является подразделом «О нас». Видео показано по ссылке https://yadi.sk/i/emYAl9XI3NmnLK

При переходе в разделы «Новости» или «Вопрос ответ» также теряется подсветка ссылки «О нас» в главном меню. Видео показано тут: https://yadi.sk/i/DiXT8uWZ3Nmnh7

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

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

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

Вспомогательная навигация

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

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

Последний элемент вспомогательной навигации должен быть текстом с названием текущей страницы сайта. Сейчас он является ссылкой на ту же страницу. Видео показано тут: https://yadi.sk/d/7xwHrRY93Nmj4v.

Кроме этого, данные страницы являются подразделом страницы «Услуги». При этом соответствующая ссылка во вспомогательной навигации не выводится.

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

Оформление ссылок

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

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

Часть ссылок не реагирует на наведение курсора. Это отрицательно сказывается на юзабилити. Пример можно увидеть по ссылке https://yadi.sk/i/dQQQyg6y3NmpDE. Ниже приведены скриншоты таких элементов.

Кроме этого, на наведение курсора не реагируют фотографии. Это также отрицательно сказывается на юзабилити. Видео показано по ссылке https://yadi.sk/i/1gYSr-AF3NmpUi

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

Работа форм

Далее рассмотрим юзабилити и работу элементов форм, т.к. именно они оказывают существенное влияние на конверсию сайта.

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

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

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

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

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

Нет проверки правильности ввода данных. Удалось успешно отправить заявку с числовыми значениями в поле «Ваше имя». Видео показано по ссылке https://yadi.sk/i/nQLw539a3NmqmU.

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

Дизайн страницы с подтверждением отправки формы не проработан. В центральной части есть только краткое информационное сообщение. Основное пространство страницы не содержит полезной для пользователя информации. Полный скриншот приведен по ссылке https://yadi.sk/i/arYRd3BV3NmrJT.

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

Далее рассмотрим работу формы для создания заявки на переезд. Ее полный скриншот приведен по ссылке https://yadi.sk/i/VquKFMc93NmsSp.

В целом, компоновка страницы выпонена неэффективно. Более половины занимает пустое пространство, не содержащее полезной информации. Скриншот показан по ссылке https://yadi.sk/i/VU2eoNJ_3NnEdW

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

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

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

Ниже приведены скриншоты полей с избыточной шириной:

Поле с адресом сделано слишком маленьким. Например, в него не помещается реальный московский адрес «Центральный проезд Хорошёвского Серебряного Бора, 74, корпус 2, квартира 30».

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

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

Пример одного из удачных вариантов модуля выбора даты и времени показано по ссылке https://yadi.sk/i/sqC3zuFr3NnGgM

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

Шрифт в списке имущества отличается от используемого в других элементах формы заказа:

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

При изменении размеров поля ввода списка меняется геометрия и взаимное расположение всех элементов формы. Это отрицательно сказывается на дизайне и юзабилити. Видео показано по ссылке https://yadi.sk/i/151Eym4J3NnHeW.

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

В данный момент полностью отсутствует какая-либо проверка правильности ввода данных. Удалось успешно отправить абсолютно пустую форму заявки. Видео показано по ссылке https://yadi.sk/i/LPVXFHEX3NnJ6A.

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

Дизайн страницы подтверждения заявки не проработан. Основную часть страницы занимает пустой блок, не содержащий полезной информации. Полный скриншот показан по ссылке https://yadi.sk/i/ZmebqlqN3NnJLV.

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

Отдельно стоит отметить, что в форме заказа офисного переезда названия полей выводятся как и для квартирного переезда. Видео показано по ссылке https://yadi.sk/i/Nc6QoMwE3NnKVP.

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

Калькулятор переезда

http://www.uslugapereezd.ru/calc/

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

Не согласована высота блоков:

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

В списке автомобилей представлены не все варианты автотранспорта, доступного для заказа. Например, на странице «Перевозка грузов» http://www.uslugapereezd.ru/gruzoperevozki/ есть информация о большегрузном транспорте МАЗ, Мерседес и евро-фур. Видео показано по ссылке https://yadi.sk/i/I3yZU9kB3NnSse.

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

Текст и кнопка отправки оформлены одинаково. Видео показано по ссылке https://yadi.sk/i/cy6GKCwz3NnTKx

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

Неудачным решением является вывод состава заказа в заголовке всплывающего окна с оформлением переезда. При большом количестве элементов увеличивается высота заголовка и он становится практически нечитаемым. Видео показано по ссылке https://yadi.sk/i/jt7LlRwe3NnUnD

 

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

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

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

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

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

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

После отправки форма не закрывается и возможна попытка повторная отправка. Только после этого появляется соответствующее информационное сообщение. Видео показано по ссылке https://yadi.sk/i/1duoPwer3NnVnv

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

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

Согласно данным открытых источников, например, https://retailrocket.ru/blog/tri-vazhnyih-kpi-vnutrennego-poiska-dlya-internet-magazina/, достаточно большое количество пользователей сайтов предпочитают использовать поиск в качестве основного способа навигации по сайту.

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

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

Например, ссылка на страницу с описанием процесса и ценой перевозки пианино и роялей находится в самом низу страницы «Цены» и ее сложно найти. Видео показано по ссылке https://yadi.sk/i/5YNN5UgM3NmryD.

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

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

http://www.uslugapereezd.ru/

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

На главной странице есть кнопка «Заказать переезд». Но при ее нажатии открывается страница с адресом http://www.uslugapereezd.ru/pereezd-ofisa/zakazat-ofisnyj-pereezd/. Это форма заказа переезда офиса. Такое решение не соответствует целям клиентов, которым нужен переезд квартиры или дачный переезд.

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

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

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

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

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

При нажатии на акцию открывается страница http://www.uslugapereezd.ru/pereezd-ofisa/skidki/. Ее дизайн также не проработан, вся информация об акциях подается в обычном текстовом виде и сложна для восприятия. Полный скриншот показан по ссылке https://yadi.sk/d/yQ1wJDPk3NnYz4.

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

Цены

http://www.uslugapereezd.ru/price/

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

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

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

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

Не согласована величина верхнего и нижнего отступа у заголовков:

В верхней части страницы нет ссылок для быстрого перехода к нужной таблице с ценами (например, «Хранение личных вещей»). Это отрицательно сказывается на юзабилити, т.к. страница имеет достаточно большую общую высоту. Ее полный скриншот показан по ссылке https://yadi.sk/i/KqoCKBgO3NnaQT

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

Контакты

http://www.uslugapereezd.ru/contact/

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

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

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

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

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

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

Кроме этого, на странице нет таких общепринятых элементов как:

  1. Ссылки на профили компании в социальных сетях и сервисах;
  2. Онлайн-чата для прямого общения с менеджером;
  3. Кнопки для заказа обратного звонка;
  4. Возможности звонка с сайта;
  5. Возможности связи с помощью широко распространенных мессенджеров. Например, Viber, Skype, WhatsApp, Telegram.

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

Услуги (главная страница)

http://www.uslugapereezd.ru/uslugi/

Дизайн этой важной страницы не проработан.

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

При этом на других страницах сайта списки услуг имеют довольно качественное оформление:

Пространство страницы используется неэффективно, ее основную часть занимает пустой блок. Полный скриншот показан по ссылке https://yadi.sk/i/-46uhP533NneqV.

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

О нас

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

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

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

404-я страница.

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

Сейчас на сайте такой страницы нет. Вместо нее выводится главная страница сайта. Видео показано по ссылке https://yadi.sk/i/3GgFzxPB3Nngdk.

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

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

Get new case studies by email:

More Case Studies

See all