Тепловые карты и Вебвизор: как читать поведение на сайте

Клиент присылает скрин: «Смотри, у нас на карте кликов вся страница синяя, значит сайт плохой». На деле карта была синей просто потому, что за неделю набралось 40 визитов — статистике там взяться не из чего. Тепловые карты сайта дают ощущение простоты: одна картинка вроде бы всё объясняет. На практике это самый неправильно интерпретируемый инструмент веб-аналитики из всех, что я видел в работе.

Я настраиваю аналитику и веду рекламу в Яндекс Директе больше десяти лет, и тепловые карты вместе с Вебвизором — это то, к чему я возвращаюсь почти в каждом проекте, где нужно понять не «сколько», а «почему». Цифры из отчётов Метрики говорят, что конверсия страницы 2,1%. Тепловая карта и запись Вебвизора показывают, почему именно 2,1%, а не 4%.

В статье разберу три вида тепловых карт, покажу, как их подключить в Яндекс Метрике, как отличить сигнал от шума при малом трафике, и как связать карту кликов с записями Вебвизора, чтобы получить не картинку для отчёта, а список конкретных правок на странице.

Что такое тепловые карты сайта и зачем они нужны

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

Отличие от Вебвизора принципиальное. Вебвизор — это запись конкретной сессии конкретного человека, как видеозапись экрана. Тепловая карта — это статистика по всем сессиям сразу, без привязки к личности. Первое отвечает на вопрос «что происходит в среднем», второе — «что произошло вот тут конкретно». По моему опыту, рабочая связка — это карта для гипотезы и Вебвизор для проверки гипотезы на реальных записях.

Виды тепловых карт: клики, скроллинг, движения мыши

В Яндекс Метрике доступны три типа карт, и каждая отвечает на свой вопрос. Путать их — частая ошибка новичков, из-за которой выводы получаются противоречивыми.

Тип карты	Что показывает	Когда смотреть
Карта кликов	Куда именно кликают — по кнопкам, ссылкам, «мёртвым» элементам без ссылки	Проверка призывов к действию, навигации, ложных кликов
Карта скроллинга	До какого блока страницы доходит какой процент посетителей	Оценка длины лендинга, положения формы заявки
Карта движения мыши (ссылок)	Траекторию взгляда через движения курсора, переходы по ссылкам	Проверка внимания к блокам без кликабельных элементов

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

Как подключить тепловые карты в Яндекс Метрике

Если счётчик Яндекс Метрики уже установлен на сайте, дополнительный код для карт не нужен — они работают на основе того же счётчика. Порядок действий такой:

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

Вебвизор: как смотреть записи сессий пользователей

Тепловая карта показывает «где» — Вебвизор показывает «как именно». Если карта кликов выявила, что 9% кликов уходят на некликабельный элемент, следующий шаг — открыть 8–10 конкретных записей сессий с этим кликом и посмотреть, что человек делал до и после. Часто выясняется, что он кликал два-три раза подряд, потом уходил — это прямой признак того, что пользователь ждал реакции интерфейса и не получил её.

В Метрике записи сессий фильтруются по тем же условиям, что и остальные отчёты: по цели, по устройству, по источнику трафика. Я обычно смотрю записи не всех подряд посетителей, а сегмента «дошёл до формы, но не отправил» — таких записей за неделю набирается немного, и просмотр 15–20 из них занимает 20–30 минут, но даёт больше конкретики, чем неделя гипотез. Подробный разбор функциональности инструмента я делал в статье про Вебвизор в Яндекс Метрике.

Важная техническая деталь: Вебвизор записывает не видео в привычном смысле, а последовательность DOM-событий (клики, скролл, ввод в поля без сохранения самих значений), которые воспроизводятся как анимация. Из-за этого запись может выглядеть немного «дёрганой» на страницах с тяжёлой анимацией или лениво подгружаемым контентом — это особенность технологии, а не баг.

Как читать карту кликов: примеры и типичные ошибки

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

