Главное Авторские колонки Вакансии Образование
😼
Выбор
редакции
4 556 1 В избр. Сохранено
Авторизуйтесь
Вход с паролем

Юзабилити сайта: что это, анализ, примеры и чек-лист

Что такое юзабилити сайта. Как проанализировать и улучшить юзабилити сайта. Какие инструменты помогут вам в анализе юзабилити. И получите чек-лист с 20 рекомендациями.
Мнение автора может не совпадать с мнением редакции

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

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

Например, Nature Air получили ошеломляющий рост конверсии с 3% до 19%, просто разместив кнопку call-to-action рядом с прайсом и продающим текстом. А Underwater увеличили конверсию в три раза, сделав анализ юзабилити и убрав все лишнее с целевой страницы.

Как добиться таких результатов? Прочесть эту статью до конца и внедрить рекомендации


Юзабилити сайта: что это такое

Юзабилити — ( англ. use ability — возможность пользоваться) термин, который означает удобство использования. Простой, удобный и интуитивно понятный для пользователя сайт = сайт с высоким юзабилити.

Известный эксперт по юзабилити Якоб Нильсен в работе «Why people shop on the web» называет 5 составляющих удобства сайта:

  1. Обучаемость. Насколько интуитивно понятен ресурс, как быстро пользователь может найти нужную информацию;
  2. Эффективность. Ознакомившись с сайтом один раз, насколько быстро человек сможет работать с ним дальше? Например, однажды оформив заказ, будет ли легче сделать это еще раз;
  3. Запоминаемость. Если покинуть сайт и вернуться через месяц, будет ли все еще просто им пользоваться, или придется изучать все заново;
  4. Ошибки. Сколько раз посетители сайта ошибаются, просто ли им исправить эти ошибки. Например, если человек забыл ввести е-мейл в форме заказа, сайт подскажет ему и поможет исправить, или просто сотрет все данные и заставит заново заполнять форму;
  5. Удовлетворенность. Комфортно ли пользователям находиться на сайте, насколько просто им выбрать продукт или оформить заказ.

Как юзабилити влияет на конверсию

Юзабилити напрямую влияет на конверсию коммерческих сайтов — от лендингов до интернет-магазинов:

  1. По данным Kissmetrics, 40% посетителей уходят с сайта, если страница грузится более 3 секунд.
  2. Согласно этому же исследованию, 44% пользователей покидают сайт, если там нет четкой контактной информации.
  3. Исследование Landauer гласит, что учет юзабилити при разработке сервиса снижает затраты по его поддержке на 700%.
  4. По данным Creative Good, интуитивно понятный путь оформления заказа увеличивает количество покупателей на 40%, а сумму заказа — на 10%.
  5. Согласно User Interface Engineering,предоставив клиенту полную информацию о товаре, можно увеличить объем продаж на сайте на 225%.
  6. Якоб Нильсен в исследовании «Loyalty on the web» утверждает, что новые клиенты оформляют заказ в интернет-магазине в среднем на $127, в то время как постоянный покупатель, которому удобно пользоваться сайтом, тратит почти в 2 раза больше: в среднем $251.

Кстати, юзабилити — важный критерий успеха не только сайта, но и любого продукта. К примеру, согласно исследованию Latirman, 58% мужчин, живущих в Великобритании, не пользуются стиральными машинами, потому что считают их слишком сложными. Дизайнер Питер Фабор даже выпустил специальные наклейки, которые помогают мужчинам постирать вещи.


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

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

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

Анализ юзабилити — это тестирование и поиск моментов, которые мешают пользователю комфортно взаимодействовать с ресурсом. Вы анализируете пользовательский опыт (user experience, UX), который человек получает на вашем сайте — и стремитесь сделать его более комфортным.

В целом, анализ юзабилити состоит из трех больших групп:

  1. Навигация: из чего состоит сайт;
  2. Информация: что можно прочесть на нем;
  3. Интерфейс: как он выглядит.

Какие же элементы сайта важно анализировать и как их улучшить? Давайте разбираться.

Навигация

Структура

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


Пример простой и интуитивно понятной структуры сайта — разработка для наших клиентов GoIT

Хлебные крошки

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


Хлебные крошки в магазине Цитрус

Путь к покупке

Согласно исследованию Baymard institute, существует три главные причины, по которым пользователи бросают корзины:

  1. слишком высокие цены на доставку или дополнительные комиссии (60%);
  2. необходимость заводить аккаунт для оформления покупки (37%);
  3. слишком сложный процесс оформления покупки (28%).

И если ценовая политика это отдельная тема, то путь оформления заказа — как раз вопрос юзабилити. Только вспомните, как бесит обязательная регистрация, подтверждение через е-мейл, четыре шага «Да, я точно хочу оформить заказ»... так и хочется бросить корзину!

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


Результаты исследования Джошуа Портера

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

Выбор товара

Согласно Web site design survey, 83% посетителей покидают сайт, если почувствуют, что им приходится слишком долго искать товар. Например, в этом случае клиенту придется отыскивать часы в нужном диапазоне стоимости.


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

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


При покупке билетов не видно, какой ряд вы выбираете

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

Поиск

Упрощая поиск товара, вы помогаете пользователю быстрее оформить заказ и тем самым повышаете конверсию. Например, компания Waterfilters.net, добавив опцию поиска по сайту, увеличила конверсию на 11%.

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

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

  1. Идеальное расположение строки поиска: верхний правый угол;
  2. Оптимальная длина окна запроса: около 30 символов;
  3. Адаптивный поиск: если точного совпадения с запросом нет, предлагайте альтернативу. Например, если человек ищет модель телефона, которой нет в наличии, покажите смежные модели.

