«Покупатель не может купить товар, если он не может его найти» — так звучит один из принципов цифровой коммерции. Если адаптировать его в нынешних реалиях с учётом огромной конкуренции в интернет-торговле, то звучать он будет так: «покупатель не купит товар, если не сможет его БЫСТРО найти». Именно за скорость и удобство поиска на вашем сайте и отвечает юзабилити. Разберём подробнее, что такое юзабилити и как его грамотно настроить.
Что такое юзабилити
Юзабилити — это показатель того, насколько ваш сайт удобен в использовании. Например, для хорошей конверсии интернет-магазина недостаточно, чтобы пользователь просто перешёл на сайт. Ему ещё нужно найти на нём нужные товары, положить в корзину, оформить заказ, произвести оплату и отследить пересылку.
Лаконичное меню и удобная навигация на digital-academy.ru
Можно выделить несколько параметров юзабилити сайта или приложения.
- Легко изучить. Пользователю просто найти нужное меню, навигация удобная, никакие элементы вроде всплывающих окон и рекламы не мешают сориентироваться.
- Легко запомнить. При повторном посещении пользователь быстро найдёт всё нужное.
- Легко исправить свои ошибки. Если пользователь случайно нажал не ту ссылку или кнопку, ему будет легко вернуться.
От того, насколько пользователь удовлетворён сайтом, зависит, вернётся он или нет, рекомендует ли он вашу страницу друзьям и перейдёт ли по вашей следующей рекламе.
Настолько плохой сайт, что сам себя называет «уродливым». Источник: thebiguglywebsite.com
На что влияет юзабилити и зачем вообще за этим следить
Юзабилити непосредственно влияет на важнейшие показатели:
- конверсию,
- глубину просмотра страницы,
- повторные визиты,
- время на сайте,
- количество отказов.
А от этих параметров напрямую зависит прибыль бизнеса, который тратит немалые средства на то, чтобы привлечь клиентов на сайт. Можно сделать какую угодно красивую и привлекательную рекламу, которая побудит клиента перейти на сайт. Но если он за короткое время не сможет найти то, что ему нужно, все усилия окажутся не просто напрасными — пользователь не только закроет страницу, но и составит о вас плохое впечатление на будущее.
Например, Ostrovok, сайт для бронирования отелей, предлагает пользователю множество фильтров для выбора: месторасположение, категорию отеля, звёздность, тип питания, наличие различных услуг и даже возможность выбрать размещение ближе к достопримечательностям. Таким поисковиком удобно пользоваться всегда, клиент наверняка и в следующий раз как минимум придёт, чтобы сравнить цены.
Каталог на ostrovok.ru
Представим, что вы зашли в книжный магазин за конкретным произведением. Но книги на полках расставлены, на первый взгляд, без какой-либо логики, вы не можете самостоятельно найти нужный экземпляр. Продавец занят с другим покупателем и просит подождать. Надолго ли вы готовы задержаться, чтобы купить книгу именно здесь, если рядом ещё с десяток таких же магазинов, где всё логично и понятно расставлено по алфавиту? Такая же ситуация с сайтом. Конкуренция в интернете огромная, и пользователи не готовы напрягаться, чтобы разобраться с невнятными страницами.
Главная letu.ru
Посмотрим на сайт магазина косметики «Л'Этуаль». Из-за большого количества изображений страница грузится дольше обычного. Меню над поисковой строкой кажется непонятным и нелогичным: здесь и доставка, и подарочные сертификаты, и бренды. Российские бренды зачем-то выделены в отдельный пункт, а что имеется в виду под «Аптекой» и «Clean Beauty», можно узнать только перейдя на эти страницы. Пользователь может предпочесть один из популярных и более удобных маркетплейсов, где есть больше эксклюзивной продукции.
Научиться делать красивые и одновременно удобные страницы можно и нужно. Мы собрали для вас подборку относительно коротких курсов, которые помогут разобраться в тонкостях создания сайтов и лендингов. Программы рассчитаны на новичков и научат вас системному подходу к работе над сайтом или лендингом и помогут избежать распространённых ошибок.
Главные критерии юзабилити сайта
При разработке сайта нужно учитывать множество деталей интерфейса, а критерии зависят от типа сайта: интернет-магазин, лендинг, сайт-визитка и т. д. Мы приведём здесь несколько основных универсальных параметров юзабилити.
Технические возможности
Комфортная для пользователя скорость загрузки сайта — 1–2 секунды. Если вашему сайту, особенно стартовой странице, нужно больше времени — это уже недочёт. Оптимизация сайта позволит добиться хорошей скорости загрузки. Проверьте, чтобы код не был перегружен, картинки не весили слишком много. В погоне за красочностью легко перегрузить сайт ненужными изображениями.
Сайт, посвящённый фильму «Комната» (The room, 2003)
Другие технические ошибки — битые ссылки, кривая вёрстка, некликабельные кнопки — тоже испортят впечатление пользователя. Ещё один важный пункт — оформление текстов. Важно проверять, насколько удобно их читать с точки зрения выбора шрифтов, контрастности и других особенностей визуала, насколько они информативны и соответствуют типу сайта. Например, для литературного блога и интернет-магазина нужна совершенно разная подача. Если в первом случае пользователь ждёт и будет рад лонгридам, то описания товаров должны быть одновременно краткими и максимально информативными.
Примером неудачного сайта может быть официальная страница фильма «Комната» (The room, 2003). Сама картина настолько плоха, что стала культовой. Сайт фильма претендует на ту же славу. Нечитабельный шрифт, отсутствие навигации, огромное количество различных гифок делают его максимально непривлекательным.
Вид главной страницы
«Лицо» вашего сайта — главная страница — отвечает за первое впечатление и должна быть одновременно информативной и симпатичной. Оказавшись на ней, пользователь должен сразу понимать, чем вы занимаетесь и что продаёте.
Визуал имеет важное значение. Читабельные тексты, понятная структура, оформление всех страниц сайта в едином стиле и даже выбор цветовых решений — всему нужно уделить внимание.
На главной странице отеля сразу все понятно: красивый отель на море. Удобное меню слева, где можно найти описание номеров, ещё фотографии, кнопку для бронирования и контакты. Источник: monasterosantarosa.com
Главная страница отеля, она же единственная. Навигации на сайте нет, для получения информации страницу нужно прокрутить вниз. Кнопки «Наверх» тоже нет, вернуться можно тоже только прокруткой. Источник: domumore.ru
Навигация
Юзабилити — это в первую очередь о простой и понятной навигации. Пользователю должно быть легко находить нужную информацию и товары. Для этого следует обратить внимание на следующие настройки.
- Кнопка или строка поиска должна быть хорошо видна. Её можно для удобства закрепить на всех страницах.
- «Хлебные крошки» — подсказки от главной страницы до текущей — помогут пользователю ориентироваться, где именно на сайте он находится. А если «крошки» сделать кликабельными, пользователю будет легко вернуться на нужное количество шагов назад.
- Если страница длинная, на несколько прокруток, то будет полезна кнопка «Наверх».
- Кнопка возврата должна корректно работать на всех страницах и во всех браузерах и возвращать пользователя на страницу назад, сохраняя при этом настройки фильтров.
- Кнопка «Вернуться на главную» должна работать со всех страниц. Её можно оформить в виде кликабельного логотипа или отдельной кнопки.
На сайте интернет-магазина Lamoda с помощью хлебных крошек удобно проследить всю навигацию и вернуться на несколько шагов назад
Адаптивность
Сайт должен быть одинаково полезным и привлекательным для всех экранов — большого монитора, ноутбука, планшета или смартфона. Если сайт одностраничный или небольшой, адаптивной вёрстки может быть достаточно. Но для многостраничных сайтов с большим количеством контента понадобится мобильная версия.
Адаптивная и неадаптивная страницы. Источник: unixar.ru
Если пользователь не сможет полноценно использовать сайт на своём мобильном устройстве, он скорее найдёт более удобный интернет-магазин, чем будет искать подходящий экран. Адаптивная вёрстка — это навык, который встречается практически во всех вакансиях для верстальшик и разработчиков сайтов.
Как понять, что надо улучшить? Пара слов о тестировании юзабилити
Определить самостоятельно, действительно ли сайт удобен, может быть достаточно сложно. Особенно если вы делали сайт сами, и вам-то точно всё на нём понятно. Найти возможные ошибки поможет тестирование.
Слишком большое количество всплывающей рекламы гарантированно отпугнет пользователей. Источник: grozza.ru
Тестирование для уже работающего сайта поможет проверить, что именно не нравится пользователям и почему они уходят, не выполнив целевого действия. Можно проверить, достаточно ли легко:
- найти товары и информацию на сайте;
- оформить покупку выбранного продукта;
- найти оформленные товары в личном кабинете;
- найти информацию о доставке и других дополнительных услугах;
- получить при необходимости консультацию сотрудника.
Тестирование нового сайта поможет найти все ошибки ещё до его запуска и предотвратить напрасные расходы на рекламу.
Провести простое тестирование можно в несколько шагов.
- Определить задачи тестов. Что именно вы хотите проверить на своём сайте.
- Составить сценарий. Подробности не всегда нужны. Например, если вы хотите проверить, насколько легко найти конкретный товар на вашем сайте, достаточно дать тестировщикам название этого продукта.
- Найти респондентов — тех, кто будет проверять сайт. Лучше всего, если они соответствуют вашей целевой аудитории. В благодарность вы можете предложить небольшое денежное вознаграждение либо скидку на ваш товар и услугу.
Тестирование больших сайтов и интернет-магазинов лучше всё же доверить специальному агентству. Специалисты знают, каким параметрам нужно уделить особое внимание и сколько тестов нужно провести. В итоге вам составят подробные отчёты и рекомендации по оптимизации юзабилити.
