Surf 
Тендеры и лиды
Информация
Разбираем, как улучшить юзабилити работающего сайта под конверсию: где искать проблемы по данным поведения, как связать их с деньгами, какими бесплатными инструментами провести аудит своими силами и что чинить в первую очередь при ограниченном бюджете.
Знакомая ситуация: на сайт идёт трафик, реклама откручивается, а заявок и покупок мало. Первым под подозрение попадает маркетинг, хотя виноват часто сам сайт. Посетитель пришёл, не нашёл нужное, не понял, что делать дальше, застрял на форме — и ушёл. За этот визит вы уже заплатили рекламой или трудом над SEO, а он ничем не закончился. Юзабилити сайта — это ровно про то, сколько из пришедших людей доходят до цели, и работа над ним обычно окупается быстрее, чем новая порция трафика. По данным Baymard Institute, в среднем около 70% корзин в интернет-магазинах бросают, и заметная доля этих потерь — из-за юзабилити: слишком длинной формы, обязательной регистрации, скрытых условий доставки.
Сразу разграничим темы, чтобы не путаться. Эта статья — про улучшение уже работающего сайта под конверсию. Это не то же самое, что UX-тестирование (проверка понятности интерфейса на живых пользователях, обычно ещё на прототипе) и не UX-исследования (discovery, чтобы понять аудиторию до дизайна). Мы в Surf проводим UX/UI-аудит, делаем дизайн интерфейсов и занимаемся всеми тремя направлениями, но здесь речь про оптимизацию готового продукта. Если нужен полный разбор с методиками и расчётом ROI, у нас есть подробное руководство — ниже практический минимум.
Главная ошибка в отношении к юзабилити — считать его вопросом вкуса и эстетики. На деле это вопрос конверсии. Красивый сайт, на котором не найти телефон и не оформить заказ, теряет деньги, а некрасивый, но понятный — зарабатывает. Поэтому оценивать юзабилити стоит не «нравится или нет», а по простому критерию: какая доля посетителей делает то, ради чего вы их привели.
Отсюда и правильная логика улучшений. Не «давайте обновим дизайн, он устарел», а «где именно люди отваливаются и сколько это стоит». Каждая проблема юзабилити — это утечка в воронке: посетители доходят до определённого шага и уходят. Найти эти шаги, оценить потери в деньгах и заткнуть самые дорогие дыры — вот что такое работа над юзабилити на языке бизнеса.
Проблемные места на сайтах повторяются из проекта в проект. Полезно знать их в лицо и понимать, каким сигналом в данных каждая проблема себя выдаёт и чем лечится.
Запутанная навигация
Сигнал в метриках: высокий отказ, малая глубина
Чем проверить: вебвизор, карта кликов
Что делать: упростить меню, добавить заметный поиск
Длинная или сложная форма
Сигнал в метриках: форму открывают, но не отправляют
Чем проверить: аналитика форм в Метрике
Что делать: убрать лишние поля, разбить на шаги
Медленная загрузка
Сигнал в метриках: отказы, особенно на мобильных
Чем проверить: PageSpeed, Core Web Vitals
Что делать: сжать картинки, включить кэш
Незаметный призыв к действию
Сигнал в метриках: мало кликов по кнопке
Чем проверить: тепловая карта, карта кликов
Что делать: контраст, разместить выше сгиба
Плохая читаемость
Сигнал в метриках: мало времени, быстрый уход
Чем проверить: карта скроллинга
Что делать: крупнее шрифт, короче абзацы
Невнятные ошибки на форме
Сигнал в метриках: бросают на шаге проверки полей
Чем проверить: вебвизор
Что делать: понятные подсказки, подсветка поля
Отдельно стоит выделить скорость и мобильную версию. На них часто смотрят в последнюю очередь, а по факту это главный источник потерь: если страница грузится долго, значительная часть посетителей уходит ещё до того, как увидит ваш прекрасный контент, и на смартфонах это заметнее всего.
Чтобы не оценивать сайт наугад, удобно пройтись по десяти классическим принципам юзабилити Якоба Нильсена. Это не теория для галочки, а рабочий чек-лист: по каждому пункту спросите себя, выполняется ли он на вашем сайте.
Система показывает, что происходит: есть индикаторы загрузки, статусы заказа, отклик на действия.
Язык интерфейса понятен пользователю, а не написан на внутреннем жаргоне компании.
Из любого места легко вернуться назад и отменить действие.
Всё единообразно: одинаковые вещи выглядят и называются одинаково на всех страницах.
Ошибки предотвращаются заранее, а не выявляются уже постфактум.
Нужное видно на экране, его не приходится вспоминать и держать в голове.
Опытный пользователь может действовать быстро, есть удобные короткие пути.
В интерфейсе нет лишнего, что отвлекает от главного действия.
Сообщения об ошибках понятны и подсказывают, как исправить.
Там, где нужно, есть помощь и подсказки.
Даже беглый проход по этому списку обычно вскрывает несколько очевидных проблем, которые замыленный глаз давно перестал замечать.
Наша система сама подберет вам исполнителей на услуги, связанные с разработкой сайта или приложения, поисковой оптимизацией, контекстной рекламой, маркетингом, SMM и PR.
Заполнить заявку
13691 тендер
проведено за восемь лет работы нашего сайта.
Хорошая новость: чтобы понять, где сайт теряет людей, не нужен дорогой аудит — большую часть можно сделать самому на бесплатных инструментах за несколько дней.
Начните с поведения. В Яндекс Метрике включите вебвизор — он записывает сессии, и вы своими глазами увидите, как люди водят мышкой, где замирают, как безуспешно тыкают в некликабельное. Тепловые карты и карта кликов покажут, что замечают, а что нет; карта скроллинга — до какого места вообще долистывают. Отдельно посмотрите аналитику форм: она подсвечивает, на каком поле люди бросают заполнение. Бесплатный Microsoft Clarity делает то же самое с записями и картами и хорошо дополняет Метрику. Скорость проверьте через PageSpeed Insights и показатели Core Web Vitals.
Смысл не в том, чтобы собрать красивые графики, а в том, чтобы из каждого наблюдения родить гипотезу правки. Увидели в вебвизоре, что половина посетителей на мобильном не доходит до кнопки заказа, потому что она ниже трёх экранов, — это гипотеза: поднять кнопку выше. Заметили в аналитике форм, что бросают на поле «отчество», — гипотеза: убрать его. Данные без выводов бесполезны; ценность появляется, когда каждая находка превращается в конкретную задачу.
Проблем аудит обычно находит больше, чем есть рук и бюджета их исправить, поэтому важно не хвататься за всё сразу. Правки удобно сортировать по соотношению эффекта к усилиям: сначала делать то, что даёт много и стоит дёшево.
Разложите найденное на четыре типа. Дёшево и эффективно — это ваши первоочередные задачи, их делают сразу: переписать кнопку, убрать поле из формы, поправить контраст. Дорого, но эффективно — планируют отдельно, это редизайн раздела или ускорение сайта. Дёшево, но с малым эффектом — делают между делом. Дорого и с малым эффектом — не трогают вовсе. Такой подход бережёт от типичной ошибки, когда команда месяцами переделывает то, что почти не влияет на деньги, игнорируя быстрые правки с большой отдачей.
Юзабилити окупается, когда интерфейс строят вокруг реального пользователя, а не вокруг вкусов команды. Для дома моды Henderson мы делали продукт, отталкиваясь от того, что важно их покупателю: короткий путь к покупке, понятная примерка по фигуре, сохранённые мерки, готовые образы вместо бесконечного каталога.
По данным кейса Henderson, выстроенный вокруг аудитории интерфейс помог приложению стать одним из ключевых каналов продаж бренда. Это мобильное приложение, но принцип на сайте работает точно так же: чем понятнее и короче путь человека к цели, тем больше людей до неё доходят. Юзабилити не украшение, а способ не терять тех, кого вы уже привели.
Работа над юзабилити чаще буксует не из-за сложности, а из-за неверного подхода. Вот что мешает.
Правки по вкусу, а не по данным. «Мне кажется, так лучше» вместо «вебвизор показывает, что тут бросают». Юзабилити проверяется поведением, а не мнением в кабинете.
Редизайн вместо точечных правок. Вместо того чтобы починить конкретные утечки, переделывают весь сайт, тратят месяцы и часто ломают то, что работало.
Игнор мобильных и скорости. Оптимизируют десктоп, где сидит меньшая часть аудитории, и теряют большинство на медленном мобильном.
Аудит без внедрения. Нашли проблемы, составили отчёт, положили в стол. Ценность — в исправлениях, а не в списке замечаний.
Юзабилити сайта — это про конверсию и деньги: сколько из пришедших доходят до цели, а не про красоту.
Улучшать стоит по данным: искать, где люди отваливаются, и оценивать потери, а не менять дизайн по вкусу.
Частые утечки — навигация, длинные формы, скорость, мобильная версия, незаметный призыв к действию, читаемость.
Найти проблемы можно самому и бесплатно: вебвизор и тепловые карты Метрики, Microsoft Clarity, PageSpeed.
Чинить нужно по порядку: сначала дешёвые правки с большим эффектом, а не всё подряд и не самый дорогой редизайн.
Юзабилити сайта — это не разовый косметический ремонт, а работа с воронкой, в которой каждый непонятный экран стоит вам клиентов, за приход которых вы уже заплатили. Найти узкие места по данным и починить самые дорогие из них почти всегда выгоднее, чем лить в дырявую воронку ещё больше трафика. Поэтому начинать стоит не с нового дизайна, а с вопроса, где именно и почему вы теряете людей.
Владимир Макеев, генеральный директор Surf — компании по разработке и дизайну цифровых продуктов для крупного и среднего бизнеса.
