Как создать сайт или блог в 2020 году - бесплатное и простое руководство по созданию сайта

Как создать тепловую карту без написания кода? [8 Steps]

В 1991 году Кормак Кинни, изобретатель программного обеспечения и предприниматель, разработал приложение, которое снабжало биржевых трейдеров, чтобы выяснить рыночную экономику и преодолеть разногласия. (1) Его программа имитировала виртуальную шахматную доску, где каждая клетка представляла собой оборотную безопасность. Если цена какой-либо ценной бумаги взлетела во время торговой сессии, ее соответствующий квадрат стал синим. Между тем, если он погружен, квадрат становится красным. Помимо предоставления операторам возможности быстро анализировать конъюнктуру рынка, приложение помогало им прогнозировать деятельность и использовать полезные возможности.

Когнитивная теория его изобретения (которую он назвал и позже обозначил как «тепловые карты») была проста. Используется тот факт, что человеческий глаз может легко обнаружить различия в цвете, чем сравнение чисел. Кенни также пришел к выводу, что цвета могут помочь преобразовать большие объемы данных в простые и непосредственные визуальные эффекты, что напрямую приведет к более быстрому принятию решений, что является важной чертой успеха на финансовых рынках.

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

Что делают тепловые карты?

Для полезности тепловая карта – это метод отображения данных, показывающих величину активности или активности посетителей на веб-сайте с использованием двухмерных цветов. Различия в цветах представляют интенсивность активности / участия посетителя, давая опытным менеджерам достаточно визуальных подсказок, чтобы прочитать реакцию посетителей и извлечь уроки.

Много разных цветовых схем используются для иллюстрации тепловых карт с учетом преимуществ и недостатков каждой из них. В общем, цвета радуги используются, поскольку люди лучше реагируют на эти цвета, чем оттенки серого. Для тепловых карт веб-сайтов для представления данных используется цветовое кодирование от холода к теплу. Здесь красный цвет обычно представляет самые горячие области (или области с максимальной активностью / обязательством), переходя от оранжевого и желтого к более холодным областям в областях, выделенных зеленым и синим с меньшей активностью / активностью.

Иллюстрация различных типов тепловой карты VWO

Как создать тепловую карту?

Мы рекомендуем VWO Heatmaps для запуска. Полезной особенностью VWO Heatmaps является его способность постоянно работать и анализировать миллионы данных об участии, как только вы один раз добавили небольшой фрагмент кода (VWO Smartcode) на свои веб-сайты.

Если вы хотите детализировать детали, такие как отслеживание журнала активности для определенного сегмента посетителей, просто создайте пользовательские представления и разверните данные. Вы также можете просматривать тепловые карты для определенных сегментов, которые вас интересуют. Например, VWO Heatmaps предлагает возможность сравнивать тепловые карты посетителей Сан-Франциско, использующих iOS, и посетителей Нью-Йорка, использующих Android.

Вот как можно просмотреть тепловую карту на вашем аккаунте VWO:

Шаг 1: Войдите в свою панель управления VWO.
Скриншот VWO приборной панели
Шаг 2: Нажмите на INSIGHTS, а затем на HEATMAPS.
нажмите на вкладку «Тепловые карты» в боковом меню навигации.

Вот так выглядит приборная панель Heatmaps:

Скриншот обзора тепловых карт на VWO
Шаг 3: Чтобы создать новый вид, нажмите кнопку «CREATE VIEW» на правой панели. Откроется новая страница VIEW.
Как создать новую тепловую карту в VWO
Этап 4: Нажмите на значок карандаша рядом с НОВЫМ ВИДОМ и дайте вашей тепловой карте правильное имя. Здесь мы назвали наш вид «Тепловая карта страницы столбов CRO»; В этом случае мы хотим видеть тепловую карту людей, посещающих одну из наших страниц с длинными формами в CRO.
Шаг 5: Затем введите URL-адреса страницы, которую вы хотите проанализировать. Здесь вы получаете два варианта: ПРОСТОЙ и РАСШИРЕННЫЙ.
введите имя URL, для которого вы хотите создать тепловую карту

Простой вид

снимок экрана тепловой карты на платформе VWO

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

Кроме того, вы также можете определить дополнительные параметры сопоставления с образцом, чтобы добавить широкий URL-адрес с подстановочными знаками или конкретным URL-адресом. Например, если вы введете URL-адрес шаблона как «http://www.example.com/products*» (со звездочкой), вы можете записать целевую конверсию для всех страниц ваших продуктов. В то же время, если вы используете шаблон URL, например «http: //www.example.com*», вы сможете отслеживать конверсии по всему сайту.

