PageSpeed Insight Teknik Yönlendirme

Blog’un daha önceki yazılarında 2021 Temmuz Algoritma güncellemelerinden bahsetmiş ve PageSpeed Insight puanlarını iyileştirerek nasıl bir trafik almaya başladığımı anlatmıştım. Bu yazımda PageSpeed Insight konusuna biraz daha derinlemesine giriş yaparak web sitenizi hızlandırmak için Google PSI raporlarını nasıl kullanacağınızdan bahsetmeye çalışacağım.

Page Speed Insights Giriş

Web sitelerini oluşturan, tasarlayan kişiler olarak biz de başka web sitelerini geziyor, alışveriş yapıyor ve videolar izliyoruz. Bunları yaparken kendi davranışlarınızı hiç düşündünüz mü? Video 2 sn takılsın rahatsız oluyoruz. Ya da bir müzik parçasını dinlerken kesintiler olunca ne oluyor diye bakıyoruz. Alışveriş sitelerinde sepete attığımız ürünün sepete eklenmesini beklerken canımız sıkılıp almaktan vazgeçiyoruz. Hayatımıza giren bu HIZ KAVRAMI artık her alanda kullanıcı deneyimini etkiliyor. İşte bu yüzden Google yavaş siteleri hızlı olanlardan artık ayırmak zorunda.

Yavaş sayfa hızı, organik arama, ücretli reklamcılık veya yönlendirme bağlantısı aracılığıyla kullanıcıların sizi nasıl bulduklarına bakılmaksızın, kullanıcıların web sitenizde kalmasını engelliyor. Hem kullanıcılar hem de anahtar kelime sıralamanız için sayfa hızınızı artırmak istiyorsanız, Google’ın PageSpeed ​​Insights (PSI) aracı bunu yapmanıza en çok yardımcı olacak araç.

Sayfa Hızı Nedir?

Google, sayfa hızını iki şekilde tanımlıyor.

• İçeriğin ekranın üst kısmında görüntülenmesine kadar geçen süre
• Bir tarayıcının sayfayı tam olarak oluşturması için geçen süre. ( bunu tarayıcı üzerindeki bekleme işaretinin tamamlanması olarak da düşünebilirsiniz.)

Bununla birlikte web sayfasının ne kadar hızlı olduğunu etkileyen çok fazla yan faktör var. Bunlar;

• Web sitesine bağlanan kullanıcının internet bağlantı hızı
• Alan adının barındırıldığı Hosting yani barındırma servisinin hızı
• Hosting ile Kullanıcı arasında bulunan ön bellek servislerinin hızı

Yani burada sayfa hızından bahsetmeye başladığımızda bazı unsurlar site sahibinin kontrolü dışında olabiliyor. Bunların dışında ise site içinde bulunan Resimler, Videolar, Javascript bağlantıları gibi web sitesinin optimize edebileceği çok fazla öğe bulunuyor.

Sayfa hızı neden önemli? Google SERP adı verilen Search Engine Result Page de bir sitenin yer alıp almayacağına karar verirken sayfanın genel performansını en öncelikli olarak değerlendiriyor. Bu nedenle içeriğinizi hız için optimize etmek için zaman ayırmalısınız.

PSI – Google PageSpeed Insights nedir?

PageSpeed ​​Insights , belirli bir web sayfasının içeriğini analiz eden ve sayfanın hem mobil hem de masaüstü sürümleri için sayfa hızı puanları sağlayan ücretsiz bir performans aracıdır. Araç ayrıca optimizasyon fırsatlarını tanımlar ve iyileştirme için özel önerilerde bulunur. Bu linkten de ulaşabilirsiniz. Aracı kullanırken URL’i denetlemeye başladığınızda bir sayfanın teknik açıdan nasıl daha iyi performansa ulaşacağını net olarak görebilir ve önerileri uygulayabilirsiniz.

Google PSI skorlarınız SEO tarafında bir sıralama etkisine sahip değildir. Ancak Google’ın Core Web Vitals adını verdiği metriklerdeki yavaşlıklar ve skorlar doğrudan SEO puanınıza etki eder ve sizin SERP ‘lerde yer alıp almayacağınızı belirler. Unutmayın SEO puanı için daha iyi anahtar kelime ve hız arasında çok ciddi bir ilişki bulunuyor.

