К

Карта кликов


*Перед прочтением текста ниже рекомендуем прочитать статью "Как анализировать Яндекс.Метрику" в нашем блоге.

Предприниматель Андрей запустил сайт, чтобы продавать свои товары в интернете. Он прочитал кучу статей про удобство использования, закончил 7-дневный курс по UX/UI для бизнеса и даже нанял маркетолога. Но так и не понял, куда его клиенты тыкают курсором на сайте, а куда не тыкают. Все, что ему нужно — настроить в сервисе аналитики карту кликов.

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

 Все понятно с первого взгляда. Вот, смотрите. 

Что здесь происходит? Карта кликов (это ее разновидность — тепловая карта) визуализировала статистику по тем местам и элементам сайта, которые привлекают больше всего внимания. Чем ярче цвет, тем чаще сюда тыкают. Это наиболее кликабельные элементы и разделы. Карта показывает, видят ли пользователи нужные нам кнопки, какие элементы дизайна работают плохо, а какие приносят конверсии.

Зачем это нам нужно? Чтобы узнать, почему наш сайт не работает как должен. Если у нас есть определенный трафик, но он не конвертируется в продажи, вероятно, у нас проблемы с сайтом или с отдельными его элементами. Мы посмотрим, что привлекает на сайта больше внимания, а что не привлекает совсем, хотя должно. Так найдем ошибки и сделаем сайт лучше.

Для начинающих, лучший вариант карты — бесплатный вариант. Он есть в Яндекс.Метрике. Когда вникают в суть, покупают в дополнение платные карты. Но мы в Oko не советуем спешить тратиться. Лучше сначала освоить бесплатный инструментарий Яндекса.

Какие задачи помогает решить Карта кликов Яндекса

