Site hızı özellikle son 5 yıldır, dijital dünya tarafından önem verilen bir unsur haline geldi. Arama motorlarının kullanıcı niyetini tatmin etme çabası (user intent), teknolojinin cihaz bazında gelişmesi (mobil cihazların yaygınlaşması) ve web teknolojilerinin (CDN, caching gibi) artmasıyla birlikte site hızının önemi birden fazla kulvarda iyice gün yüzüne çıkmaya başladı. 

Site hızı özellikle SEO (arama motoru optimizasyonu) çalışmalarında en öncelikli iş kalemlerinden biri haline geldi. Bunun ardında yatan nedenleri biraz daha irdeleyeceksek olursak, öncelikle göz atmamız gereken nokta “hızlı bir internet sitesi”nin getirileridir.

Bu yazıda, internet sitesi hız optimizasyonu tekniklerinden, hız metriklerine, kullanıcı deneyimini iyileştirmenin öneminden, hızın dönüşüme (conversion rate) etkisine, geniş kapsamda bakıldığında “hız neden önemlidir, “internet sitesi hızlı olmalı” derken ne kast edilmektedir, Google’ın hıza yaklaşımı nasıldır” gibi soruların yanıtı bulabileceksiniz. Ardından yazının ana konusu olan Core Web Vitals’dan bahsedeceğiz. 

Site Hızı Nedir?

Kısaca site hızı, internet sitelerinin kullanıcıların tarayıcılarında (browser) ne kadar hızlı yüklendiğinin, ne kadar hızlı gezinmeye ve işlem yapmaya hazır hale geldiğininin ölçümlenmesidir diyebiliriz. 

Site hızını ölçerken çeşitli hız metrikleri kullanılır. Bu metriklerden bazıları sayfa yüklenme durumunu (loading), bazıları kullanıcının görsel algısını (visual stability) bazıları ise etkileşimi (interactivity) ölçümlemektedir. 

Image of feedback user is typically looking for

Kaynak: https://web.dev/what-is-speed/

 

Site Hızı Neden Önemli?

Özellikle internet üzerinde rekabetin artması, internet teknolojilerinin gelişmesi ve kullanıcıların internete bağlandığı cihazların mobile doğru evrilmesiyle birlikte hızlı yüklenen bir internet sitesine sahip olmak bulunduğunuz pazarda/alanda tutunmak için bir gereklilik haline geldi.

Kullanıcıların internet hızı konusunda tahammüllerinin ölçümlenmesi, internet hızının gelire/dönüşümüne olan etkisinin araştırılmasıyla birlikte, hızın kullanıcı davranışlarında önemli bir belirleyici olduğu anlaşıldı. Google gibi arama motorları da yıllar içinde değişen bu trende ayak uydurdu ve MFI (mobile-first indexing) anlayışına geçerek sitelerin mobil versiyonlarını öncelikli olarak indeksine almaya başladı.

Google’ın hızın etkisini anlamak için yaptığı bir araştırmaya göre, mobil cihazlarda sayfa yüklenme hızındaki bir saniyelik gecikme %20 oranında dönüşüm oranına (conversion rate) etki etmektedir. 

Anlaşılacağı üzere, hızlı bir siteye sahip olmak hem rakiplerinizle rekabet etmenizi kolaylaştırır, hem de ziyaretçilerinizin dönüşüm oranını arttırır. Bununla birlikte en önemlisi Google sıralamalarında ödüllendirilmenizi de sağlar.

Conversion rate ile hız ilişkisini daha iyi anlamak için, Google Test My Site aracını kullanabilirsiniz. Araca, ortalama aylık ziyaretçi sayınızı, dönüşüm oranınızı ve ortalama sepet tutarınızı girerek, yapacağınız her 1 saniyelik iyileştirmenin gelirinize olan etkisini ölçümleyebilirsiniz.

Milliseconds earn millions: Why mobile speed can slow or grow your businessKaynak: Google – Milliseconds earn millions: Why mobile speed can slow or grow your business

 

Core Web Vitals ile değişen hız anlayışına geçmeden önce, dikkat çekilmesi gereken bir nokta da şudur: Hız konusu oldukça teknik bir konu olarak algılanır ve özellikle teknik tarafla ilgilenmeyenlerin gözünü korkutur. 

Fakat özünde, internet üzerinde ne iş yaptığınız/hangi hizmeti sağladığınız farketmeksizin bu işin kullanıcılar tarafından daha çok tercih edilmesi, daha çok gelir getirmesi için site hızı optimizasyonunun mutlaka eğilmeniz gereken bir konu olduğunun altını çizmeliyiz. 

