Isı haritaları ile ziyaretçilerinizin web sitenizde ne yaptığını öğrenin

Yayınlanan: 2021-11-04

İnsan doğası gereği meraklıdır. Merak, birçok yönden bizi en çok evrimleştiren özelliklerden biridir. Bilgi güçtür ve başkaları hakkında bilgi sahibi olmak, web sayfası geliştirme de dahil olmak üzere birçok farklı alanda çok faydalıdır.

Gizlilik dünyasının karanlık tarafına girmeden, bir web sayfasını yönetmenin ve performansını artırmak ve ziyaretçilerinizin sayfalarınızdan eskisinden daha fazla keyif almasını sağlamak için merakı etik bir şekilde kullanmanın birçok yolu vardır.

Isı haritaları, ziyaretçilerin bir web sayfasında ne yaptığını keşfetmeyi ve bu sayfayla nasıl etkileşime girdiklerini görmeyi amaçlayan bir tekniktir. Yani, ısı haritaları, ziyaretçilerin davranışlarını toplu ve anonim bir şekilde analiz etmemizi sağlar. Isı haritaları, imlecin web sayfasındaki hareketini analiz ederek, sayfanızın daha sıcak renklerle boyanmış etkin noktalarını gösteren görsel bir temsildir.

Dahası, ısı haritaları, web sitemizde uygulamak üzere iyileştirme fikirleri almamızı sağlar. Neler olduğu, ziyaretçilerin ne yaptığı, web'de neyin yanlış gittiği ve bunu nasıl çözebileceğimiz hakkında sonuçlar çıkarmak için ısı haritasında gördüğümüz verileri incelememiz yeterli.

WordPress'te bir ısı haritası nasıl oluşturulur

Günümüzde, bir ısı haritası oluşturmak son derece basittir. WordPress'te yalnızca ısı haritaları oluşturmamıza izin veren bir eklenti kullanmamız gerekiyor. Aslında ısı haritaları, Nelio A/B Testi kullanıcılarımız tarafından en çok talep edilen özelliklerden biridir.

Web sitemizde olası iyileştirmeleri araştırmaya devam etmek için uzun süredir ısı haritaları oluşturuyoruz. Örnek olarak, burada size Nelio'nun ana sayfasında oluşturduğumuz en son ısı haritasını göstereceğim.

İlk şey yeni bir ısı haritası oluşturmaktır. Bunu yapmak için, aşağıdaki ekran görüntüsünde görebileceğiniz gibi, Nelio A/B Testing'de yeni testi seçiyoruz ve ilgilendiğimiz sayfayı seçiyoruz:

Nelio A / B Testi ile bir ısı haritası oluşturma ekranı.
Nelio A/B Testi ile bir ısı haritası oluşturmaya yönelik ekran.

Ardından, eklentinin ziyaretçilerinizi izlemesi ve bilgileri otomatik olarak toplaması için testi başlatmamız yeterlidir. Bu andan itibaren aşamalı olarak yeni bir ısı haritası oluşturulacak ve sonuçları grafiksel olarak görebileceğiz.

Isı haritası sonuçları

Temsili bir ziyaretçi sayısını takip ettikten sonra, ısı haritasının sonucunu ayrıntılı olarak gözlemleyebiliriz. Ziyaretçilerimizden alınan bu verilerin farklı görünümleri olduğunu unutmayın.

En yaygın görselleştirme türü, analiz edilen sayfanın üstünde gösterilen bir dizi sıcak renkli noktayı gösteren ısı haritasının kendisidir. Bu sıcak noktalar, en fazla etkileşimi alan öğelerin üzerine yerleştirilir.

Öte yandan, ziyaretçilerin ayrılmadan önce aşağı kaydırarak sayfada ne kadar aşağılara geldiklerini daha sıcak renklerle gösteren kaydırma haritasına sahibiz.

Son olarak, genellikle bulabileceğimiz son temsil, sayfada yapılan tıklamaları bir nokta bulutu veya konfeti olarak görmekten ibarettir.

Önceki galeride, eklentimizin web sitemizin ana sayfasını analiz ederken oluşturduğu eksiksiz ısı haritası, kaydırma haritası ve cofetti'ye sahipsiniz. Şimdi, tüm bu üç gösterimden çıkarabileceğimiz bilgilerin bazı detaylarına daha yakından bakalım.

Isı haritası ayrıntıları

Isı haritası, ana sayfamızı ziyaret edenlerin etkinliklerinin çoğunun sayfanın ilk bölümünde gerçekleştiğini gösteriyor. Bizi eklentilerimizin her birinin belirli sayfalarına götüren düğmelerde çok sayıda etkileşim buluyoruz, bu da olmasını istediğimiz bir şey:

Isı haritasının ilk bölümünün detayı.
Isı haritasının ilk bölümünün detayı.

Ama aynı zamanda birçok insanın ilk kattaki aşağı kaydırmak için ok işaretini tıkladığını da gördük. Ne yazık ki, bu ok yalnızca bir göstergedir ve tıklanabilir bir öğe değildir. Bu yüzden, hala ona tıklayan izleyicilerimizin kafasını karıştırıyor.

