UX-аудит сайта: что это, как провести самому и что должно быть в отчёте

Термин «UX-аудит» размыт до предела: под ним продают и трёхчасовой прогон по эвристикам Нильсена, и полугодовое исследование с интервью, и просто редизайн под видом анализа. Этот гид про исходное значение: систематическую проверку живого сайта экспертом или инструментом по заранее известным критериям.

Главное отличие от юзабилити-тестирования: в аудите нет респондентов. Аудит отвечает на вопрос «где интерфейс нарушает известные закономерности поведения людей», тестирование на вопрос «что именно сделают эти десять человек». Первое быстрее и дешевле, второе глубже. По оценке Nielsen Norman Group, эвристическая оценка находит порядка 75–80% проблем, которые затем подтверждаются на тестах.

Чем UX-аудит не является

• Не редизайн.Аудит фиксирует дефекты и их последствия, а не предлагает новую визуальную концепцию. Если в отчёте больше макетов, чем находок, вам продали дизайн.
• Не SEO-аудит.Пересечение есть (скорость, мобильная версия, структура), но UX-аудит смотрит на путь человека к целевому действию, а не на индексацию.
• Не полный краулер.Проверять 3000 карточек товара бессмысленно: они собраны из одного шаблона. Аудит берёт главную, основные типы страниц и сценарии до цели.
• Не универсальный чек-лист без сегмента.Одна и та же витрина для B2B-оптовика и розничного покупателя имеет разные «ошибки». Подробнее в статье об оценке глазами ICP.

Этап 1. Зафиксировать сегмент и целевое действие

До первого скриншота нужно ответить на два вопроса: кто пользователь и что он должен сделать. «Купить», «оставить заявку», «записаться на приём», «скачать прайс». Это разные пути с разными точками трения. Без ответа аудит превращается в перечисление вкусовых замечаний к цветам.

Сегмент (ICP, ideal customer profile) обычно виден по витрине: оффер первого экрана, цены, FAQ, структура каталога. Если сайт продаёт и оптом, и в розницу, аудит делают отдельно под каждый сегмент или явно выбирают приоритетный.

Этап 2. Снять главную и построить план сценариев

Главная страница: карта сайта глазами пользователя. По её ссылкам строится план: какие типы страниц существуют (каталог, карточка, услуги, контакты, цены), какие сценарии ведут к цели. Аудитор проходит их в том же порядке, что и посетитель, а не по карте сайта из XML.

На этом этапе фиксируется и первая группа измеримых метрик: время до первого байта, отрисовка первого экрана, ошибки консоли, редиректы. Как скорость превращается в потерянные заявки, разобрано в статье о скорости и конверсии.

Этап 3. Проход к цели в живом браузере

Главный источник реальных находок — это попытка дойти до целевого действия так, как это делает человек: кликнуть по кнопке, заполнить форму, выбрать вариант, дождаться ответа. На этом этапе всплывает то, что не увидеть на скриншоте: мёртвые кнопки, формы, стирающие введённое при ошибке, модальные окна, которые не закрываются на смартфоне, шаг оплаты с неожиданной комиссией.

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

Этап 4. Измеримые проверки по стандартам

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

• Доступность уровня A (WCAG 2.2):критические и серьёзные нарушения по axe-core: отсутствующие подписи полей, кнопки без имени, изображения без alt. Что из этого реально влияет на продажи, разбирает статья о доступности как конверсии.
• Размер тач-таргетов:интерактивные элементы меньше 24×24 CSS-px на мобильной версии. Детали в разборе ловушек тач-интерфейсов.
• Видимость фокуса:можно ли пройти форму клавишей Tab и видеть, где вы находитесь.
• Длина форм:число видимых полей в самой длинной форме без чекбоксов и скрытых модалок. При 7–9 полях предупреждение, при 10 и больше — серьёзная проблема. Обоснование в статье о длине лид-форм.

Этап 5. Эвристики и тексты

После измеримого слоя идёт экспертный: соответствие десяти эвристикам Нильсена, логика навигации, видимость состояния системы, обратимость действий. Отдельным проходом проверяют тексты: орфография, грамматика, тон для сегмента, ИИ-штампы и микрокопия кнопок и ошибок.