Evet, günün sonunda hız optimizasyonu önerilerini, karar alıcı role sahip ya da marketing çalışanı olarak sizden ziyade, IT/Yazılım ekipleri uygulayacaktır. Ama iş modelinize katkısı böylesi yüksek olan bir konuda aksiyona ön ayak olmak öncelikle sizlerin sorumluluğunda.

 

Peki, Core Web Vitals Nedir? Kullanıcıyı Merkeze Alan Hız Anlayışı Nedir?

Site hızı çok sayıda metrik ile ölçümlenmektedir. Bu metriklerden bazıları ile ilgili Google’ın sunduğu detaylı bilgi web.dev/metrics adresinde yer almaktadır. 

Hız metrikleri, bir sayfanın yüklenmeye başlamasından sonra ekranda oluşan ilk içeriğin ölçümlenmesinden (First Contentful Paint), sayfanın kullanıcının etkileşime hazır hale gelmesine (Time to Interactive) kadar birden farklı alanı kapsar.

Google bir sitenin hızını ölçümlerken iki kaynaktan gelen verilere bakar, field data (saha verisi) ve lab data. (test ortamı verisi)

  • Field data, Chrome kullanıcılarının internet gezinme deneyimlerinin anonim olarak toplandığı CrUx datasetlerinde tutulur. Field data, RUM (real user monitoring) ile elde edilir. Bu açıdan oldukça değerli verileri barındırır çünkü doğrudan gerçek kullanıcıların deneyimlerini ifade eder.
  • Lab data ise Lighthouse gibi araçlarla ölçümlenen, sitenin belirli koşullar altında, bir anlamda laboratuvar ortamında test edilmesiyle elde edilen verileri ifade eder. 

PageSpeed Insights(PSI) gibi araçları kullanarak, siz de internet sitenizin saha ve laboratuvar ortamında çeşitli metrikler üzerinden hız performans durumunu görebilir, Google’ın siteniz için sunduğu teşhis ve önerileri inceleyebilirsiniz.

 

Peki ama birbirinden farklı metrikler varken, bir sitenin hızlı olup olmadığını nasıl anlayacağız?

Örneğin bir e-ticaret siteniz varsa sitenizin hızlı yüklenmesi, kullanıcının sitede geçirdiği, satın alımla sonlanacak customer journey açısından oldukça önemlidir. E-ticaret siteleri için sayfalarının hızlı yüklenmesini sağlamak, site içinde ürün ararken kullanıcıyı bekletmemek gibi noktalar hız açısından önemlidir. 

Öte yandan bir içerik sitesiyseniz, içeriğinizin hızlı yüklenmesini sağlamak, kullanıcının içerik deneyimini hız kökenli sorunlarla bloke etmemek oldukça önemlidir. 

Görüldüğü gibi hız optimizasyonu çalışmalarında, internetteki varlık sebebiniz ve kullanıcıya sunduğunuz yarara uygun bir odak oluşturmak ve rakiplerinizle durumunuzu kıyaslamak daha mantıklı olacaktır. 

Google da bu sorundan, yani “hızlı site” tanımının göreceliliğinden yola çıkarak bir standart oluşturma arzusuyla somut bir adım attı. Ayrıca geçtiğimiz aylarda duyurduğu önümüzdeki sene sıralama faktörü teşkil edecek 2021 Page Experience güncellemesine bu adımı da dahil etti.

Site hızını hangi metrik/metriklere göre değerlendirmeli? sorusuna Google yeni bir yanıt veriyor. Artık internet sitesi hızıyla alakalı Google’ın gözünde bir standart mevcut. Kullanıcı deneyimini merkeze alan bu yeni standardın adı da Core Web Vitals.

2021’den itibaren Google, interneti (web) kullanıcı deneyimi odaklı dönüştürmeyi ve siteleri de bu dönüşüme uymaları konusunda teşvik etmeyi amaçlıyor. 

A diagram illustrating the components of Search’s signal for page experience.Kaynak: Evaluating page experience for a better web

 

2021 Page Experience güncellemesiyle birlikte, yukarıda gördüğünüz kalemler Google açısından “sıralama faktörü/ranking factor” haline gelecek. Bu nedenle bu kalemlerden özellikle Core Web Vitals’ı iyi anlamak ve bu yapıya şimdiden hazır olmakta fayda var. 

Sitenizin aşağıdaki alanlarda da gereklilikleri yerine getirmesi önemli:

Mobile Friendly >> Sitenizin mobil uyumlu olup olmadığını buradan öğrenebilirsiniz.

– Safe Browsing >> Kimlik dolandırıcılığı, bilgi hırsızlığı gibi konularda önlem almak şart. Sitenizi buradan test edebilirsiniz.

HTTPS >> Hala geçmediyseniz HTTPS’e geçmek için vakit kaybetmeyin.

– No Intrusive Interstitials >> Kullanıcıyı rahatsız eden pop-upların kullanılmaması gerekiyor.

 

Core Web Vitals – “Essential metrics for a healthy site”

Core Web Vitals Google’ın da deyimiyle “sağlıklı bir internet sitesi için önemli metrikler”i ifade eder. Core Web Vitals’ın arkasında yatan çalışmaları buradan okuyabilirsiniz. Farklı açılardan kullanıcı deneyimini odağına alan bu metrikleri tek tek inceleyelim.

Bu kapsamda Google üç temel metriği ön plana çıkarmaktadır. 

Bunlar;

 

  • Largest Contentful Paint (LCP) – Yüklenme
  • First Input Delay (FID) – Etkileşim
  • Cumulative Layout Shift (CLS) – Görsel Stabilizasyon

 

 

Largest Contentful Paint (LCP) Nedir?Good LCP values are 2.5 seconds, poor values are greater than 4.0 seconds and anything in between needs improvement

 

  • Sayfanın yüklenmesiyle alakalı, kullanıcı merkezli bir metriktir.
  • Sayfanın yüklenmeye başladığı ilk 2.5 saniye içinde Largest Contentful Paint öğesinin oluşması iyi skor almak için gereklidir.
  • Bir sayfa yüklenirken o sayfadaki en büyük (görünür) elementin yüklenmesini ifade eder. 
  • Metriğin altında yatan fikir şudur: Kullanıcılarda bir sayfanın yüklendiğine dair algı sayfadaki en büyük görsel öğenin yüklenmesiyle oluşur.
  • LCP, sayfada belirli etiketlerle sunulan görsel ve video elementlerini değerlendirmektedir.
  • LCP metriği hem field hem de lab verilerinden ölçülmektedir.
  • LCP değerlerini etkileyen ve optimize edilmesi gereken önemli faktörler; 
  • Sunucu yanıt sürelerinin yavaşlığı
  • Sayfanın render edilmesini bloklayan JS ve CSS
  • Client Side Rendering

 

First Input Delay (FID) Nedir?

Good fid values are 2.5 seconds, poor values are greater than 4.0 seconds and anything in between needs improvement

 

  • First Input Delay, kullanıcıların sayfayla girdikleri etkileşimleri ölçümlemektedir.
  • FID, kullanıcı sayfayla etkileşime girdiğinde (bir şeylere tıkladığında ve/veya bir butona bastığında) sayfanın yanıt verme süresidir.
  • Sayfa tarafından kullanıcının aksiyonuna geç dönüş olduğunda kullanıcı, sayfanın yavaş olduğunu ya da dokunduğu/tıkladığı elementin bozuk olduğunu düşünebilir.
  • FID için Google tarafından önerilen eşik değeri 100 ms’dir. Kullanıcı sayfayla etkileşime girdiğinde 100 ms altında bir sürede etkileşiminin karşılığını görmesi gerekmektedir.
  • FID metriğini optimize etmek için önemli kalemler;
  • JS execution süresini azaltmak
  • JS dosyalarını küçültüp sıkıştırmak
  • Kullanılmayan JSleri defer etmek
  • FID, yalnızca field/saha verisi üzerinden ölçülmektedir.

 

Cumulative Layout Shift (CLS) Nedir?

Good CLS values are under 0.1, poor values are greater than 0.25 and anything in between needs improvement

  • Cumulative Layout Shift, belki de hepimizin sıklıkla rahatsız olduğu bir sorunu ifade eder. Videoda da görebileceğiniz gibi bazen sayfalarda stabilizasyon sorunları nedeniyle istenmeyen yerlere tıklamak zorunda kalınır. 
  • CLS bir sayfadaki görsel stabilizasyonunu ölçümlemek için kullanılan field ve lab verileri üzerinden değerlendirilen bir metriktir.
  • CLS bir sayfadaki beklenmeyen her kaymaya bir puan atayıp bunların toplamını ölçer. 
  • Buna göre eşik değeri, 0.1 olmalıdır, bu değer aslında sayfayı oluşturan elementlerin yerlerinin sabit bir şekilde tanımlanmasını ve beklenmedik kaymaların(unexpected layout shifts) oluşmamasını talep eder. Bunun için bir çeşit skor formülü oluşturulmuştur.
  • CLS’de sorun yaşanmasına neden olan hatalar:
  • Boyutlandırılmamış görseller
  • Boyutlandırılmamış reklamlar, iframe’ler
  • Sayfaya dinamik olarak eklenen içerikler
  • Sayfadaki her ögede özellikle görsel ve videolarda mutlaka ölçeklendirme (size attribute) yapılması önemlidir.
  • Var olan bir içeriğin önüne başka bir içerik eklenmemeli, örneğin kullanıcı bir içeriği okurken okuduğu içeriğin önüne pop-up çıkarmamalı.

