Tek sayfalık uygulamaları ölçme

Bu belge, tek sayfalık uygulamalarında Google Analytics'i kullanarak sayfa görüntülemelerini ölçmek isteyen geliştiriciler içindir.

Tek sayfalık uygulamalar (SPA), bir HTML belgesini bir kez yükleyen ve ek içerikleri JavaScript API'lerini kullanarak getiren web siteleridir.

Örnek: Bazı potansiyel müşteriler edinmek için bir formunuz olduğunu varsayalım. Form üç ekrandan oluşur: > * Müşteri bilgilerinin alındığı ilk ekran. * Müşterilerin belirli hizmetlerle ilgilendiklerini belirttikleri ikinci ekran. * Üçüncü ekran Müşterinin ilgi alanlarıyla ilgili web seminerlerine kaydolma sayfası.

Tek sayfa uygulamalarındaki sayfa görüntülemelerini doğru şekilde ölçmenin anahtarı, kullanıcının etkileşimde bulunduğu her ekran için sayfa görüntülemelerini saymak ve kullanıcı yolculuğunu doğru şekilde izleyebilmek için sayfa yönlendireni doğru şekilde almaktır.

Başlamadan önce

Bu sayfada, aşağıdakilere sahip olduğunuz varsayılmaktadır:

Tek sayfalık uygulama ölçümünü uygulama

Doğru SPA ölçümü uygulamak için yeni bir sanal sayfa görüntüleme tetiklemek üzere aşağıdaki yöntemlerden birini kullanın:

  • Tarayıcı geçmişi değişiklikleri (önerilir): SPA'nız ekranları güncellemek için History API'yi (özellikle pushState() ve replaceState() yöntemini) kullanıyorsa bu seçeneği kullanın.

  • Özel etkinlikler: Web siteniz farklı ekranları oluşturmak için DocumentFragment nesnesini kullanıyorsa bu seçeneği kullanın.

Tarayıcı geçmişi değişikliği uygulama

Tek sayfa uygulamanızda History API kullanılıyorsa tarayıcı geçmişi etkinliklerine göre sayfa görüntülemelerini otomatik olarak izlemek için Google Analytics'te geliştirilmiş ölçümü etkinleştirebilirsiniz.

Google Analytics'te geliştirilmiş ölçümü etkinleştirme

Tarayıcı geçmişine göre page_views otomatik olarak ölçmek için:

  1. Google Analytics'i açın.

  2. Yönetici bölümündeki Veri toplama ve değiştirme altında Veri Akışları > Web'i tıklayın.

  3. Tüm seçenekleri etkinleştirmek için Geliştirilmiş ölçüm'ün altındaki anahtarı Açık konumuna kaydırın.

  4. Tek tek seçenekleri düzenlemek için tıklayın. Sayfa Görüntülemeleri bölümünde Gelişmiş ayarları göster'i tıklayın. Hem Sayfa yüklemeleri hem de Tarayıcı geçmişi etkinliklerine dayalı sayfa değişiklikleri'ni etkinleştirdiğinizden emin olun.

    Sayfa görüntüleme ayarını gösteren bir resim

  5. Değişiklikleri kaydedin.

Ölçüm ayarlarınızı doğrulama

Tek sayfalık uygulamanızın sayfa görüntülemelerini doğru şekilde ölçtüğünü doğrulamak için:

  1. SPA ölçüm ayarlarınızdaki her etiket için hata ayıklama modunu etkinleştirin. DebugView'da etkinlikleri izleme hakkında bilgi edinin.

  2. Tek sayfalık uygulamanızı tıklayarak inceleyin. Yeni bir sanal ekrana tıkladığınızda DebugView'da yeni bir page_view etkinliği görmeniz gerekir. Sayfa yönlendirenin ve sayfa konumunun doğru şekilde güncellenip güncellenmediğini kontrol etmek için page_view etkinlik parametrelerini önceki page_view etkinliğiyle karşılaştırın.

Tek sayfa uygulamalarıyla ilgili ek önemli noktalar

