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

Компоновка меню

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

Рекомендуем первыми расположить пункты «Главная», «Отделения» и «Цены» первыми в меню.

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

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

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

При первой загрузке страницы почти 50% экрана занимает форма с предложением льготной программы.

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

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

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

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

Логотип клиники размещен в верхнем левом углу. Он слишком мелкий. Практически невозможно понять, что на нем изображено и прочесть текст.

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

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

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

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

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

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

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

Отличается название и информация в верхней части сайта:

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

В верхней части главной страницы сайта отсутствует подробная контактная информация. В частности, номера телефонов в Тель-Авиве, Москве и Киеве. На основной версии сайта они есть. Это крайне отрицательно сказывается на конверсии сайта.

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

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

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

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

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

Не выровнено положение левых границ полей формы относительно вертикальной границы:

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

Разный отступ между иконками и границами блока:

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

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

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

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

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

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

Фото на странице рекомендуем сделать шириной 100% окна браузера. Это придаст дизайну более завершенный и красивый вид.

Нет отступа между фото и текстом в блоке «Врачи».

Фото врачей рекомендуем сделать шириной 100% окна браузера.

В нижнем блоке с контактной информацией нет адреса представительства компании в Киеве. Нет отступа между иконками и адресами у email. Сейчас уже конец 2016-го года, а в копирайте указан 2015. Также допущены ошибки в оформлении текстов копирайта. Например, после тире текст написан с большой буквы.

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

Отдельно стоит отметить, что на главной странице расположено очень большое количество текстовой информации, она имеет большую высоту и большую часть контента пользователь просматривать не будет. Рекомендуем рассмотреть возможность сокращения объемов текстов и дизайна страницы в стиле «landing page».

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

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

Далее рассмотрим работу отдельных страниц сайта.

Страница «Врачи»

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

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

Рекомендуем использовать одинаковые отступы и привести написание специализации к единому виду. Если после ФИО врача стоит точка специализация должна начинаться с большой буквы, если запятая – с маленькой.

Страница детального просмотра профиля врача

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

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

Также рекомендуем выводить фото шириной 100% окна браузера.

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

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

Иконка email находится в одной строке, адрес email – в другой. Из-за этого дизайн выглядит неаккуратно.

Номер телефона переносится некорректно.

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

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

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

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

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

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

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

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

Отсутствуют ссылки на страницы некоторых заболеваний.

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

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

Страница «Процедуры»

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

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

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

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

Раздел «ЭКО» не содержит полезной информации:

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

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

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

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

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

Неверно интегрирована карта google. Она шире экрана. Из-за этого на странице появляется горизонтальная прокрутка и не видна кнопка открытия навигационного меню.

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