Как улучшить юзабилити сайта, UX/UI
Юзабилити (usability) — это показатель удобства использования, и взаимодействия пользователя с интерфейсом сайта. Данная метрика напрямую влияет на увеличение конверсии с сайта. Необходимо чтобы пользователь мог быстро найти нужную ему информацию, совершить покупку, или оставить заявку. Основная цель UX-анализа заключается в повышении ключевых показателей эффективности (KPI) после устранения обнаруженных проблем. С помощью перечисленных инструментов вы сможете самостоятельно выполнить анализ удобства использования сайта, и обнаружить проблемы интерфейса. Исправление выявленных проблем с юзабилити, повлияет в целом на эффективность продвижения сайта, и повысит уровень ПФ (поведенческие факторы).
Определение UX/UI-дизайна
- UX-дизайн (User Experience - пользовательский опыт) отвечает за работу интерфейса.
- UI-дизайн (User Interface - пользовательский интерфейс) отвечает за визуальное оформление интерфейса.
Два аспекта неотделимы друг от друга, и в настоящее время сложно представить, чтобы проектирование интерфейса могло проводиться без учета его внешнего вида, и наоборот, разработка UI без учета UX.
Дизайнер, работающий одновременно над UX и UI, называется дизайнером интерфейсов, или UX/UI-дизайнером. Он ведет весь процесс разработки интерфейса от постановки задачи до тестирования прототипа.
Инструменты для анализа юзабилити
Яндекс Метрика – бесплатный инструмент по анализу и юзабилити и тестированию. Используя «Вебвизор», можно отслеживать перемещение курсора пользователя, его клики, и взаимодействие с интерфейсом. Это как просматривать видеозапись визита посетителя своего сайта: куда он нажимал, что вводил в поиске, на каком этапе оформления заказа остановился, и что этому могло способствовать. При помощи «тепловой карты кликов» можно наглядно посмотреть самые кликабельные места на странице. Используя «карту скроллинга», можно узнать, как посетители прокручивают страницу, где дольше всего задерживается их внимание. Для анализа взаимодействия с формами на сайте используйте «аналитику форм», она покажет какие поля заполняют в запросе, что вводят пользователи в строке поиска, и другую информацию.
Также вам могут понадобится такие сервисы как: Hotjar, UsabilityHub, Plerdy, Crazy Egg, Inspectlet, Фабрика Юзабилити.
Методы повышения юзабилити
Работы над улучшением юзабилити сайта включают в себя множество факторов, основные из них представлены ниже.
- Скорость загрузки сайта. Статистика показывает, что при загрузке страницы более 3 секунд, пользователь ее покидает. Быстрая скорость загрузки также важна для корректной индексации поисковыми роботами.
- Адаптивная или мобильная версия сайта. Доля мобильного трафика с каждым годом растет, поэтому важно оптимизировать сайт под различные мобильные устройства.
- Качество контента. Часто говорят, что пользователи устают от чтения длинных текстов. Однако, согласно отчету аналитической компании Clicktale, длина страницы не влияет на вероятность того, что пользователь прокрутит страницу до низа. Количество текста, которое готов прочитать потенциальный клиент, зависит исключительно от качества контента. Мало кто захочет тратить время на поиск смысла в огромном объеме текста, но гораздо больше людей прочтут информативную и хорошо структурированную статью. Рекомендуется провести аудит всего контента на вашем сайте — удалить устаревшую и неточную информацию, исправить орфографические ошибки, и предоставить посетителям всю необходимую информацию для совершения целевого действия.
- Навигация сайта. Чем меньше кликов нужно совершить пользователю для выполнения целевого действия, тем лучше. Горизонтальное меню рекомендуется на сайтах, которые посвящены конкретной тематике, или корпоративным сайтам. Важные пункты в горизонтальном меню следует размещать в левой части. Применяйте вертикальное меню на крупных E-Commerce сайтах, или порталах с большим количеством категорий. Если количество посетителей вашего сайта стабильно или незначительно увеличивается, рекомендуется разместить меню с правой стороны, так как основная часть пользователей уже знакомы с его разделами.
- Дайте пользователю контроль. Предоставление пользователю возможности контроля, является важным аспектом пользовательского опыта. Карусель без кнопок навигации ограничивает возможности управления, что может привести к плохому взаимодействию с пользователем. Особенно важно учитывать это, когда карусель размещается в верхней части страницы, так как это будет первое, с чем будет взаимодействовать пользователь. Лучше всего придерживаться простого правила: реагировать только на явные действия пользователя и предоставлять возможность управления, если неизвестно, чего он хочет.
- Упростите процесс регистрации. Для обычного сайта регистрация должна быть настолько простой, насколько это возможно, с наименьшим количеством полей - в идеале, только с именем, почтой и паролем. Также полезно позволить пользователям, авторизоваться через свои учетные записи в социальных сетях, это быстро, легко и не требует ввода дополнительной информации.
- Ссылки с главной страницы на наиболее важные внутренние страницы. Создайте на главной странице блок с самые популярными или новыми товарами, услугами, или статьями. Если это интернет-магазин, то новинки или самые популярные товары. На главной странице следует публиковать новости, обновления и анонсы предстоящих акций.
- Проверьте как работает поиск на сайте, при необходимости улучшите его. Для удобства перемещения, на сайте должны присутствовать «хлебные крошки». В карточках товаров полезно размещать ссылки на «группы товаров», и ряд сопутствующих товаров.
- Контактная информация. Убедитесь, что вся контактная информация доступна для пользователя, и легко находится на сайте. К примеру, номер телефона обычно используют на видном месте в шапке сайта, подвале, и на странице контактов.
- Формы обратной связи. Не каждый пользователь захочет звонить, кому-то удобнее будет написать. Для этого на сайте рекомендуется использовать разнообразные методы обратной связи. Это могут быть: онлайн-чаты, формы заказа обратного звонка, и так далее.
- Кнопки с призывами действия. Основная задача предоставить пользователю инструмент для совершения целевого действия. К примеру, для интернет-магазинов такими кнопками будут: «купить», «заказать в 1 клик», для сайтов услуг соответственно «оформить заявку», «записаться», и так далее. Не забывайте, что основная задача — дать пользователю инструмент для совершения целевого действия. Для интернет-магазина такими кнопками будут являться «купить», «заказать в 1 клик», для сайтов услуг — кнопки «оформление заявки» и «записаться».
- Дизайн сайта. Важнейшим фактором при принятии решения у пользователя, является внешний вид сайта, поэтому важно учесть несколько основных правил. Рекомендуется не использовать одновременно множество цветов на странице (не более 3-5), размеры шрифтов и их начертания должны быть читаемы. Используйте шрифты из Google Fonts, чтобы обеспечить единое отображение на платформах Windows, Мac и UNIX. Чтобы проверить контраст шрифта/фона, сделайте скриншот, преобразуйте изображение в оттенки серого с помощью любого редактора изображений. Если текст можно легко прочитать, то контраст достаточный. Текстовые блоки разделяйте на логические составляющие, для улучшения восприятия информации. Общее оформление сайта должно придерживаться единого стиля.
- Элементы интерфейса. Использование Material design от Google, для создания интерфейсов, выводит на новый уровень использования визуализации. Нажатие пользователем на объект, запускает анимацию перетекания от текущей страницы к подгружаемой информации об этом объекте. Визуализация наглядно демонстрирует логические связи между элементами, откуда берется информация и куда она ведет.
- Фокусировка внимания. Часто пользователи могут лучше выполнить определенную задачу, если все другие элементы, которые не связаны с этой задачей, затемнены и несфокусированные. Это помогает уменьшить когнитивную нагрузку и упрощает взаимодействие с интерфейсом.
- Кнопка моментального скроллинга. Для страниц с объемным контентом, рекомендуется добавление кнопки «вверх». Как правило она появляется при скроле вниз страницы, и при нажатии, позволяет пользователю моментально перейти в верхнюю часть сайта
Для выявления более существенных проблем в интерфейсе, влияющих на конверсию посетителей, требуется проведение комплексной проверки. Такой аудит требует глубоких знаний в UX, веб-аналитики, понимания сферы электронной коммерции и, что важнее всего, опыта. В рамках такого аудита специалист по UX сопоставляет все полученные данные с помощью разных инструментов, для поиска оптимального решения. Заказать «аудит юзабилити» можно написав запрос в свободной форме на электронную почту, или мессенджеры, указанные на сайте, а также через «онлайн чат».