Core Web Vitals Nedir?

Günümüzde kullanıcılar tarafından beğenilen ve verimli web sayfalarına sahip olan siteler, daha çok tercih edilmekte dolayısıyla daha tanınır hale gelmektedir. Bu noktada Core Web Vitals açısından kendini geliştiren web siteleri, kullanıcılara sunduğu hizmetin kalitesini arttırabilir ve arama motoru sıralamalarındaki yerini iyileştirebilir. Peki böylesine etkili bir yöntem sunan Core Web Vitals nedir?

Core Web Vitals, Google’ın resmi olarak açıkladığı bir sıralama faktörüdür. Türkçe karşılığı ise “Temel Web Göstergeleri” olarak verilebilir. Core Web Vitals metrikleri, kullanıcı deneyimini ve site açılış hızlarını baz alarak sayfa kalitesinin ölçülmesine olanak tanır.

Core Web Vitals Neden Önemlidir?

Açılış sayfası deneyimlerinin bir web sayfasının Arama Motoru Sonuçları Sayfası üzerindeki konumunu etkileyen faktörler arasında yer aldığı, Google tarafından açıklanmış bir gerçektir. Bu nedenle Google başta olmak üzere, tüm arama motorlarında yapılan aramalarda üst sıralarda görünmeyi hedefleyen web sayfalarının kullanıcılara sunduğu açılış sayfası deneyimlerini geliştirmesi büyük önem taşımaktadır. Core Web Vitals, web sayfalarını geliştirmek ve kullanıcı deneyimini iyi hale getirmek isteyenler için bir kontrol listesi niteliğindedir.

SEO çalışmaları yapan web sitesi sahiplerinin, Google tarafından oldukça önemsenen temel web göstergelerine uygunluk göstermesi gerekir. Çünkü bir web sitesinin aramalarda ön sayfaya ve üst sıralara çıkabilmesi, web sitesinin olabildiğince iyileştirilmesine ve kullanıcı deneyiminin üst düzeyde sağlanmasına bağlıdır. Bu nedenle online işletmeler ve web sitesi sahipleri, “Core Web Vitals nedir ve nasıl iyileştirilir?” gibi sorular hakkında bilgi sahibi olmalıdır.

Core Web Vitals Metrikleri

Metrikler performansı ve kullanıcı deneyimini ölçmek için kullanılır. Kullanıcı merkezli performans metrikleri ise bir web sitesinin gerçek kullanıcılara en üst düzeyde fayda sağlayabilmesi için web sitesinin eksiklerini belirleme ve iyileştirmede etkili olan araçlardır. Bir web sitesinin metrik skorlarını öğrenmek için Google PageSpeed Insights ve Chrome UX Report, GTmetrix gibi çeşitli ölçüm araçlarından yararlanılmaktadır. Gelin sözü edilen bu metrikleri yakından inceleyelim:

Largest Contentful Paint (LCP)

Largest Contentful Paint, kısaca LCP, En Büyük Zengin İçerikli Boya anlamına gelmektedir. Gerçek bir kullanıcının web sayfası linkine tıkladıktan sonra, sayfanın ne kadar süre içinde yüklendiğini ve bağlantıya tıklanan andan, ekrandaki en büyük boyutlu içeriğin görülmeye başladığı ana kadar geçen zamanı ifade etmektedir. LCP’nin TTFB ve FCP gibi diğer sayfa hızı ölçümlerinden farkı, kullanıcı için web sayfasını açmanın nasıl bir şey olduğunu temsil etmek yerine, sayfanızı görmeye ve onunla iletişim kurmaya odaklanmasıdır.

İyi bir kullanıcı deneyimi için ideal sayfa yüklenme hızı 2.5 saniye olarak kabul edilmektedir. Bu nedenle Google PageSpeed Insight üzerinden kontrol edilebilen LCP puanı 2.5 saniye ile 4 saniye arasında ise geliştirilmesi gereken, 4 saniye üzerinde ise yavaş bir değer olarak kabul edilmektedir.

First Input Delay (FID)

FID olarak kısaltılabilen First Input Delay’in Türkçe karşılığı İlk Giriş Gecikmesidir. FID, kullanıcıların bir web sayfasında işlem yaparken ne kadar zaman harcadığını ölçmektedir. İyi bir kullanıcı deneyimi sağlamak için FID süresinin 100 milisaniye ve altında olması gerekir. Bir web sitesinin FID puanını arttırmak için JavaScript değerlerinin en aza indirgenmesi, sayfa içeriğinin daha hızlı yüklenmesi için tarayıcı önbelleği kullanılması ve önemli olmayan eklentilerin kullanımının azaltılması gibi değişiklikler gerçekleştirilebilir.

Cumulative Layout Shift (CLS)

Kümülatif Düzen Kayması anlamına gelen Cumulative Layout Shift, web sayfaları yüklendiği sırada resim, video ve buton gibi görsel ve tıklanabilir ögelerin hareket etmesidir. Bu hareketlilikler titreme, kayma veya değişme şeklinde olabilmekte ve kullanıcı deneyimini olumsuz etkilemektedir. Ziyaretçi memnuniyeti sağlamak ve kullanıcı deneyimini üst düzeye çıkarmak için CLS skorunun 0.1 veya altında olması gerekmektedir.