Общие блоки считаются один раз. Одна и та же шапка с мелкими ссылками, один подвал, одна ошибка консоли на всех страницах: это одна находка со списком адресов, а не двадцать одинаковых. Иначе отчёт раздувается, а приоритеты тонут в дубликатах.

Чек-лист самостоятельного аудита: 40 проверок за день

Если бюджета на внешний аудит нет, минимальный прогон можно сделать своими силами. Ниже сжатый чек-лист по блокам; каждый пункт проверяется на десктопе и на смартфоне.

• Первый экран (6):понятно, что продают и кому; есть один главный CTA; цена или её ориентир видны без прокрутки; нет автопроигрываемого видео со звуком; шапка не занимает треть экрана на телефоне; логотип ведёт на главную.
• Навигация (6):меню помещается на смартфоне; активный раздел подсвечен; поиск даёт результат по опечатке; хлебные крошки на глубоких страницах; нет ссылок на 404; кнопка «Назад» браузера не ломает состояние.
• Формы (8):подписи видны после ввода; телефон принимает +7 и пробелы; ошибка показывается рядом с полем; данные не стираются при ошибке; кнопка блокируется на время отправки; есть подтверждение успеха; обязательные поля отмечены; число полей не больше семи.
• Кнопки и ссылки (6):каждая кнопка что-то делает; внешние ссылки не ведут в никуда; нет одинаковых подписей «Подробнее» на разные действия; фокус виден; размер не меньше 24×24 px; состояние наведения отличается от обычного.
• Скорость (5):первый байт до 800 мс; первый экран до 2,5 с на 4G; клик открывает страницу быстрее 1 с; нет повторных загрузок; изображения не прыгают при загрузке.
• Тексты (5):нет орфографических ошибок; нет «инновационных решений» без конкретики; цифры и сроки конкретные; юридические обещания соответствуют оферте; тон соответствует сегменту.
• Доверие и оплата (4):контакты и реквизиты находятся за один клик; политика возврата понятна до оплаты; итоговая сумма с доставкой видна до ввода карты; способы оплаты локальные (СБП, Mir Pay).

Что должно быть в отчёте

Отчёт полезен ровно настолько, насколько его можно превратить в задачи. Хороший отчёт читает разработчик, а не только руководитель. Признаки рабочего отчёта:

1. 1
   Адрес и селектор.Каждая находка привязана к URL и элементу, который можно найти в DOM. «На сайте плохо с формами» не находка.
2. 2
   Серьёзность с обоснованием.High блокирует путь к цели или противоречит фактам, medium создаёт трение, low — это косметика. Тексты получают high только на первом экране главной или при противоречии.
3. 3
   Воспроизведение.Что сделать, чтобы увидеть проблему: устройство, шаги, ожидаемое и фактическое поведение.
4. 4
   Раздел «Что исправить в первую очередь».Пять-семь пунктов, закрывающих максимум потерь. Остальное: долг с приоритетами.
5. 5
   Измерения отдельно.Скорость страниц, задержки кликов и заполнения в своей таблице, а не вперемешку с эвристиками.
6. 6
   Механизм контроля.Как убедиться, что проблема закрыта. Разовый аудит без повторной проверки устаревает за один релиз, об этом статья о регрессиях интерфейса.

Сколько стоит UX-аудит и когда он окупается

Экспертный аудит агентства в РФ стоит от 80 до 400 тысяч рублей и занимает две-четыре недели. Автоматизированный аудит в живом браузере обходится бесплатно или в несколько тысяч рублей и занимает десятки минут. Они не взаимозаменяемы: агентство даёт глубину интервью и стратегию, автоматика даёт скорость, повторяемость и точные селекторы.

Окупаемость считается просто: при 20 000 посетителей в месяц и конверсии 1,5% каждая десятая процента конверсии это 20 заявок. Если аудит находит хотя бы один дефект, снижающий конверсию на эти 0,1%, он окупился в первый месяц. Подробный расчёт экономики в разборе кейса «кнопки на 300 миллионов».