Выделенное поле поиска: строку поиска хорошо видно на странице, ее не нужно выискивать взглядом.

Информация

Качество контента

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


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

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

Подача товара

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

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


Контакты

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

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

Интерфейс

Дизайн

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

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


Дизайн сайта, давно утративший актуальность

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

Скорость загрузки

Поисковые алгоритмы не жалуют сайты с низкой скоростью загрузки — и все же такие еще бывают. Согласно Якобу Нильсену, человек согласен ждать загрузки страницы всего 3 секунды. Если каждая ваша страница загружается гораздо дольше, посетителям быстро надоест ждать — быстрее уйти к конкурентам, где страницы грузятся по щелчку пальцев.

Мобильная версия

Согласно StarCounter, два года назад произошел поворотный момент — количество мобильного трафика впервые превысило десктопный. При этом Cisco прогнозирует, что к 2021 году мобильный трафик превысит показатели 2016 года в семь раз.

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

Сегодня в мобайл-версии ушли все: существуют даже русский Tinkoff-банк и украинский Monobank, которые работают исключительно в приложениях. Поэтому важность адаптивной версии сайта и (если в этом есть надобность) разработки приложения сложно переоценить. Проверьте, логично ли отображается ваш сайт на мобильных устройствах и планшетах и удобно ли им пользоваться даже с маленького экрана.

Страница 404

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


Информативная 404 страница Facebook

Инструменты для анализа юзабилити

Кроме мануального анализа, для аудита юзабилити можно использовать специальные сервисы. Самые популярные среди них — Google Analytics, Яндекс.Метрика, Liveinternet. Все эти инструменты схожи по функционалу: вы можете посмотреть, сколько пользователь находился на сайте и на какие страницы переходил, какой процент пользователей захотел вернуться и т.д.

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

Google Analytics

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

  1. Вебвизор. Помогает своими глазами увидеть, что делал человек на вашем сайте: куда конкретно наводил курсор, какие кнопки нажимал, на какие страницы заходил. Эта информация поможет понять, что стоит исправить и улучшить в интерфейсе сайта.
  2. Тепловая карта. Показывает наиболее кликабельные участки на странице.

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

Usability Hub

Платный сервис для проверки сайта, который предлагает пройти пять тестов юзабилити:

  1. Тестирование кликов
  2. Опросник для реальных людей
  3. Навигационный анализ
  4. Предпочтения в дизайне
  5. Пятисекундный тест — оценка первого впечатления о сайте

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

Feng-GUI

В отличии от предыдущего сервиса, здесь ваш сайт тестируют не реальные люди, а программный алгоритм. Он автоматически и бесплатно генерирует карту внимания посетителей на вашем сайте. Для этого достаточно просто ввести URL и нажать клавишу Analyse.


Чек-лист юзабилити сайта

  1. На главной странице сайта есть логотип компании, четкое УТП, понятное меню, контакты.
  2. Кнопки призыва к действию расположены в заметном месте и дополнены продающим текстом.
  3. На сайте есть простая и интуитивно понятная навигация.
  4. Если страниц на сайте много, есть «хлебные крошки», которые помогают быстро попасть в нужный раздел.
  5. Все страницы сайта загружаются быстро, за 0-2 секунды.
  6. Тексты на сайте понятные, хорошо структурированы и написаны без воды.
  7. Сайтом можно управлять только мышкой, только тачпадом или клавиатурой.
  8. У сайта есть мобильная версия, с которой удобно работать даже с маленького экрана.
  9. Путь оформления заказа на сайте максимально простой и короткий.
  10. Функция «Поиск» в верхней части страницы и заметна в первые 3 секунды.
  11. На сайте есть полная информация о товаре, способах оплаты и доставки.
  12. Страница с 404 ошибкой выполнена в дизайне сайта и с нее можно перейти на главную страницу.
  13. Клик по логотипу на любой странице возвращает покупателя на главную.
  14. На странице нет автоматического воспроизведения музыки или видео со звуком.
  15. У сайта современный дизайн, который поддерживает юзабилити, а не мешает ему.
  16. На странице контакты указаны все способы связи и график работы, есть карта и описание «Как добраться».
  17. Посетитель может найти на сайте всю информацию, которая интересна ему о продукте.
  18. Если он не нашел информации — он быстро найдет номер телефоначат, где можно задать свой вопрос.
  19. Изображения и видео на сайте качественные и быстро загружаются.
  20. Процесс выбора товара и оформления заказа простой и занимает минимальное количество времени.

И напоследок. Генри Форд сказал:

«Если бы я спросил людей, чего они хотят, они попросили бы более быструю лошадь».

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

Дерзайте!

0
В избр. Сохранено
Авторизуйтесь
Вход с паролем
Комментарии
Игорь Стальной
Юзабилити очень важный фактор длч привлечения новых и удержания старых пользователей сайта, многое из чек листа использовал в работе над сайтом онлайн казино эльслотс https://www.morgan-club.com.ua/ особенно на страницах с игровыми автоматами и бонусами.
Ответить
Выбрать файл
Блог проекта
Расскажите историю о создании или развитии проекта, поиске команды, проблемах и решениях
Написать
Личный блог
Продвигайте свои услуги или личный бренд через интересные кейсы и статьи
Написать

Spark использует cookie-файлы. С их помощью мы улучшаем работу нашего сайта и ваше взаимодействие с ним.