Core Web Vitals metriklerini ölçümlemek için burada yer alan araçları inceleyebilirsiniz. 

 

Chrome User Experience Report (CrUX) Dashboard

CrUX Dashboard

Google, Data Studio’da Chrome User Experience için bir dashboard hazırlayarak bu dashboard’a Core Web Vitals metriklerini de entegre etti. 

Peki kısaca CrUx nedir? İşimize nasıl yarar?

  • Chrome User Experience Report, dünya genelinde Chrome tarayıcı kullanan gerçek kullanıcıların aylık site gezinme deneyimlerini toplar. 
  • Hız çalışmalarında oldukça önemli bir kaynaktır çünkü doğrudan gerçek kullanıcıların verilerini sahadan toplayarak belirli metrikler altında sunmaktadır.
  • CrUx’in topladığı ve dashboard olarak sunduğu bazı metrikler; First Paint, First Contentful Paint, DOMContentLoad, First Input Delay, Cumulative Layout Shift, Largest Contentful Paint, Time to First Byte, *Notification Permissions gibi metriklerdir.
  • Bu metrikleri; bağlantı tipi (3G/4G), cihaz tipi (phone, desktop) ve ülkelere göre dimensionlar altında sunmaktadır.
  • Trafiği düşük sitelerin (Chrome kullanıcılarının çok ziyaret etmediği) CrUx raporlarında veri bulunmayabilir. Buradaki veri sitenize gelen gerçek kullanıcılardan toplandığından çok düşük trafikli sitelerde bu rapordan yararlanılamayabilir.
  • Twitter üzerinden Chrome Ux Report’un aylık datasetlerinin yayınlanma duyurularını takip edebilirsiniz.
  • CrUx verilerini kullanarak gerçek kullanıcıların sitenizdeki deneyimlerinden yola çıkabilir bu sayede aksiyon planlarınızı oluşturabilirsiniz.

*Notification Permissions henüz deneysel bir metriktir, kullanıcının sitelerin Chrome’da bildirim gösterme iznine verdiği yanıtları kayıt altına almaktadır. 

Bundan Sonra Ne Yapmalıyız?

Bitirirken yukarıda görüldüğü üzere hızın ve özellikle hızı kapsayan kullanıcı deneyiminin dijital hayatta çok çok daha büyük bir hızla önem kazanmaya başladığını görüyoruz. Aslında “mobile-first” ya da ”core web vitals” anlayışlarının ardında yatan noktanın user-first bir internet deneyimi olduğunu görüyoruz.

Bu nedenle markaların, dijital pazarlama ajanslarının ve web geliştiricilerin, iş modellerini kullanıcı deneyimi çerçevesinde gözden geçirmesi, buna uygun aksiyon planları oluşturması ve çıktıları sürekli test ederek sonu gelmez optimizasyonlarla rakiplerinden geri kalmaması gerekiyor. 

Bu noktada kullanıcı hareketlerinin takip edilmesi, A/B testlerin yapılması, kullanıcılardan toplanan verilerin analiz edilip anlamlı içgörülere dönüştürülmesi oldukça önemli. Hız konusunda kullanıcılardan gelen verileri incelemek, sitenizi düzenli olarak test etmek ve yapılan geliştirmelerin hıza olan etkisini atlamamak gerekiyor.

Son olarak özellikle disiplinlerarası çalışmanın daha hayati olduğunu görüyoruz. Bugün SEO ve Veri Analizi ekipleri çok daha yakından çalışmalı, Performans Pazarlaması ise bunlardan ayrı düşünülmemelidir. Kullanıcıya fayda sunma ve markanıza değer katma yolunda senkronize ve birbirini tamamlayan bir çalışma pratiği yakalamak başarının altın anahtarı oluyor.

Hazırlayan: SEO Executive Furkan Mersinli