Sayfa Hızının Kullanıcı Deneyimine Etkisi

Bir sayfanın hızına bakarken SEO yerine kullanıcı deneyimi için iyileştirilmesi önemlidir. E Ticaret sektörüne baktığımızda Desktop cihaz kullanıcılarının Mobil cihaz kullanıcılarına göre çok düşük ziyaretlerde olduğunu ancak Desktop cihazların hala gelir anlamında %40 ve üzeri paylara sahip olduğunu görüyoruz.

Bu durumda bir kullanıcının mobil cihazdan sizi arayarak web sitenizi ziyaret etmesinin en büyük nedenlerinden biri yaptığı araştırma ve bu araştırmanın hızla sonuçlanması oluyor. Bugün bir web sitesini ziyaret eden kullanıcıların %50 ile %70 arasındaki bir oranda web sitesini daha ilk sayfada terk ettiklerini biliyoruz.

Web sitenizde 1 ile 5 saniye arasında oluşan bir gecikme, ziyaretçinin hemen çıkma olasılığını %90 oranında arttırıyor. Daha da kötüsü, yükleme süresinin her ek saniyesinde dönüşüm oranları da ortalama %4,42 düşüş gösteriyor.

Develeopers.google.com’dan Ekim 2021

PageSpeed ​​Insights Nasıl Kullanılır

Bu linkten önce PSI sayfasını ziyaret edin. Google’ın PSI aracını kullanmak için araç çubuğuna herhangi bir URL girin, Analiz Et’e tuşuna basın ve PSI çalışmaya başlayacaktır. Bu noktada aynı bir kullanıcı gibi belirttiğini URL’e hem mobil hem de web tarayıcıları üzerinden ziyaret gerçekleşir ve sayfayı oluşturan öğeler tek tek taranarak ortalama bir internet hızı ile test edilmeye başlar.

PSI Test sırasında ;

• İlk olarak, sayfanın “Sayfa Verileri” ve Chrome Kullanıcı Deneyimi raporunda (CrUX) bulunan performans verileri toplanır.
• İkinci olarak, Lighthouse API aracılığıyla sayfa performansınızı ölçer . Buna “Lab Verileri” deniyor, çünkü web sayfasının hızını simülasyon edilmiş durumda. Bu nedenle Lab Verileri ile Mobil Ağ ve Orta Seviye Cihazları kullanarak ölçümü kontrollü bir ortamda yapar.

PageSpeed ​​Insights Raporunu Anlama

Rapor oluştuğunda başlangıçta korkabilirsiniz. Çünkü genel olarak skorlar çok düşük çıkabilir. Bu noktada henüz endişe etmeyin çünkü inanın bana raporu anladığınızda sorunların hepsini teker teker çözeceksiniz.

PSI raporuda renklendirilmiş bir kodlama yapısı göreceksiniz. Sayfanın iyi performans gösterdiği, hala iyileştirilmesi gereken veya düşük performans gösterdiği alanları anlamanızı kolaylaştırır.

• 90-100 arası Yeşil = İyi.
• 50-89 arası Sarı = İyileştirme Gerekiyor.
• 0-49 arası Kırmızı = Zayıf.

Alan Verileri

PSI’nin “Orgin Summary” verileri, belirli bir web sayfasının hızını ve performansını dört ana ölçüte böler. Bu ölçütlerin her biri sitenin hızı ve yükleme süresinin farklı bir yönünü yakalar.

Orgin Summary verileri Google’ın Chrome tarayıcısından URL de belirtilen web sitesine kullanıcıların yaptıkları ziyaretler sonucunda aldığı data ile oluşur ve 28 günlük datayı size sunar. Böylece web sitenizde 28 gün içinde yapılan değişikliklerin hız metriklerine olan katkısını görebilirsiniz. Metriklerin açıklamalarını inceleyecek olursak;

