UX-аудит сайта своими силами — чек-лист на 30 пунктов

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

Как провести UX-аудит сайта самостоятельно

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

1. Запишите три главных сценария. Например: узнать цену услуги, оставить заявку, найти телефон. Аудит без сценариев превращается в спор о цвете кнопок.
2. Откройте сайт в окне инкогнито — сначала на телефоне, потом на компьютере. Не входите в аккаунт и не открывайте админку.
3. Пройдите каждый сценарий и шесть блоков ниже. Только отмечайте, ничего не чините по ходу — иначе вы застрянете на третьем пункте.
4. Каждой находке поставьте две оценки — сколько людей она задевает и во что обходится. Этого хватит, чтобы потом выбрать, что чинить.
5. Попросите ещё одного-двух человек пройти тот же список отдельно от вас и только потом сравните результаты.
6. Сверьте догадки с данными: карта кликов, Вебвизор и аналитика форм в Яндекс Метрике, скорость в PageSpeed Insights.
7. Исправьте первые пять находок и покажите сайт пяти живым людям с заданием. Вопрос «ну как вам» ничего не даст.

Пятый шаг кажется лишним, пока не посмотришь на цифры. Якоб Нильсен, соавтор десяти эвристик юзабилити, по которым интерфейсы проверяют с 1994 года, подсчитал: один проверяющий находит в среднем 35% проблем. Поэтому Nielsen Norman Group советует три-пять независимых проверяющих по часу-два каждый. Для седьмого шага у них же есть классика: пять пользователей находят около 85% проблем, и три маленьких теста полезнее одного большого.

Блок 1. Первый экран

Первый экран решает, будет ли второй. Здесь проверяется одно: человек понял, куда попал, и видит, что делать дальше.

• 1. Понятно, что здесь продают. Как проверить: покажите экран постороннему на пять секунд, закройте и спросите, что предлагает компания и кому. Провал: «Комплексные решения для роста вашего бизнеса» — так может называться что угодно, от бухгалтерии до шиномонтажа.
• 2. Главное действие одно. Как проверить: прищурьтесь, чтобы текст расплылся. Какая кнопка видна первой? Провал: три одинаковых кнопки — «Подробнее», «Каталог», «Связаться» — и ни одна не главная.
• 3. Кнопка говорит, что будет после нажатия. Как проверить: прочитайте надпись вслух без контекста. Провал: «Отправить» вместо «Получить расчёт за день».
• 4. Способ связаться находится за пять секунд. Как проверить: засеките время. Провал: телефон только в подвале, и тот картинкой.
• 5. Ничто не закрывает содержимое. Как проверить: откройте сайт на телефоне и посчитайте слои поверх текста. Провал: баннер про куки, окно подписки через три секунды и чат-виджет с приветствием — всё одновременно. Посетитель пришёл за услугой, а попал в квест «найди крестик».

Блок 2. Навигация и поиск

Навигация — это обещание, что нужное найдётся. Проверяют её на одно: говорит ли она на языке клиента.

• 6. Меню написано словами клиента. Как проверить: сравните пункты меню с тем, как клиенты формулируют запрос в письмах и звонках. Провал: «Решения», «Экосистема», «Платформа» — внутренние слова компании, которые снаружи никто не ищет.
• 7. Всегда понятно, где я. Как проверить: откройте любую глубокую страницу по прямой ссылке. Видно ли, в каком она разделе? Провал: страница без заголовка и без выделенного пункта меню.
• 8. Кнопка «назад» не ломает путь. Как проверить: поставьте фильтр, откройте карточку, вернитесь назад. Провал: фильтры сбросились, и список снова начинается с начала.
• 9. Поиск прощает. Как проверить: поищите товар с опечаткой, во множественном числе и синонимом. Провал: «ничего не найдено». По данным Baymard, у 27% мобильных магазинов у поля поиска даже нет кнопки — только клавиша на клавиатуре телефона.
• 10. Ссылки похожи на ссылки, а остальное — нет. Как проверить: откройте карту кликов в Яндекс Метрике — она показывает, какие элементы посетители принимают за ссылку, хотя это не так. Провал: люди упорно кликают по картинке, которая никуда не ведёт.