Шаг 6: Чтобы записать шаблон кликов для определенного сегмента посетителей и отобразить его в отчете тепловой карты, установите флажок «Включить данные тепловой карты для определенной группы посетителей».
как включить сегменты для создания данных тепловой карты

Как показано на изображении выше, вы можете легко ввести детали сегмента, добавить пользовательские условия и даже сохранить сегмент для дальнейшего использования. Опция доступна в Простом представлении и Расширенных настройках.

Шаг 7: Чтобы запустить, приостановить или остановить тепловую карту через определенные промежутки времени, разверните вкладку «Дополнительно» и включите планирование. Для получения дополнительной информации о параметрах планирования см. Как запланировать тест VWO.
Шаг 8: Наконец, нажмите CREATE, чтобы продолжить и создать представление тепловой карты. Вы можете запустить просмотр немедленно или выбрать конкретное время начала.

Вот как выглядит тепловая карта:

скриншот тепловой карты с нашего сайта

Обратите внимание, как вы можете видеть на изображении выше, этот инструмент позволяет просматривать тепловую карту страницы, карту кликов, карту смещения и список элементов, чтобы увидеть общее количество кликов + процент от клики по элементу страницы.

Сообщение предпосылка

Чтобы убедиться в успешном создании представления тепловой карты, перейдите к INSIGHTS и нажмите HEATMAPS. Все вновь созданные виды отображаются на вкладке ПРОСМОТР на правой панели. Предварительный просмотр ссылки на тепловую карту также отображается под заголовком представления для дальнейшего использования.

Обратите внимание, что браузер Safari блокирует сторонние файлы cookie для загрузки и сбора данных. Чтобы успешно загрузить данные тепловой карты, перейдите в Safari и нажмите «ПРЕДПОЧТЕНИЯ». Затем нажмите КОНФИДЕНЦИАЛЬНОСТЬ и снимите флажок «Запретить сканирование между сайтами».

Хотя составление тепловой карты довольно просто и легко, не торопитесь с этим. Создайте свое понимание инструмента многоуровневой аналитики. Продвигайтесь только тогда, когда вы освоили каждый уровень. Например, если вы попытаетесь проанализировать весь свой веб-сайт сразу, вы наверняка почувствуете себя подавленным. Вместо этого начните с анализа страницы, которая получает достаточно трафика для создания значимой тепловой карты. Как насчет вашей страницы блога?

Что делает для вас хорошим инструментом тепловую карту?

Тепловые карты предоставляют более подробную информацию о производительности, чем многие традиционные инструменты веб-аналитики. Вот несколько способов использовать тепловые карты

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

  • Сделайте хорошие вещи более заметными: Получают ли «Запрос цен» и «Бесплатная пробная версия» больше кликов, чем «О нас» и «Почему мы?» Возможно, вам следует подумать об удалении последнего полностью, чтобы уменьшить беспорядок посещений и сосредоточиться на значимых кнопках.
  • Улучшение UXЭлементы, которые не генерируют клики, не имеют никакого отношения к сайту, кроме тех, которые подпадают под действие законов и законов о соответствии.

Чтобы увеличить глубину взаимодействия страницы: Хотите ли вы перевести своих посетителей с «Смотри-сгиб-смотри-но-не трогай» на «Средняя прокрутка-взаимодействие-с-содержанием»? Скажите еще раз привет вашей дружественной карте тепла. Чтобы узнать, что может переместить вашу аудиторию из первого раза во второй и т.д., единственным реальным союзником является тепловая карта. Например, если сайт начинает остывать прямо с первого раза, вы инстинктивно знаете, что добавление элемента вовлечения в точку доставки сгиба может помочь вам решить проблему. Продолжайте повторять это для всех перезарядок, и вы выиграли битву сражений.

Когда контент не получает должного внимания: посетители тратят около 80% своего времени на сканирование контента, расположенного над сгибом (3), и прокрутку по странице. По нашему скромному мнению, если группа маркетологов угадает, что нужно делать, чтобы оставаться выше сгиба, не глядя на данные о помолвке, мы упускаем здесь прекрасную возможность.

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

Например, роскошный отель The Vineyard, расположенный в Беркшире, использовал тепловые карты VWO для анализа эффективности кнопки CTA на странице бронирования номеров. Они узнали, что CTA страницы была неясной, практически невидимой в остальной части контента, и поэтому не смогли привлечь посетителей. Затем они заметно поместили кнопку CTA над складкой и стали свидетелями увеличения конверсии на 32,12%.

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

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

Table of Contents