Çözüm olarak oku, sayfayı otomatik olarak aşağı kaydıran bir düğmeye dönüştürmeyi seçebiliriz. Bunu yaparak, kullanıcı beklentilerini gerçeklikle uyumlu hale getiriyoruz.

Isı haritasındaki altbilginin ayrıntısı.
Isı haritasındaki altbilginin ayrıntısı.

Öte yandan, altbilginin de nasıl bu kadar çok ilgi gördüğünü merak ediyoruz. Bu önemlidir, çünkü bazı kullanıcıların aradıklarını sayfanın sonuna kadar bulamadığını gösterir. Özellikle en sıcak alan iletişim bağlantısıdır. Bu nedenle, kimsenin ihtiyaç duyduğu şeyi bulamadan ayrılmadığından emin olmak için bu bağlantıyı sayfanın daha belirgin bir alanına taşımak iyi bir test fikri olacaktır.

Kaydırma haritası ayrıntıları

Kaydırma haritası, ziyaretçilerimizin çoğunun yarım sayfanın ötesinde bir şey görmediğini gösteriyor. Bu bilgilerden çıkarabileceğimiz ana sonuç, o noktadan itibaren içeriğin kaçırılacağı ve bu nedenle alakalı olmaması gerektiğidir.

İçeriğimizi hedef kitlemiz için daha çekici hale getirmek ve böylece ayrılmalarını önlemek için bir olasılık, daha görsel ve dinamik bölümler göstermektir. Statik içerik yeterince öne çıkmıyor ve ziyaretçilerimizin dikkatini kaybediyoruz. Bu nedenle, bu bölümlerde değişiklik önermek, gelecekteki bir A/B testinde test etmek için iyi bir olasılık olabilir.

Konfeti detayları

Konfetiye gelince, test çalışırken aldığımız tüm tıklamalarla birlikte bize bir nokta bulutu gösteriyor. Normal bir ısı haritasıyla karşılaştırıldığında, konfetiler her bir tıklama hakkında daha fazla bilgi içerir.

Tıklayan ziyaretçilerin çoğunluğunun bunu 5 ila 10 saniye arasında nasıl yaptığını görüyoruz. Bu verileri bilmek çok ilginç, çünkü onların dikkatini çekmemiz gereken sürenin oldukça yaklaşık bir ölçüsüne sahibiz.

Sayfa ne kadar karmaşık ve anlaşılması o kadar zor görünüyorsa, o kadar çok ziyaretçi kaybederiz. Bu bilgiler, sayfanın çok daha basit ve daha radikal bir versiyonunu önermemize yardımcı olabilir. Örneğin, daha az bilgi görüntüleyebilir ve doğrudan konuya gidebiliriz. Bu, bir sonraki deneyebileceğimiz başka bir olası A/B testi.

Konfetinin ilk bölümünün detayı.
Konfetinin ilk bölümünün detayı.

Ayrıca tıklanabilir olmayan öğelere tıklayan ziyaretçilerin olduğunu görebiliyoruz. Burada özellikle alakalı bir bölüm, ürünlerimizi kullanan şirketlerin logolarının listesi veya müşterilerimizin referanslarıdır:

Konfetilerde görebildiğimiz kaçırılan tıklamaların detayı.
Konfeti içinde görebildiğimiz yanlış yerleştirilmiş tıklamaların detayı.

Bu bölümlerde tıklanabilir öğelerimiz yok, ancak yine de tıklama alıyorlar. Yine, bu kafa karıştırıcı olabilir ve bu nedenle sitemizin davranışının ziyaretçilerimizin beklentileriyle eşleştiğinden emin olmak önemlidir. Bundan kaçınmak için, oraya tıklamanız gerekmediğini daha net hale getirmek için bu bölümlerin tasarımını değiştirmeye karar verebiliriz. Hatta web'in bu bölümünde insanları kaybettiğimizi gördüğümüz kaydırma haritasındaki bilgileri dikkate alarak bölümleri silin.


Isı haritalarıyla ilgili önemli olan şey, ziyaretçilerimizin sitemizle nasıl etkileşime girdiğini analiz ederek iyileştirme fikirleri almaktır. Bu şekilde başarısız davranışları düzeltebilir ve daha sonra A/B testleri ile test edebileceğimiz sayfamızda olası iyileştirmeler önerebiliriz.

Nelio A/B Testing'in ücretsiz sürümünün, burada açıkladığım kadar basit bir şekilde WordPress sayfalarınızda ısı haritaları oluşturmanıza izin verdiğini hatırlatmama izin verin. Git ve dene. Ardından, deneyiminizi ve ziyaretçilerinizin davranışlarının bu görsel temsili aracılığıyla hangi bilgileri elde edebileceğinizi bize bildirin.

Unsplash'ta Almos Bechtold tarafından öne çıkan görsel.