• İlk İçerik Boyaması – First Contentful Paint (FCP) : İlk metin veya resim objesinin yüklenmesi için geçen süre.
• En Büyük İçerikli Boyama – Largest Contentful Paint (LCP) : Web sitesi üzerinde en büyük metin veya resim objesinin ne kadar sürede yüklendiğini kontrol eder.
• İlk Giriş Gecikmesi – first Input Delay (FID) : Tarayıcının, kullanıcının ilk etkileşimine yanıt vermesi için geçen süreyi hesaplar.
• Kümülatif Düzen Kayması – Cumulative Layout Shitf(CLS) : Bu, görünüm alanında sayfanın herhangi bir hareketini ölçer.

CLS dışındaki performans metrikleri saniye veya milisaniye cinsinden ölçülür. CLS ise özel bir formülle hesaplanmaktadır. 0,1’in altındaki bir CLS puanı iyi olarak kabul edilirken, 0,25’in üzerindeki bir CLS puanı kötü olarak kabul edilir.

Laboratuvar Verileri

Google’ın PageSpeed ​​Insights Laboratuvar Verileri, Lighthouse API’sinden gelen sentetik verileri içerir. Lighthouse , FCP, LCP, CLS ve üç ek ölçümü dikkate alır.

• Hız İndeksi: – Speed Index Sayfa yükleme sırasında içeriğin görsel olarak görünmesi için geçen süre.
• Etkileşim Süresi – Time to Interactive : Sayfanın tamamen etkileşimli hale gelmesi için geçen süre.
• Toplam Engelleme Süresi – Total Blocking Time : FCP ile tam etkileşim arasındaki sürenin toplamı.

Burada elde edilen veriler anlık verilerdir. URL yi o anda test ederken oluşan verileri gösterir. Bu nedenle özellikle daha önce önbelleğe alınmamış bir sayfayı test ediyorsanız bu sayfayı bir kaç defa test etmenizde fayda olduğunu hatırlatmak isterim. Bunun sebebi önbellekli halinin daha doğru sonuçlar verecek olmasından dolayıdır.

Burada dikkat etmeniz ve bilmeniz gereken bir bilgi de performans raporunda metriklerin ağırlık değerleridir. Daha önce yazdığım hesaplanma değerleri makalemi ziyaret ederek buradaki değerlerin nasıl hesaplandığını ve ağırlıkları öğrenebilirsiniz.

Fırsatlar ve Teşhis

Fırsatlar ve Teşhis bölümleri, sayfa hızını artırmaya yönelik özel öneriler sunar. Rapor ayrıca, tavsiyelerin uygulanmasının getirebileceği tahmini zaman tasarrufunu da yer verilmektedir. Böylece bu işlemi yaptığınızda ne kadar bir hız kazanacaksınız net görebilirsiniz.

Raporda göreceğiniz üzere ilgili web sitesinde ekran dışında kalan resimlerin yüklenmesi durumunun kullanıcı aşağı indikçe olacak şekilde yapılması önerisi getirilmiş. Buna Lazy Load adı veriliyor. Bu işlemin yapılması durumunda tüm hız metriklerinde 0,75 s civarında bir iyileşme olacağı söylenmiş.

Raporun bu kısmında zaman zaman problemlerler karşılaştığımı söylemek istiyorum. Özellikle kullanılmayan Java Script ve CSS bölümlerinde ufak hatalar olabiliyor. Sayfada kontrol ettiğimde net olarak bu objelerin kullanıldığını biliyorum. Ancak raporda bu şekilde gözükebilir.

Raporun sağ üst tarafına ise yeni bir filtreleme alanı getirildi. Bu filtreleme alanı sayesinde raporda bulunan fırsatların hangi hız metriğini etkilediği çok net bir şekilde gösterilebiliyor.

Teşhisler

Raporun bu bölümü hız performans skoruna doğrudan etki etmiyor olsada, bu metrikleri web sayfanızda iyileştirmeniz kullanıcı deneyimi açısından çok önemli olabiliyor. Örneğin web yazı tipi yüklemesi sırasında metinin görünür kalması kullanıcının site yüklenirken okumaya başlaması anlamında etkili bir çözüm oluyor. Sağ taraftaki oklardan burada yapılması gereken kritik bilgileri de alabilirsiniz.