Блок 3. Формы и заявка

Форма — место, где интерес превращается в деньги или в закрытую вкладку. По данным Baymard, корзину бросают 70,19% покупателей, а 17% опрошенных покупателей в США бросали заказ именно из-за слишком длинного или сложного оформления. Там же подсчитано, что одно только лучшее оформление заказа может поднять конверсию в среднем на 35,26%.

• 11. Полей не больше, чем нужно. Как проверить: посчитайте поля и спросите про каждое, что сломается, если его убрать. Провал: форма заявки на звонок просит должность, компанию и «откуда вы о нас узнали». Для сравнения: по Baymard, оформление заказа в интернет-магазине можно уложить в 12 элементов формы, а в среднем по США их 23,48.
• 12. Ошибка видна рядом с полем. Как проверить: отправьте форму с неверной почтой. Провал: красная надпись вверху «Проверьте правильность заполнения», а какое поле виновато — угадайте сами. Nielsen Norman Group советует показывать ошибку у самого поля и не раньше, чем человек закончил ввод.
• 13. При ошибке ничего не стирается. Как проверить: ошибитесь в одном поле и отправьте. Провал: форма очистилась целиком, и человек заново набирает адрес на телефоне. Второй раз набирает не каждый.
• 14. Телефон вводится как угодно. Как проверить: введите номер через +7, через 8 и со скобками. Провал: маска принимает только один вариант, а на телефоне вместо цифровой клавиатуры открывается обычная.
• 15. После отправки понятно, что дальше. Как проверить: отправьте заявку сами. Провал: «Спасибо!» — и тишина. Лучше: «Перезвоним в течение часа в рабочее время. Если срочно — вот телефон». Где именно люди бросают форму, покажет аналитика форм в Метрике: она работает на данных Вебвизора и отмечает поля, с которых уходят.

Блок 4. Телефон

Мобильная версия обычно проверяется так: разработчик сузил окно браузера, ничего не развалилось, все довольны. Проверьте пальцем.

• 16. Нет горизонтальной прокрутки. Как проверить: на телефоне проведите пальцем влево на каждой главной странице. Провал: страница едет вбок из-за одной широкой таблицы или картинки.
• 17. В кнопки попадаешь с первого раза. Как проверить: понажимайте крестики, стрелки и ссылки в меню большим пальцем. Провал: крестик окна размером с муравья. В стандарте доступности WCAG 2.2 минимальный размер цели нажатия — 24×24 CSS-пикселя, и это нижняя граница. Удобный размер больше.
• 18. Текст читается без увеличения. Как проверить: держите телефон на обычном расстоянии и прочитайте абзац и мелкий шрифт у цены. Провал: условия доставки набраны серым мелким шрифтом, который приходится раздвигать двумя пальцами.
• 19. Телефон и адрес нажимаются. Как проверить: нажмите на номер и адрес. Провал: номер нельзя набрать нажатием, а адрес не открывает карты — человек переписывает цифры с экрана на бумажку.
• 20. Выбранное видно. Как проверить: в каталоге поставьте два фильтра и прокрутите список. Провал: непонятно, что сейчас отфильтровано. По данным Baymard, 66% мобильных магазинов не показывают выбранные фильтры над списком, а 75% в целом получают оценку «посредственно».

Блок 5. Скорость и стабильность

Скорость — редкий пункт, где у интерфейса есть общепринятые цифры. Google называет три главных показателя (Core Web Vitals) и пороги для них: 75% посещений должны в них укладываться — отдельно на телефонах и компьютерах.

• 21. Главное появляется быстро. Как проверить: вставьте адрес в PageSpeed Insights и смотрите на данные реальных пользователей за 28 дней, баллы тут вторичны. Хорошо — когда главный элемент (LCP) появляется не позже 2,5 секунды. Провал: сайт с оценкой 95 в лаборатории, который у реальных людей грузится пять секунд.
• 22. Ничего не прыгает. Как проверить: обновите страницу и попробуйте сразу нажать кнопку. Провал: сверху догружается баннер, всё съезжает вниз, и вы нажимаете не туда. Показатель сдвигов (CLS) должен быть не больше 0,1.
• 23. Кнопка отзывается сразу. Как проверить: нажмите «Оформить» или «Отправить». Провал: полсекунды ничего не происходит, человек жмёт ещё раз — и получает две заявки. Хорошая задержка отклика (INP) — до 200 миллисекунд.
• 24. Сайт живёт на плохом интернете. Как проверить: в инструментах разработчика (F12) включите медленный мобильный интернет и откройте главную. Провал: белый экран и крутилка, пока грузится фоновое видео, которое никто не заказывал.
• 25. Потерявшихся ловят. Как проверить: наберите адрес несуществующей страницы. Провал: голая ошибка 404 без поиска, меню и ссылки на главную. Человек ошибся в адресе, а сайт с ним попрощался.