page_view etkinlikleri göndermenin yanı sıra Google Analytics ile güçlü bir SPA entegrasyonu ve daha iyi bir kullanıcı deneyimi için şu ek hususları da göz önünde bulundurun:

Kaydırma konumunu yönetme

Kullanıcılar bir SPA'da görünümler arasında gezinirken tarayıcı genellikle mevcut kaydırma konumunu korur. Bu durum, kullanıcıların yeni sanal sayfanın üst kısmını görmemesine neden olabilir ve kaydırma derinliği izlemeyi etkileyebilir.

Öneri: Her sanal sayfa geçişinden sonra kaydırma konumunu programatik olarak sayfanın veya ana içerik kapsayıcısının en üstüne sıfırlayın.

// Example: Reset window scroll position on a route change in your SPA
window.scrollTo(0, 0);

// Or, if your content is within a specific element:
// document.getElementById('main-content').scrollTo(0, 0);

Bu değişiklikle birlikte kullanıcılar yeni içeriğin en üstünden başlayacak. Böylece Google Analytics kaydırma izleme özelliği, yeni sanal sayfadaki etkileşimi doğru şekilde ölçebilecek.

Tarayıcı özelliklerinde içerik erişilebilirliğini sağlama

Kullanıcılar, sanal sayfa yüklemesinden sonra sayfa içi arama (Ctrl+F) gibi tarayıcı özelliklerinin çalışmadığıyla ilgili sorunlar bildiriyorsa bu durum, SPA'nızın DOM'u nasıl güncellediğini gösterebilir.

Öneri: SPA çerçevelinizin ve yönlendirme mantığınızın, DOM'un ilgili bölümlerini yeni sayfanın içeriğiyle tamamen ve eşzamanlı olarak güncellediğinden emin olun. Oluşturma işleminin gecikmesi veya ana DOM ağacından gizlenen içerikler, tarayıcının arama işlevi tarafından hemen dizine eklenemeyebilir. İçeriğe erişilebilirliği onaylamak için sanal gezinmelerden sonra sayfa içi aramayı test edin.

Otomatik etkinliklere etkisi

Sanal sayfa görüntüleme ölçümünü SPA'nızda doğru şekilde uygularsanız Google Analytics diğer otomatik etkinlikleri uygun şekilde işler. Ekran değişiklikleri için sanal sayfa görüntülemeleri kaydedilmezse Google Analytics, tek sayfalık uygulamayı tek bir sayfa olarak değerlendirir ve bu da metriklerin çarpık olmasına neden olur.

Örneğin, user_engagement etkinliği, kullanıcının bir sayfada etkin olarak geçirdiği süreyi ölçer. Sanal sayfa görüntülemeleri olmadan tüm etkileşim süresi ilk sayfa yüklemeye atfedilir. Bu da tek tek ekranlarda harcanan sürenin analiz edilmesini imkansız hâle getirir.

Sanal sayfa görüntüleme ölçümü doğru şekilde uygulandığında:

  • Kullanıcı bir sanal sayfadan diğerine geçtiğinde user_engagement etkinliği gönderilir.
  • Önceki sanal sayfanın etkileşim süresi hesaplanır ve user_engagement etkinliğiyle birlikte gönderilir. Bu işlem genellikle yeni sanal sayfanın page_view etkinliği işlenmeden hemen önce gerçekleşir.
  • Tıklamalar veya kaydırmalar gibi diğer etkinlikler, kullanıcının şu anda görüntülediği sanal sayfanın page_location ile ilişkilendirilir.

Bu sayede, kullanıcı etkileşimini ve diğer metrikleri tek sayfalık uygulamanızdaki tek tek ekranlar veya bölümler için analiz edebilir, böylece kullanıcı yolculuğu hakkında daha doğru bir anlayış elde edebilirsiniz.

Önceki
Sayfa görüntülemelerini ölçme
Sonraki
Etiket Yöneticisi ile tek sayfalık uygulamaları ölçme