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

Спасибо! Заявка принята.
Не удалось отправить заявку. Попробуйте позже.
Оглавление статьи · 6 разделов
Красная область над фотографией товара часто вызывает быстрый вывод: «Люди хотят увеличить снимок, добавим галерею». Но там могла раньше находиться кнопка, за изображением открывалась ссылка или смартфон посетителя показывал совсем другую компоновку. Тепловая карта помогает заметить место для проверки. Чтобы отличить неудобство интерфейса от обычного любопытства, сначала определите версию страницы, задачу посетителя и действие, которое он мог совершить.
Выберите один вопрос и точную страницу
Хорошее начало — «почему покупатели не находят таблицу совместимости в мобильной карточке», а не «посмотрим, где больше красного». Откройте карточку как посетитель, запишите URL, дату, ширину экрана и начальное состояние. Зафиксируйте, раскрыта ли вкладка, показан ли город, появляется ли баннер согласия, меняется ли состав страницы после выбора товара. Спросите у разработчика, когда в последний раз переставляли элементы. События прежнего дизайна на новом фоне легко принять за странное поведение.
В отчёте проверьте период, фильтры и адреса, по которым собраны данные. Карта может агрегировать группу страниц, если выбран соответствующий шаблон адресов. Один товар имеет крупную таблицу характеристик, другой — всего несколько строк; их нижние блоки окажутся на разной высоте. Для первого разбора ограничьтесь одной страницей или действительно одинаковым шаблоном. Сохраните скриншот фильтров и исходные условия, чтобы другой специалист мог повторить просмотр.
Что рассказывают клики и прокрутка
Карта кликов показывает распределение действий указателем или касаний по элементам. Карта скроллинга помогает понять, какие области страницы попадали в область просмотра и как распределялось наблюдаемое внимание по высоте. Ни одна из них не фиксирует мысль человека. Посетитель мог остановиться у таблицы, потому что внимательно читал, отвлёкся на разговор или не понял обозначений. Причину нужно проверять другим способом.
Разделите устройства. На компьютере характеристики могли помещаться рядом с фото, на телефоне — уходить под блок доставки. Сопоставьте место на карте с реальным мобильным экраном, затем попробуйте повторить путь без подсказок. Можно ли понять, что таблица раскрывается? Видна ли ссылка сразу после выбора варианта? Не перекрывает ли нижнюю кнопку виджет? Для общей проверки удобства перехода из рекламы пригодится разбор посадочной страницы.
Разберите подозрительный участок
Предположим, на странице часто нажимают короткую надпись «Размеры», а по дизайну она обычный текст. Проверьте, выглядит ли она как соседние вкладки, есть ли рядом доступная таблица и какую информацию человек ожидает увидеть. Вручную пройдите карточку с клавиатуры и на телефоне. Если функциональной ссылки вовсе нет, предложите нескольким участникам решить естественную задачу: выбрать подходящий размер под заданное место. Наблюдайте, где они ищут размеры и понимают ли следующий шаг.
Обязательно сформулируйте альтернативное объяснение. Вчера рядом с надписью могла находиться скидочная плашка; часть событий пришла с широкого экрана, где надпись лежит в другом месте; на отдельных карточках весь блок действительно является ссылкой. Если после разделения версиями и адресами эффект исчез, отдельная кнопка может оказаться ненужной. Записанный отрицательный результат тоже полезен: команда не начнёт переделывать компонент по ошибочному скриншоту.
Подкрепите наблюдение независимым сигналом
Посмотрите, доходят ли пользователи до соответствующей функции дальше по маршруту. Например, открывают ли справку о размерах через меню, возвращаются ли к выбору модели, спрашивают ли про габариты в чат. Используйте разрешённые агрегированные события и обезличенные вопросы. Из одного яркого пятна нельзя вывести число потерянных продаж. Если на странице есть форма, отдельно проверьте фактическую передачу заявки: визуальная активность ещё не подтверждает доставку данных.
Сформулируйте задачу команде конкретно: «На мобильной карточке X посетители нажимают подпись, под которой ожидают таблицу. В двух наблюдениях таблицу не нашли. Предлагаем проверить доступную ссылку рядом с выбором модели; результат — пользователь нашёл нужные размеры и продолжил выбор». Сохраняйте число наблюдений буквально. Если это два тестовых участника, не называйте находку поведением большинства покупателей.
Как принять результат исправления
Выполните один и тот же пользовательский сценарий до и после правки. Проверьте, что новая ссылка работает на телефоне и доступна с клавиатуры, ведёт к правильному товару и не отвлекает от основного выбора. При следующем просмотре карты берите только события после смены дизайна и соответствующий диапазон устройств. Подпишите, какие показатели подтверждают работу функции, а какие пока остаются предположением о поведении.
В отчёте достаточно пяти элементов: вопрос, исходный экран, наблюдение на карте, альтернативные объяснения и итог независимой проверки. Так тепловая карта становится началом исследования, а не конкурсом самых ярких областей на странице.
Свобода от рекламной зависимости – за 1 день
ЛидБлог за 1 день превращает сайт в канал привлечения новых клиентов из Яндекс, Google и поиска в нейросетях. Работает без вашего участия
.PDF ФАЙЛ
Выберите способ связи и укажите номер, чтобы получить персональный план привлечения клиентов с помощью нового канала «ЛидБлог» и узнать стоимость внедрения
Вопросы и ответы
Если посетители редко докручивают до конца, нужно ли сокращать страницу?
Сначала установите, нужна ли им нижняя часть для их задачи. Человек мог успешно найти адрес или сделать выбор раньше; проверьте конкретный путь и доступность важной информации.
Можно ли объединять события до и после редизайна?
Для диагностики расположения элементов лучше разделить версии. Те же координаты после перестановки могут соответствовать другой кнопке или тексту.
Чем подтвердить, что неактивная надпись действительно мешает?
Попросите человека выполнить задачу без подсказок и сопоставьте его действия с кликами и фактическим интерфейсом. Проверьте также альтернативные объяснения.