Блок 6. Доступность и доверие

Доступность — обычное качество сайта, никакой благотворительности. Мелкий бледный текст одинаково плохо читают человек с плохим зрением и человек на солнце. По отчёту WebAIM Million 2026, автоматическая проверка находит ошибки на 95,9% главных страниц миллиона популярных сайтов — в среднем 56,1 на страницу. Почти все они укладываются в одни и те же шесть типов, и так уже семь лет подряд.

• 26. Текст контрастный. Как проверить: в инструментах разработчика наведите на текст — браузер покажет коэффициент контраста. По WCAG нужно не меньше 4,5:1 для обычного текста и 3:1 для крупного. Провал: модный светло-серый на белом. Низкий контраст есть на 83,9% страниц из отчёта WebAIM.
• 27. У картинок и кнопок есть названия. Как проверить: включите экранный диктор телефона и пройдите по главной. Провал: диктор читает «кнопка, кнопка, изображение». Картинки без описания (alt) WebAIM нашёл на 53,1% страниц, пустые кнопки — на 30,6%.
• 28. Сайт проходится с клавиатуры. Как проверить: нажимайте Tab с самого верха страницы. Видно, где вы сейчас? Провал: рамку фокуса убрали, «потому что некрасиво», и теперь непонятно, где ты.
• 29. Условия видны до заявки. Как проверить: попробуйте узнать цену, сроки и условия, не оставляя телефон. Провал: «Цена по запросу» на всём, включая то, что стоит одинаково для всех.
• 30. Сайт выглядит живым. Как проверить: промотайте в подвал и откройте последний пост в блоге. Провал: «© 2019», последняя новость — поздравление с Новым годом, отзывы без имён. Сайт, который не обновляли пять лет, спрашивает у клиента: «а вы уверены, что мы ещё работаем?»

Что чинить первым

После прохода у вас будет список на десяток-другой пунктов, и соблазн начать с того, что режет глаз. Не надо. Некрасивое редко стоит дороже непонятного.

Правый верхний угол — то, что задевает многих и стоит заявки или покупки: сломанная форма, непонятный первый экран, медленная загрузка на телефоне. Левый нижний — кривой отступ на странице «О компании», которую открывают трое в месяц. Между ними — всё остальное, по мере сил.

Хорошая новость в том, что дорогие ошибки обычно и самые скучные. Лишние поля, серый текст, «Отправить» на кнопке. Редизайн для них не нужен. Хватит вечера и доступа к сайту.

Можно ли отдать UX-аудит нейросети

Соблазн понятен: загрузил скриншоты, получил отчёт на двадцать страниц. Рейтинги ИИ-сервисов для аудита на vc.ru обещают именно это: минуты вместо недель работы специалиста.

Проблема в точности. Baymard Institute проверил: GPT-4 давал верные UX-рекомендации в 20% случаев. Более новые инструменты, по замерам исследователей Microsoft 2025 года, — от 50 до 75%. Разбирая эти цифры, Nielsen Norman Group формулирует главное: при точности 70% три совета из десяти могут сделать сайт хуже и снизить конверсию.

Сам Baymard, как пишет NN/g, построил свой ИИ-инструмент на правиле, которое стоит украсть: проверять им только то, где машина ошибается не чаще раза из двадцати, а остальное оставить людям.

Что аудит находит на самом деле

Аудит своими силами найдёт не всё. Его ценность в другом: вы впервые за долгое время смотрите на сайт глазами человека, которому что-то от вас нужно. Заказчик сайта так на него не смотрит.

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