Андрей запустил сайт 6 месяцев назад. На сайте есть рекламный трафик, но продаж мало: конверсия очень низкая. Яндекс. Метрика показывает, что пользователи приходят, какое-то короткое время бродят по сайту, а потом уходят без целевого действия. Почему — непонятно. Андрей настроил карту кликов. С ее помощью он решит ряд задач.

  • 1. Поиск зон с низкой конверсией. Это части экранов сайта, которые выпадают из фокуса внимания пользователей. Их просто игнорируют. Возможно, Андрей разместил конверсионные элементы именно в таких зонах. Он увидит это и переместит кнопки и ссылки в другие части страницы.
  • 2. Определение элементов, воспринимаемых как ссылки. Бывает, что пользователи идентифицируют какие-то части сайта как ссылки. А это не ссылки — пользователям грустно. Не надо так. Андрею стоит заменить некликабельные элементы или сделать их кликабельными. Дизайнер ошибся, эту ошибку нужно исправить.
  • 3. Поиск зон с высокой конверсией. Это, наоборот, части экранов, на которых пользователи фокусируют свое внимание. Если куда-то пользователи часто тыкают, но там нет конверсионных элементов — нужно их туда поместить. Пользователь просит, а Андрей не понимает.

  • 4. Анализ эффективности всплывающей рекламы. Разработчики сайта напичкали его всплывающей рекламой. Они обещали, что такие элементы будут обращать внимание пользователей. Мол, окно с чат-ботом железно дает лиды — юди охотно оставляют свои контакты. Но в реальности навязчивость чат-бот только раздражает пользователей. Мало того, что они с ним вообще не взаимодействуют — только закрывают, так еще и сразу уходят с сайта. Андрей увидел эту негативную реакцию на карте кликов и быстренько убрал всплывающее окно с сайта. Молодец!
  • 5. Анализ эффективности конверсионных элементов. Это формы заказа и обратной связи, кнопки «Купить» и другие элементы, на которые пользователи должны кликать. Карта покажет, реально ли они вызывают реакцию или только занимают место на странице. 


    Принцип работы и виды карт

    Тут все просто. Вставляем в страницу сайта код счетчика Метрики. С его помощью Яндекс постоянно сканирует нашу страницу. Как только она получает клик, код фиксирует это и отправляет данные в Метрику. Та собирает все клики вместе, смотрит где больше, где меньше, и визуализирует эти данные в понятной нам форме.

    Все пользовательские «тыки» отображаются на карте цветом. Каким — зависит от вида карты. Да, их бывает несколько. Есть разные варианты карт с разными способами визуализации и цветовым оформлением.

    Тепловая карта
    Это предустановленный вариант. Чем больше внимания у юзеров вызывает конкретный элемент сайта, тем теплее он отображается на карте. Чем холоднее, тем внимания меньше. Красным — самые кликабельные вещи. Желтым — менее кликабельные, но тоже в фокусе внимания у юзеров. Зеленые и синие — не самые популярные.


    Монохромная карта
    Этот вариант карты показывает то же самое, только одним цветом — красным. Чем ярче и плотнее цвет в конкретной точке, тем больше кликов она привлекает.



    Клики по ссылкам и кнопкам
    Эта карта подсвечивает взаимодействие пользователей с кликабельными элементами сайта. «Тыки» на кнопки и ссылки Метрика подсвечивает теплыми цветами, все остальные — холодными.


    Карта прозрачности
    Это карта, которая визуализирует активность пользователя в виде ясности и прозрачности. Вся страница залита неким «туманом». А элементы, которые пользователи «тыкают» чаще — прозрачные. Чем яснее мы видим область сайта, тем больше интереса она вызывает у юзеров.


    Карта элементов
    Эта карта подсвечивает не только наиболее кликабельные области, а все элементы сайта: кнопки, иллюстрации, формы, ссылки и даже просто текст. Чем больше интереса они вызывают у пользователей, тем теплее их цвета — красные, желтые или оранжевые. Зеленые, синие или серые — неактивные элементы.


    Как подключить карту кликов

    1. Перейти в Метрику. Выбрать счетчик для того сайта, который будем отслеживать.
    2. Перейти в настройки. найти поле «Вебвизор, карта скроллинга, аналитика форм». Нажать кнопку «Вкл».
    3. Сохранить изменения.
    4. Система обновит код счетчика Метрики. Теперь его нужно установить на все страницы, которые мы ранее отслеживали.

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

    Как воспользоваться картой

    1. Перейти в Метрику. Найти в левом поле раздел с картами. Из выпадающего списка выбрать карту кликов.

    2. Откроется интерфейс карты, где уже можно работать — знакомиться с интерфейсом, смотреть наиболее кликабельные элементы, расшаривать и скролить страницы своего сайта.

    Когда познакомились, нужно настроить параметры и опции. Это поможет качественно работать с аналитикой.

    3. Находим в правой верхней части сайта кнопку и нажимаем. Она должна измениться и выглядеть вот так Это откроет окно с настройкам.

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

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

        5.Можно даже сравнивать сегменты между собой или смотреть поведение одного сегмента в разных периодах времени.

          6.Это специальное поле, в котором можно выбрать вариант визуализации карты кликов. Об этом уже было выше. По умолчанию Метрика предлагает нам пользоваться тепловой картой. Наверное, она самая удобная. Но есть и другие варианты.

            7.С помощью параметра «Опции» задаем размер точек — отображаемых кликов, и прозрачность экрана, на котором эти точки будут отображаться. Тут на свой вкус.

              8. Смотрим, наслаждаемся, делаем выводы.

              Для чего можно использовать карту кликов

              1. Для внутренней аналитики и тестирования сайта. Допустим, наша задача — улучшить показатель конверсий. Мы изучаем, какие страницы нашего ресурса обращают на себя самое большое внимание: страница с контактами, кейсы клиентов или карточки с описанием услуг.
              Допустим, самый популярный у нас блог — нас хорошо читают. Мы смотрим, куда люди кликают на страницах блога. Вдруг, обнаруживаем, что внимание людей по неизвестным причинам привлекает правая часть страницы, где у нас в блоге пустое поле. Активность невысокая. Но она есть и выше, чем вся остальная часть страницы без ссылок.
              Что мы можем сделать? Попробуем приклеить в это поле какую-то релевантную услугу или товар. Или ссылку на другой материал. Еще можно вставить форму обратной связи или заказа консультации. Тут по ситуации. Достоверно узнать не получится — попробуем угадать, что в этом месте хочет увидеть наш пользователь.
              Если угадаем — усилим конверсию и поможем пользователям быстрее проходить воронку продаж. Люди будут приходить в блог и тут же видеть дополнительные элементы, которых им так не хватало. Мы молодцы.


               2. Для определения элементов, которые воспринимаются как ссылки. Это всегда большая проблема ярких дизайнов. Разработчики пилят красоту, пичкают страницу интересными, но декоративными элементами. Это эффектно, но не дает результата. Получается, что лишние декорации перетягивают внимание юзеров от важных элементов. Они кликают, но не ничего не происходит. От этого юзерам грустно. 

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

              3. Для определения кликабельности ссылок. Вот размещаем мы на странице много много ссылок для перелинковки страниц и пунктов навигации. Думаем, что они помогут нам с переходами и положительно повлияют на сео. Но переходов нет, с сео все плохо. Запускаем карту кликов, а в ней — карту элементов. И тут видим: если с элементами в меню еще более-менее, то ссылки вообще едва синие, люди не кликают, а кликают совсем не в тех местах. Изучаем страницу ➙ делаем выводы ➙ выдвигаем гипотезу ➙ тестируем. И так по кругу.

              4. Для изучения поведения сегментов. Допустим, мы сегментировали наших пользователей с помощью Яндекс.Аудитории. Мы выделили постоянных клиентов и хотим подстроиться под ее запросы. Заходим в карту кликов и задаем конкретный сегмент, который хотим изучить. Карта покажет, куда кликают наши постоянные клиенты, что привлекает их внимание на сайте, а что не в фокусе. Мы сможем усилить сайт и заработать на еще больше.

              Выводы

              Как и любой другой инструмент Метрики, карта кликов — это аналитический инструмент. Он показывает нам, как себя ведут пользователи: куда они «тыкают», каким зонам экрана отдают предпочтение, на что больше всего обращают внимание.

              Правда, есть один минус — карта кликов увеличивает скорость загрузки сайта. А еще, как и любые другие аналитические инструменты, карта не умеет делать за нас выводы. Да, мы посмотрим статистику, но принять решение — какие изменения внести — придется самостоятельно.

              Помните: правильных рецептов нет. Вы смотрите статистику ➙ выдвигаете гипотезу ➙ вносите изменения ➙ тестируете. И так по кругу, пока не получите приемлемый результат. А если есть вопросы — мы поможем. Мы в Oko на стороне добра.