Düzen kaymalarını engelleyerek CLS skorunu yükseltmek için kodlama esnasında fotoğraf ve video gibi görsellerin en ve boy ölçüleri piksel cinsinden tanımlanmalıdır. Eğer web sitelerinde sıklıkla kullanılan fontlardan farklı bir yazı stili seçilmişse, içeriğin yüklenmesi zaman alabilir ve düzen kaymaları yaşanabilir. Kaymanın önüne geçmek için “swap” özelliği kullanılarak, istenilen yazı karakteri yüklenene kadar geçici bir font ile yazıların ön gösterimi sağlanmalıdır.

First Contentful Paint (FCP) Nedir?

First Contentful Paint kavramı, dilimize İlk Boyama Zamanı veya İlk Zengin İçerikli Boyama olarak çevrilmektedir. Kısaltması FCP olan İlk Boyama Zamanı, bir web sayfasının ziyaret edilip yüklenme başladığı andan, web sitesinin ilk elemanının ziyaretçiye gösterildiği ana kadar geçen süreyi ifade eden bir parametredir.

FCP, içeriğin yükleneceği alanları renkli boyalamalarla doldurarak kullanıcıya içeriğin yüklenmeye devam ettiği ile ilgili sinyaller vermektedir. Web sayfasının tümü anında yüklenmese de içeriğin bir kısmının yüklenmekte olduğuna dair verilen işaretler, kullanıcının dikkatini çekerek sayfayı terk etmemesini sağlamak açısından önemlidir. 

Örneğin web sitesinin logosu gibi birkaç görsel içeriğin ilk sırada yüklenmesi, ziyaretçinin yalnızca beyaz ekranla karşılaşmasına kıyasla daha yerinde olacaktır ve web sitesinden hemen çıkış yapılmasını büyük oranda engelleyecektir. İdeal kabul edilen FCP süresi 2 saniyenin altındadır.

Interaction to Next Paint (INP) Nedir?

Sonraki Boyayla Etkileşim anlamına gelen Interaction to Next Paint, sayfanın tamamıyla etkileşim kurmanın ne kadar zaman aldığını hesaplayan bir metriktir. Etkileşime örnek olarak bir web sayfasında fare ile etkileşimli bir tuşa tıklamak veya klavyedeki bir tuşa basmak verilebilir. Genel Etkileşim Gecikmesi olarak da bilinen INP, bir kullanıcı sayfayı ziyaret ettiğinde oluşan etkileşimlerden, süresi en uzun olanlarından birini seçerek, sayfanın genel etkileşim gecikmesini temsil eder.

INP, etkileşim sayısı 50’den az olan küçük ve orta çaplı web siteleri için hesaplama yaparken direkt olarak en kötü gecikmeyi baz alır. Çok sayıda etkileşime sahip olan sayfalar içinse INP genellikle 98. yüzdelik dilimidir. Bir web sayfasının iyi bir INP değerine sahip olması, sayfanın genel yanıt verme hızının yüksek olması açısından büyük önem taşır. İyi bir INP skoru, 200 ms ve altında yer almaktadır. INP skoru 500 ms’yi aşan web sayfalarında yanıt verme yeteneği zayıf kabul edilir.

Time to First Byte (TTFB) Nedir?

Türkçeye İlk Bayt Süresi olarak çevrilen TTFB, sunucunun istemciden gelen bir kaynak isteğini ne kadar hızlı yanıtlayabildiğini ölçmeye yarar. TTFB ile bir web sunucusuna gönderilen HTTP isteği ile ilk veri baytının istemciye döndüğü süre tespit edilebilmektedir. TTFB metriği sunucunun siteye gelen trafiği karşılamadaki yeterliliğinin ölçülmesi noktasında büyük öneme sahiptir.

İstemciden alınan isteğin yanıtlanmasında Google tarafından ideal kabul edilen süre 200 ms ve altındaki değerlerdir. Sürenin bu değer aralıklarında yer alması, Google botları tarafından taranma sıklığını iyileştirmekte, web sitesinin sonuçlar sayfasındaki konumunu yükseltmesine yardımcı olabilmektedir. TTFB skorunu etkileyen faktörlerden bazıları web sitesinde trafiğin fazla olması, veri tabanlarının optimize edilmemesi, sunucu ve hostingin paylaşımlı olarak kullanılması şeklinde sıralanabilir.

Core Web Vitals Değerleri Nasıl Geliştirilir?

Core Web Vitals değerlerini geliştirmek için öncelikle web sayfasının eksiklikleri tespit edilmelidir. Sonrasında kullanıcılara daha iyi bir deneyim yaşatabilmek için elde edilen skor değerleri düşürülmeye çalışılmalıdır. Core Web Vitals metrikleri açısından yapılabilecek geliştirmeler şunlardır:

• Sunucular optimize edilmelidir. Gerekirse veri tabanı değiştirilmelidir.
• Gereksiz ve işe yaramayan kod miktarı azaltılmalıdır.
• Sayfanın hızlı yüklenebilmesi için multimedya ögeleri iyi şekilde kaydedilmeli, gömülmeli ve büyükse sıkıştırılmalıdır.
• Önbellek kullanılmalıdır.

Infinite Scroll ve Pagination hakkında bilgi sahibi olmak için “Infinite Scroll vs Pagination” adlı içeriğimi inceleyebilirsiniz.

Core Web Vitals Hakkında Merak Edilenler