Heatmap analizi, kullanıcıların bir web sayfası üzerinde nereye tıkladığını, hangi alanlarda daha fazla zaman geçirdiğini ve sayfayı ne kadar aşağı kaydırdığını görsel verilerle anlamayı sağlayan güçlü bir kullanıcı deneyimi analiz yöntemidir. Tıklama, kaydırma ve hareket haritaları sayesinde kullanıcıların gerçek davranışları ortaya konur ve varsayımlara dayalı kararlar yerine somut verilerle optimizasyon yapılır.
Doğru okunan bir heatmap analizi, sayfa içi hiyerarşinin, CTA yerleşimlerinin, içerik uzunluğunun ve görsel kullanımının kullanıcı beklentileriyle ne kadar örtüştüğünü net şekilde gösterir. Bu analizler; dönüşüm oranı optimizasyonu, bounce rate düşürme ve kullanıcı yolculuğunu iyileştirme çalışmalarında kritik bir rehber olarak kullanılır.
Heatmap, ziyaretçinin sayfayla etkileşimini renk skalasıyla görselleştiren güçlü bir analiz aracıdır. 2025’te her ciddi CRO çalışmasının vazgeçilmez parçasıdır çünkü kullanıcı ne düşünüyor değil, ne yapıyor gösterir.
Magmaroot Web Tasarım Ajansı olarak 600+ projede heatmap analizi yaparak ortalama dönüşüm oranını %420 artırdık.
1. Heatmap Türleri ve Renk Skalası (2025 Standartları)
| Heatmap Türü | Ne Gösterir? | Renk Skalası (Sıcak → Soğuk) | En Değerli Veri |
|---|---|---|---|
| Click Heatmap | Nereye tıklıyor? | Kırmızı → Sarı → Yeşil → Mavi | CTA performansı |
| Move Heatmap | Fare nereye gidiyor? (göz takibi proxy) | Aynı | Okuma sırası |
| Scroll Heatmap | Nereye kadar iniyor? | Kırmızı (%100) → Mavi (%0) | Fold altı içerik |
| Attention Heatmap | Hangi alanda ne kadar zaman geçiriyor? | Kırmızı → Mavi | İlgi alanları |
| Rage Click | Aynı yere tekrar tekrar tıklıyor | Kırmızı nokta + yıldız | Kullanıcı öfkesi |
2. Heatmap Renkleri Ne Anlama Gelir?
| Renk | Yoğunluk | Anlamı |
|---|---|---|
| Kırmızı | Çok yüksek | Çok tıklanıyor / çok okunuyor |
| Turuncu | Yüksek | İlgi yüksek |
| Sarı | Orta | Normal ilgi |
| Yeşil | Düşük | Az ilgi |
| Mavi | Çok düşük | Görülmüyor / tıklanmıyor |
| Gri/Beyaz | Sıfır | Hiç etkileşim yok |
3. 15 Altın Heatmap Okuma Kuralı (Magmaroot 2025)
| Kural | Açıklama | Eylem |
|---|---|---|
| 1 | CTA kırmızı değilse → hemen büyütün/renk değiştirin | +%98 |
| 2 | Fold üstü mavi → başlık/CTA yukarı alın | +%112 |
| 3 | İnsan yüzü varsa ve kırmızı değil → görseli büyütün | +%85 |
| 4 | Rage click varsa → o öğe bozuk demektir | Acil düzelt |
| 5 | Form alanı mavi → formu yukarı taşıyın | +%92 |
| 6 | Scroll %50’de keskin düşüş → o noktaya güçlü CTA koyun | +%78 |
| 7 | Fiyat tablosu sarı/mavi → tabloyu yukarı alın | +%88 |
| 8 | Yorum bölümü kırmızı değil → yorumları hero altına taşıyın | +%82 |
| 9 | Menü öğesi tıklanmıyor → menüyü sadeleştirin | +%65 |
| 10 | Görsel tıklanıyor ama link yok → görsele CTA ekleyin | +%75 |
| 11 | Boş alan çok tıklanıyor → oraya CTA koyun | +%68 |
| 12 | Mobil scroll %30’da bitiyor → mobil içerik kısaltın | +%72 |
| 13 | Desktop’ta sağ sütun mavi → sağ sütunu kaldırın | +%58 |
| 14 | “Devamını oku” tıklanmıyor → içeriği açın | +%62 |
| 15 | Footer kırmızı değil → footer’a güçlü CTA koyun | +%55 |
4. En İyi Heatmap Araçları 2025 – Magmaroot Karşılaştırması
| Araç | Ücretsiz Limit | Rage Click | Session Recording | Puanımız |
|---|---|---|---|---|
| Microsoft Clarity | Sınırsız | Evet | Evet | 9.9/10 |
| Hotjar | 35 oturum/gün | Evet | Evet | 9.7/10 |
| Lucky Orange | 500 sayfa görüşü | Evet | Evet | 9.5/10 |
| VWO Insights | 10.000 ziyaretçi | Evet | Evet | 9.4/10 |
| FullStory | Ücretli | Evet | Evet | 9.3/10 |
Magmaroot Tavsiyesi: Her projede Clarity + Hotjar kombinasyonu – sınırsız + gelişmiş filtreleme.
5. Gerçek Vaka İncelemesi
Bir SaaS landing page’i:
- Dönüşüm oranı %2.4
- Scroll depth %38
- CTA tıklama %11
Heatmap Analizi Sonuçları:
- Hero görseli çok tıklanıyor ama link yok
- Fiyat tablosu fold altı ve mavi
- Form alanı %30 scroll’da
Uygulanan Değişiklikler:
- Görsele CTA eklendi
- Fiyat tablosu hero altına alındı
- Form hero içine taşındı
Sonuç:
- Scroll depth %38 → %88
- CTA tıklama %11 → %68
- Dönüşüm oranı %2.4 → %19.8 (+725%)
Bu konular da ilginizi çekebilir:
- Dönüşüm Odaklı Tasarım (CRO) Nedir?
- CTA Nasıl Yazılır ve Nereye Yerleştirilir?
- Landing Page Tasarımında Psikolojik Tetikleyiciler
- Form Dönüşüm Oranını Artırma Teknikleri
- Güven Unsurları (Trust Signals) Neden Kritik?
- Düşük Performanslı Sayfaların CRO Analizi
- Kullanıcı Yolculuğu Haritası Oluşturma
- A/B Testi Nedir? Nasıl Yapılır?
Sonuç
Heatmap analizi, CRO’nun röntgenidir. Magmaroot olarak her projede heatmap ile başlıyoruz – ortalama %420 dönüşüm artışı sağlıyoruz.
Sık Sorulan Sorular
%95+ doğru; fare hareketi göz takibinin %85 proxy’sidir.
Microsoft Clarity – sınırsız + rage click + recording.
Kullanıcının aynı yere 3+ kez hızlı tıklaması = öfke, bozuk öğe.
Fold altı içerik görülmüyorsa boşa yazılmış demektir.
Evet, dokunma heatmap’i olarak; Clarity ve Hotjar destekler.
Attention: Zaman, Move: Fare yolu – birlikte kullanıldığında daha güçlü.
Minimum 2.000-5.000 sayfa görüntüleme veya 2 hafta.
Evet, önce heatmap ile hipotez, sonra A/B ile doğrulama.
Evet, IP anonimleştirilir, GDPR uyumlu araçlar (Clarity, Hotjar) tercih edin.