Теплова карта дозволяє відслідковувати активність користувачів на сайті. Кожен клік будь-якого відвідувача трохи підвищує температуру» області. Якщо область гаряча (червона), значить з нею часто клацають. Якщо холодна (синя) — на неї не звертають уваги.
У цій статті ви знайдете огляди 15 сервісів, за допомогою яких можна створити теплові карти. А в кінці — керівництво-пояснення: яка від цих карт користь, які висновки можна з них витягти, і навіщо взагалі варто усім цим займатися. Поїхали!
Навігація по статті
«Яндекс Метрика»
Вебсайт: https://metrika.yandex.ru/
Загальні враження: єдиний російськомовний сервіс в списку. До того ж абсолютно безкоштовний. Містить багато інструментів для аналітики, включаючи теплові карти кліків і скролінгу. Зручний інтерфейс, маса гайдів російською мови, онлайн-техпідтримка. Можна вибрати 2 періоду і порівняти активність користувачів в різний час.
Нещодавно «Яндекс» випустила додаток, що дозволяє працювати з «Метрикою» на мобільних пристроях.
Як підключити: вставити скрипт на свій сайт.
Вартість: повністю безкоштовний сервіс.
Клієнти: невідомо.
Heat-map.co
Вебсайт: http://heat-map.co/
Загальні враження: сервіс радикально відрізняється від інших. Його не потрібно підключати до сайту — отже, він не збирає статистику кліків. Heat-map сканує сторінку по посиланню і на підставі своїх алгоритмів показує карту.
Очевидно, що це просто припущення. Раз немає збору статистики, то і карта несправжня. Наприклад, я сканував свій сайт «Яндекс Метрикою» протягом 5 місяців. Та її теплова карта навіть близько не схожа на ту, що видав Heat-map.
Працює повільно, сторінки довго завантажуються. Застарілий дизайн наштовхує на думки про непопулярність проекту.
Як підключити: вказати посилання на свій сайт.
Безкоштовний тариф: можна працювати з двома сторінками сайту. Обмежень за часом немає.
Вартість: 29-79$ в місяць.
Клієнти: невідомо.
Crazyegg
Вебсайт: https://www.crazyegg.com/
Загальні враження: можна складати карти кліків і скролінгу. У сервісу є дуже крутий інструмент — Confetti. Він дозволяє сегментувати відвідувачів і переглядати результати за обраними сегментами. Наприклад, ви можете побачити, куди натискають люди, які прийшли з пошуку, а куди — передплатники з соцмереж.
При реєстрації потрібно вказати дані своєї картки Visa або Mastercard. Це гарантує, що ви не будете заводити новий акаунт, коли пробний період підійде до кінця, Ну а якщо карти у вас немає, навіть спробувати сервіс не вийде.
Як підключити: скопіювати скрипт в код сайту або встановити плагін. Можна вказати контакти свого веб-розробника, і йому на пошту відправлять лист з інструкціями.
Безкоштовний тариф: перші 30 днів, доступні всі функції.
Вартість: 9-99$ в місяць.
Клієнти: Yahoo!, Dell
SumoMe
Вебсайт: https://sumome.com/
Загальні враження: плагін, який встановлюється на сайт і додає багато різних функцій: від сервісів для аналітики (включаючи теплові карти) до створення форм підписки і соціальних кнопок. Можна дивитися статистику прямо на своєму сайті, не потрібно відкривати сторонні ресурси.
При створенні карт кліків сервіс враховує поведінки власника сайту. Вимкнути не можна.
Як підключити: скопіювати скрипт в код сайту або встановити плагін.
Безкоштовний тариф: всі програми працюють, але з обмеженим функціоналом. Теплові карти можна створювати безкоштовно.
Вартість: 0-119$ в місяць.
Клієнти: Airbnb, the Chive, 24JG.
Inspectlet
Вебсайт: https://www.inspectlet.com/
Загальні враження: інтерфейс красивий, але не самий зручний. Зведення статистики немає, доводиться постійно відкривати нові вкладки.
Як підключити: скопіювати скрипт в код сайту.
Безкоштовний тариф: до 100 записаних сесій і до 1000 переглядів в місяць, дані зберігаються 1 місяць.
Вартість: 39-299$ в місяць.
Клієнти: Ebay, Wordpress, Cisco.
Mouseflow
Вебсайт: https://mouseflow.com/
Загальні враження: сервіс все-в-одному. Зведення статистики по кожній сторінці сайту, зручний інтерфейс, наочна демонстрація роботи деяких інструментів. Можна аналізувати поведінку користувачів при заповненні форм і вважати конверсію.
Як підключити: скопіювати скрипт в код сайту.
Безкоштовний тариф: до 100 записаних сесій в місяць, дані зберігаються 1 місяць.
Вартість: 24-299€ в місяць.
Клієнти: Microsoft, NBC, Philips.
HotJar
Вебсайт: https://www.hotjar.com/
Загальні враження: красивий і зручний інтерфейс, багато інструментів для аналітики. Можна налаштувати зворотний зв’язок з відвідувачами сайту — запитати у них, що вони б хотіли змінити на сайті. Велика база керівництва по роботі з сервісом (англійською мовою).
Як підключити: скопіювати скрипт в код сайту.
Безкоштовний тариф: до 2000 переглядів в місяць, дані зберігаються 3 місяці. 15 днів пробної версії з повним функціоналом.
Вартість: 29-89€ в місяць.
Клієнти: Microsoft, Nintendo, Ikea.
Zarget
Вебсайт: https://www.zarget.com/
Загальні враження: зручний сучасний інтерфейс, докладні підказки по роботі з кожним інструментом. Є розширення для браузера, який дозволяє настроювати A/B тестування і переглядати теплові карти, не відкриваючи зайвих вкладок. Можна задати дату і час закінчення збору статистики, щоб згенерувати карту кліків тільки за потрібний період.
Як підключити: вставити скрипт на свій сайт.
Безкоштовний тариф: необмежений функціонал на перші 30 днів.
Вартість: 15-995$ в місяць.
Клієнти: Dotvnp, Biztalk360, Freshdesk.
Monkeytracker
Вебсайт: https://www.monkeytracker.cz
Загальні враження: не самий зручний, хоч і красивий інтерфейс. Важко знайти потрібні інструменти. Можуть виникнути проблеми при підключенні сервісу до свого сайту. Сторінки повільно завантажуються.
Як підключити: вставити скрипт на свій сайт.
Безкоштовний тариф враховує тільки 30 000 кліків в місяць, статистика зберігається 1 місяць. Обмежень за часом немає.
Вартість: 10-50$ в місяць.
Клієнти: E ON, KB, Skupina Cez.
Ptengine
Вебсайт: https://www.ptengine.com
Загальні враження: сервіс для веб-аналітики. Малює теплові карти, показує статистику, допомагає порахувати конверсію. Дизайн гарний, але верстка не «гумова» — на невеликих екранах працювати незручно.
Досить швидко оновлює інформацію про поведінку відвідувачів. Але самі сторінки завантажуються повільно. При активній роботі з сервісом це починає дратувати. Чомусь враховує тільки 1 клік від кожного користувача.
Як підключити: вставити скрипт на свій сайт або встановити плагін для WordPress.
Безкоштовний тариф: 2 тижні без обмежень. Потім: тільки 1 карта кліків, тільки 1 домен, до 1000 відвідувачів в місяць.
Вартість: 7.2-599$ в місяць.
Клієнти: Yamaha, ShutterShock, DJI, Unbounce
Feng-GUI
Вебсайт: https://www.feng-gui.com/
Загальні враження: нестандартний сервіс. Він не досліджує поведінку користувачів і не збирає статистику. Замість цього ваш сайт або завантажене зображення (наприклад, макет) прогляне робот. Потім він складе передбачувану карту кліків і покаже, на які елементи люди будуть дивитися в першу чергу.
Цікавий інструмент для веб-дизайнерів. Ви можете завантажити макет сайту, протестувати його і внести правки на підставі результатів.
На сайті можна почитати про дослідження, на підставі яких розроблено алгоритм.
Як підключити: завантажити зображення або вказати посилання на сторінку.
Безкоштовний тариф: пробного періоду немає. Але є демоверсія, яка просканує тільки частину зображення або сторінки сайту.
Вартість: 25-1250$ в місяць.
Клієнти: WSI. Razorfish, HeadScape.
Heatmap.me
Вебсайт: https://heatmap.me/
Загальні враження: не дуже зручний інтерфейс на самому сайті. Але для роботи з тепловими картами на нього не треба заходити. Просто натискаєте Alt+Shift+H, коли знаходитесь на своєму сайті, — і відкривається панель інструментів сервісу. Потрібно вказувати багато інформації при реєстрації.
Як підключити: встановити плагін для WordPress або скопіювати код на сайт.
Безкоштовний тариф: тільки 1 сайт, не більше 5 сторінок і не більше мільйона переглядів на місяць. Обмежень за часом немає.
Вартість: 100-200$ в місяць.
Клієнти: Peugeot, Quiksilver, Netmums.
Simpleheatmaps
Вебсайт: https://www.simpleheatmaps.com/
Загальні враження: незручний інтерфейс, сервіс працює повільно. Довго завантажуються сторінки і довго обробляються дані. З можливостей — тільки карти кліків, уваги та скролінгу. За півгодини використання сайт двічі завис.
Як підключити: скопіювати код скрипта на сайт.
Безкоштовний тариф: пробний період на 30 днів. Доступні всі функції сервісу, але стоїть обмеження на 100 000 переглядів на місяць.
Вартість: 19-149$ в місяць.
Клієнти: невідомо.
Seevolution
Вебсайт: http://www.seevolution.com/
Загальні враження: встановлює панель інструментів на ваш сайт. Щоб відкрити її, потрібно додати «/?seevolution» до адреси сторінки. Тобто статистику і теплові карти можна подивитися, не заходячи на сторонні ресурси.
Навіть на платних тарифах статистика зберігається всього 30 днів — це мало в порівнянні з конкурентами. Зате кількість досліджуваних сторінок не обмежене навіть при безкоштовному використанні.
Як підключити: скопіювати код скрипта на сайт, встановити плагін Wordpress.
Безкоштовний тариф: пробний період з необмеженими можливостями на 14 днів. Тариф Light — тільки 1 сайт, не більше 3000 відвідувачів в місяць.
Вартість: 49-299$ в місяць.
Клієнти: MGM Grand. Capsule, Mlife.
Stat24
Вебсайт: http://www.stat24.com/
Загальні враження: велика частина сторінок сайту — польською мовою. Тестового періоду немає, за використання карт кліків потрібно платити. Ні про які обмеження щодо кількості доменів, сторінок і відвідувачів на сайті не написано.
Як підключити: скопіювати код скрипта на сайт
Безкоштовний тариф: необмежений за часом, але карт кліків на безкоштовному тарифі немає.
Вартість: 60zt (15,6$) в місяць.
Клієнти: 1ps.ru. Ogicom, JMS.
Навіщо потрібні теплові карти
Для спостереження за поведінкою користувачів: куди найчастіше натискають, яку частину контенту осиливают. Якщо правильно користуватися цією інформацією, можна зробити сайт зручніше для відвідувачів і домогтися більш високої конверсії.
Є 3 види теплових карт:
- Карта кліків — показує області та елементи, на які клікають найчастіше.
- Карта активності миші — показує елементи, на які наводять курсор.
- Карта скролінгу — показує, як далеко відвідувачі гортають сторінки сайту.
Цінність карт активності миші під сумнівом. В описах подібних сервісів сказано, що людина наводить курсор туди, куди він дивиться. І ви нібито можете відстежувати погляди відвідувачів. На ділі ж більшість людей рухає курсором тільки щоб клікнути кудись або прочитати підказку. Ось дослідження від співробітника Google на цю тему.
А ось карта кліків вам точно знадобиться. По-перше, ви можете дізнатися, які елементи сайту користуються популярністю, а які — ні. Якщо кнопка залишається без уваги — треба щось змінювати. Перемістити її в інше місце, змінити колір і розмір, написати сильний заклик до дії.
По-друге, побачите, якщо користувачі вважають, що посилання має бути там, де її немає. Наприклад, у вас є блог. У стрічці відображається список постів — заголовок-посилання і некликабельная мініатюра.
Ви дивитеся на теплову карту, і бачите, що клацають по картинках набагато частіше, ніж за текстом. Люди вважають, що там має бути посилання. А у вас її немає. Невелика зміна — а юзабіліті зросте.
Або навпаки: у вас є активний елемент, але за нього не клацають. Можливо, варто додати підказки для відвідувачів: «Натисніть сюди, щоб сталося диво».
За допомогою карти скролінгу ви можете дізнатися, на якому етапі люди втрачають інтерес до вашої сторінки. Це корисно на лендингах — ви дізнаєтеся, скільки екранів прокручують користувачі і намагаєтеся вмістити на них все найважливіше.
Заодно можете подивитися, наскільки людям цікавий контент на сайті. Якщо статтю ніхто навіть не дочитав до половини — це тривожний дзвіночок. Або вміст не відповідає очікуванням користувачів (хотів почитати про Бетмена, а потрапив на сторінку про Качині історії), або він просто нудний.
Так що ж вибрати?
Почніть з «Яндекс.Метрики». Там є не тільки теплові карти, але і багато інших інструментів для аналізу сайту. А ще сервіс безкоштовний, російською мовою і з російськомовною техпідтримкою і гайдами.
Другий на черзі — Crazyegg. У ньому немає нічого, крім теплових карт, зате вони опрацьовані ідеально. Особливо мені сподобався інструмент конфетті, який дозволяє стежити за поведінкою окремих сегментів аудиторії. Такої фішки ні в кого більше немає.
Feng-GUI може стати в нагоді на етапі розробки. Намалювали макет — відразу ж потестували його. Якщо все окей — можна верстати. Якщо будуть явні помилки, ви їх побачите і зможете швидко поправити.
Інші сервіси або програють по зручності, або сильно схожі один на одного і на безкоштовну «Яндекс Метрику»).