Тепловые карты Метрики и сторонние сервисы: что выбрать

Кроме встроенного инструмента Метрики, на рынке есть отдельные сервисы для тепловых карт и записи сессий — Hotjar, Plerdy, Yagla и похожие. Разница не в качестве картинки, а в глубине настроек и цене.

Критерий	Яндекс Метрика	Сторонние сервисы
Стоимость	Бесплатно без ограничений по трафику	От 0 на ограниченном тарифе, дальше платно по числу сессий
Связка с рекламой	Единый счётчик с целями и отчётами по Директу	Нужна отдельная интеграция и сверка данных
Тепловая карта по устройствам	Есть, но интерфейс менее гибкий	Обычно более наглядные фильтры и сегменты
Опросы и виджеты обратной связи	Нет в базовом наборе	Часто входят в тариф

Для проектов, которые уже строят сквозную аналитику вокруг Метрики, дополнительный сервис почти всегда избыточен — он дублирует данные и требует лишней сверки. Стороннее решение оправдано, когда нужны продвинутые опросы посетителей или тестирование гипотез поверх готовых виджетов — это отдельная задача, не связанная напрямую с рекламной аналитикой.

Карта скроллинга: где теряется внимание на странице

Карта скроллинга показывает процент посетителей, добравшихся до каждого блока страницы. Типичная картина для длинного лендинга: 100% видят первый экран, 74% доходят до второго блока, 41% — до середины страницы, 12% — до формы в самом низу. Если основной призыв к действию стоит на глубине, до которой доходит десятая часть посетителей, это прямая потеря конверсии — независимо от того, насколько хорошо написан сам призыв.

Практический вывод из такой карты — не «сократить лендинг вообще», а продублировать форму заявки или кнопку выше по странице, там, куда реально доходит основная масса трафика. Я обычно ставлю повторный призыв к действию сразу после блока с ценой или преимуществами — именно там обычно происходит естественный спад внимания. Если лендинг собирается специально под рекламную кампанию, стоит сразу закладывать структуру с учётом этой логики — подробнее об этом в статье про лендинг для контекстной рекламы.

Тепловые карты и Вебвизор: как использовать вместе, а не по отдельности

Частая ошибка — воспринимать эти инструменты как конкурентов и выбирать «или карты, или Вебвизор». В работе они дополняют друг друга на разных этапах анализа.

Вебвизор в этой связке нужен для проверки: если карта показала аномалию, 10–15 записей реальных сессий подтверждают или опровергают гипотезу. Я видел проекты, где команда переделывала блок сайта только на основании тепловой карты, без проверки записями, и конверсия после правки не менялась — потому что причина была не в дизайне блока, а в скорости загрузки этого блока на мобильных устройствах, что карта кликов вообще не показывает.

Как использовать данные тепловых карт для роста конверсии

Сами по себе карты ничего не улучшают — улучшают решения, принятые на их основе. Рабочий цикл, который я использую в проектах, укладывается в четыре шага.

1. Смотрю карту кликов и скроллинга по странице за 2–4 недели, минимум 300 визитов.
2. Выписываю 3–5 аномалий: клики по некликабельным элементам, резкий спад внимания на конкретном блоке, игнорирование формы.
3. Открываю 10–15 записей Вебвизора для каждой аномалии и проверяю гипотезу на реальных сессиях.
4. Вношу одну правку за раз и сравниваю конверсию по целям в Метрике за следующий сопоставимый период — не «на глаз», а по цифрам.

Иллюстративный пример такого цикла: на лендинге услуги форма заявки стояла ниже блока с отзывами, до которого по карте скроллинга доходили только 34% посетителей. После переноса формы сразу под блок с ценой (доходимость 68%) число заявок с того же объёма трафика выросло, по условной оценке, на 18–24% — без изменения текста, дизайна кнопки или цены. Разница была именно в позиции элемента относительно фактического внимания аудитории.

Типичные ошибки при анализе тепловых карт

Когда тепловые карты сайта не нужны

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