Тепловая карта сайта – это инструмент аналитики, который с помощью цветовой палитры рассказывает о поведении пользователей. Вы можете посмотреть, по каким ссылкам они переходят, как далеко скроллят страницу, на какие элементы интерфейса обращают внимание, а какие – игнорируют.
Как работает тепловая карта
Практически все инструменты собирают данные для тепловых карт по одному принципу.
-
Владелец сайта добавляет в код страницы кусочек кода на JavaScript. Именно он отвечает за сбор данных.
-
После загрузки страницы этот скрипт собирает HTML-код страницы и отправляет его сервису, который анализирует поведение интернет-пользователей.
-
Сервис создает карту страницы из полученного HTML-кода. На этой карте отмечаются все элементы интерфейса, с которыми могут взаимодействовать пользователи.
-
Затем сервис собирает данные. Каждый раз, когда пользователь делает что-то на вашей странице, на карте отмечается активность. При этом есть проверка на уникальность, так что не получится с одного адреса накликать на одну кнопку много раз – это делает анализ поведения пользователей более объективным.
-
Владелец сайта может в любой момент посмотреть на тепловую карту, на которой собраны все действия пользователей.
Например, вот карта кликов Метрики от Яндекса:
Чтобы понять поведение пользователя на сайте, достаточно одного взгляда. Такая скорость восприятия информации достигается за счет использования цветов.
Прокрутите карту, чтобы лучше понять поведение пользователя. Чем ближе тон к желтому или красному, тем чаще элемент попадает в зону внимания посетителей. Чем холоднее оттенок, тем ниже видимость и популярность этой части интерфейса.
Виды тепловых карт
Карта кликов позволяет отследить, на какие кнопки, изображения, тексты, формы и другие элементы интерфейса кликает пользователь, а какие части остаются без его внимания.
С помощью карты кликов можно обнаружить неработающие и некликабельные ссылки, незаметные для пользователей кнопки и призывы к действию, проанализировать эффективность всплывающих окон.
У карты кликов есть интересная разновидность – конфетти. Она отличается тем, что показывает каждый клик по отдельности. Цвет также зависит от количества кликов. Такое представление аналитики дает, например, сервис CrazzyEgg.
Карта скроллинга – инструмент, который показывает глубину прокрутки страницы. С его помощью вы можете:
-
Узнать оптимальную длину страницу для вашего сайта.
-
Определить место размещения баннеров и кнопок, призывающих выполнить целевое действие: купить, подписаться, отправить заявку.
-
Понять, дочитывают ли пользователи лонгриды до конца.
-
Решить, что выбрать – пагинацию или бесконечную прокрутку страницы.
Анализ пользователей сайта через карту скроллинга может быть полезен и дизайнеру, и редактору. Если нижняя часть страниц на сайте остается в холодных тонах, то это значит, что пользователи там практически не бывают.
Карта активности мыши – выделяет области, на которые пользователь наводит курсор. Это позволяет увидеть, какая информация интересует посетителей страницы.
Однако это не самый точный анализ действий пользователей. Посетитель страницы не всегда наводит курсор на ту информацию, которую изучает. Например, он может увести его в другую часть интерфейса и оставить там. Поэтому интерпретировать такие данные нужно с большой осторожностью.
Карта ссылок отображает интенсивность перехода по ссылкам на странице. Чем больше кликов собирает ссылка, тем ближе к красному будет ее цвет. Это удобно при создании перелинковки на сайте. Цвета помогают быстро определить страницы-доноры (с большим весом) и страницы-акцепторы (с меньшим весом).
Карту ссылок также можно использовать для точечного улучшения кликабельности. Например, изменить текст анкора, переместить гиперссылку в другое, более заметное место, сделать ее крупнее. Все это улучшает поведенческие факторы сайта.
Преимущества и недостатки использования тепловой карты
Главное преимущество тепловой карты – визуализация аналитики, которая помогает здорово сэкономить время.
-
С помощью тепловых карт можно понять, как посетители двигаются по страницам сайта.
-
Отслеживание кликов помогает определить, куда пользователи кликают, а куда – нет.
-
Карта скроллинга полезна при создании длинных лендингов, оценки дочитываемости текстов и получения информации о том, что можно разместить в футере сайта.
-
Карта ссылок помогает найти ошибки, выстроить перелинковку, которая будет приносить пользу и улучшать поведенческие факторы на сайте.
Полный анализ деятельности пользователя невозможно провести только с помощью тепловых карт. Они ничего не говорят о том, почему люди нажимают на те или иные элементы, не различают случайные и намеренные переходы.
Тепловая карта дает лишь общее представление о проблемных зонах в интерфейсе сайта. Но эту информацию нужно подтверждать также другими метриками и исследованиями – например, глубинными интервью с пользователями. Одними тепловыми картами запустить улучшение поведенческих факторов не получится.
Когда следует использовать тепловую карту
Тепловые карты помогают выполнить анализ действий пользователей. Обычно их используют в следующих случаях:
-
Подготовка к редизайну сайта – чтобы понять, как изменить оформление, исходя из текущего поведения пользователей.
-
Улучшение юзабилити – перемещение блоков, кнопок, баннеров, редактирование текстов, изменение форм и всплывающих окон.
-
Увеличение конверсии – проще понять, где разместить кнопки для совершения целевых действий.
-
A/B-тестирование – например, для выбора между двумя вариантами лендинга.
-
Устранение ошибок – обнаружение некликабельных и нерабочих ссылок, по которым пользователи пытаются перейти.
Тепловые карты полезны и для контентных сайтов – например, чтобы отследить дочитываемость материалов или использование элементов, увеличивающих глубину просмотра: рекомендаций, блоков с лучшими и самыми обсуждаемыми статьями.
Лучшие плагины WordPress для создания тепловых карт сайта
Рассмотрим платные и бесплатные плагины для WordPress, которые помогают выполнить анализ работы пользователей через тепловые карты их активности на страницах сайта.
Hotjar
Рейтинг: 4
Количество установок: 90 000+
Один из самых популярных плагинов для WordPress, который умеет создавать тепловые карты, визуализирующие клики и скроллинг. Для работы нужна учетная запись на сервисе веб-аналитики Hotjar.
Базовой версией можно пользоваться бесплатно без ограничений. Премиум-пакеты стоят от 39 до 989 долларов в месяц.
Clicky by Yoast
Рейтинг: 5
Количество установок: 20 000+
Clicky – плагин одноименного сервиса веб-аналитики. Через него вы можете получить доступ к тепловым картам, аналитике, подробной статистике по каждому посетителю.
Сам плагин бесплатный, но для работы с сервисом нужна учетная запись на Clicky. Там тоже есть бесплатный тариф. Премиум-пакеты стоят от 9,99 до 19,99 долларов в месяц.
Aurora Heatmap
Рейтинг: 4,5
Количество установок: 20 000+
Плагин для создания тепловых карт, который не требует дополнительной настройки. Установите его, активируйте и начните создавать тепловые карты.
У Aurora Heatmap есть бесплатная версия, которая позволяет создавать неограниченное количество карт кликов. Если вам нужны другие типы карт и приоритетная поддержка, покупайте премиум-план. Стоимость – от 19,9 до 462 долларов в месяц.
CrazyEgg
Рейтинг: 4
Количество установок: 10 000+
Этот бесплатный плагин позволяет быстро подключить на сайте инструменты аналитики CrazyEgg, не добавляя в код шаблона скрипты. После этого вы можете использовать все функции сервиса, в том числе тепловые карты.
Для работы плагина нужна учетная запись CrazyEgg. Бесплатного тарифа нет, но есть демо-доступ на 30 дней. После его завершения необходимо перейти на один из платных тарифов стоимостью от 24 до 249 долларов в месяц.
Mouseflow
Рейтинг: 3,5
Количество установок: 8000+
Еще один бесплатный плагин для быстрого подключения инструментов аналитики стороннего сервиса – Mouseflow. Чтобы использовать его, нужна учетная запись. После регистрации и установки вы сможете анализировать тепловые карты в админке WordPress.
Есть бесплатный тариф с неограниченным количеством тепловых карт. Если вам нужны другие функции, выбирайте один из премиум-пакетов стоимостью от 29 до 399 евро в месяц.
Heatmap for WordPress
Рейтинг: 4
Количество установок: 6000+
Этот плагин добавляет в админку тепловую карту, используя возможности стороннего сервиса Heatmap. Это позволяет снизить нагрузку на сайт, так как все вычисления выполняются на другом сервере.
Есть бесплатный тариф, который позволяет проанализировать не более 5 страниц и 1 миллиона просмотров в месяц. Если нужно больше, переходите на премиум за 100 долларов в месяц.
Lucky Orange
Рейтинг: 3,5
Количество установок: 3000+
Бесплатный плагин для подключения на WordPress сервиса аналитики Lucky Orange. Для работы с тепловыми картами и другими инструментами нужна учетная запись.
Есть бесплатный тариф, ограниченный 500 просмотрами страницы в месяц. Если нужно больше возможностей, выбирайте один из премиум-планов стоимостью от 10 до 100 долларов в месяц.
Nelio AB Testing
Рейтинг: 4,5
Количество установок: 2000+
Плагин WordPress для оптимизации, который предлагает бесплатное создание тепловых карт. Nelio AB Testing можно установить в интернет-магазин, работающий на WooCommerce.
У плагина есть бесплатный тариф. Если нужно больше функций, переходите на премиум-пакет. Стоимость – от 29 до 259 долларов в месяц.
Inspectlet ExtraWatch Pro
Рейтинг: 3,5
Количество установок: 500+
Плагин показывает, что происходит на сайте в режиме реального времени. Тут есть и карта посещений, статистика уникальных посетителей и загрузок страниц, список самых популярных страниц и источников трафика.
Есть бесплатная версия для одного сайта. Если нужно больше возможностей для аналитики, выбирайте один из платных тарифов стоимостью от 19,99 до 59,99 евро в месяц.
Лучшие сервисы для создания тепловых карт
Если настройки плагинов WordPress вас не устраивают, попробуйте эти сервисы для создания тепловых карт и анализа поведения пользователей.
Яндекс.Метрика
В Яндекс.Метрике счетчик посещений сайта – лишь малая часть функциональности. Сервис предоставляет огромное количество инструментов аналитики, в том числе тепловые карты. Кроме того, есть подробная документация, в открытом доступе много гайдов: как добавить счетчик Яндекс.Метрики на сайт, как настроить сбор данных, какие карты и в каких случаях использовать.
Какие карты можно создать: карта ссылок, карта кликов, карта скроллинга, аналитика форм (показывает, как посетители взаимодействуют с формами на сайте).
Подключение: добавление скрипта в шаблон страниц на сайте. Код можно установить также с помощью плагина для WordPress.
Стоимость: карта кликов Яндекс.Метрики и другие инструменты аналитики доступны бесплатно.
Heat-map.co
Если карта кликов Яндекса составляется из поведения реальных пользователей, то на Heat-map.co за это отвечает обученный алгоритм. После анализа система выдает результат смоделированного отслеживания взгляда пользователей.
Благодаря Heat-map.co вы можете узнать, на что посетители обратят внимание при первом открытии страницы, куда направится их взгляд дальше. Кроме того, система отмечает области, которым уделяется мало внимания и которые, возможно, нужно удалить из интерфейса.
Какие карты можно создать: карта фокусировки взгляда.
Подключение: нужно указать ссылку на страницу или воспользоваться расширением для браузера.
Стоимость: есть бесплатный тариф, можно проверить 2 страницы. Если нужно больше, то переходите на платные тарифы. Цена – 29 и 79 долларов в месяц. На первом тарифе до 50 проверок, на втором – до 150 и есть персональный менеджер.
Mouseflow
Сервис позволяет воспроизвести опыт пользователей и определить слабые части в интерфейсе, чтобы затем исправить их, оптимизировать сайт и повысить конверсию.
Какие карты можно создать: карта кликов, скроллинга, внимания, движения.
Подключение: добавление скрипта или использование плагина для WordPress.
Стоимость: от 24 до 299 евро в месяц. Тарифы различаются количеством доступных для записи сессий в месяц. Количество просмотров страниц безлимитно даже на бесплатном тарифе.
CrazyEgg
CrazyEgg – сервис веб-аналитики, который предлагает тепловые карты, запись активности на сайте, инструменты для проведения A/B-тестов. Интересная фишка – карта кликов Confetti. С ее помощью можно сегментировать, куда нажимают посетители из поиска, а куда – пользователи, пришедшие из соцсетей.
Какие карты можно создать: карта скроллинга, карта кликов.
Подключение: добавление скрипта или использование плагина для WordPress.
Стоимость: от 24 до 249 долларов в месяц. Тарифы различаются количеством отслеживаемых просмотров страниц в месяц – от 30 000 до 500 000. Количество сайтов и A/B-тестов неограничено.
Feng-GUI
Feng-GUI – еще один сервис, который не анализирует поведение пользователей и не собирает статистику. Он берет загруженное изображение/видео или ссылку на страницу и обрабатывает его с помощью искусственного интеллекта. По эффективности это сопоставимо с 5-секундной сессией отслеживания движения глаз 40 человек.
Какие карты можно создать: карта фокусировки взгляда.
Подключение: необходимо загрузить изображение или указать ссылку на страницу.
Стоимость: от 99 до 199 долларов в месяц. В тарифах доступно разное количество проверок. Например, за 99 долларов можно запустить не более 100 проверок в месяц, а за 199 долларов количество вырастет до 5000 проверок.
Источник:
