Web Vitals

Yayınlanma tarihi: 4 Mayıs 2020, Son güncelleme tarihi: 31 Ekim 2024

Kullanıcı deneyiminin kalitesini optimize etmek, internetteki tüm siteler için uzun vadeli başarının anahtarıdır. İster işletme sahibi ister pazarlamacı veya geliştirici olun, Web Verileri, sitenizin sunduğu deneyimi ölçmenize yardımcı olabilir ve siteyi geliştirme fırsatlarını saptayabilir.

Genel Bakış

Web Verileri, Google tarafından başlatılan bir girişimdir. Bu girişimin amacı, internette mükemmel bir kullanıcı deneyimi sunmak için gerekli olan kalite göstergeleri hakkında tek bir kılavuz sağlamaktır.

Google, yıllar içinde performansı ölçmek ve raporlamak için çeşitli araçlar sunmuştur. Bazı geliştiriciler bu araçları kullanma konusunda uzmanlaşırken bazıları da hem araçların hem de metriklerin çokluğu nedeniyle zorlanıyor.

Site sahiplerinin, kullanıcılarına sundukları deneyimin kalitesini anlamak için performans uzmanı olması gerekmez. Web Verileri girişimi, bu durumu basitleştirmeyi ve sitelerin en önemli metrikler olan Önemli Web Verileri'ne odaklanmasına yardımcı olmayı amaçlar.

Önemli Web Verileri

Core Web Vitals, tüm web sayfaları için geçerli olan, tüm site sahipleri tarafından ölçülmesi gereken ve tüm Google araçlarında gösterilecek olan Web Vitals'ın alt grubudur. Core Web Vitals'ın her biri, kullanıcı deneyiminin farklı bir yönünü temsil eder, sahada ölçülebilir ve kullanıcı odaklı kritik bir sonucun gerçek dünya deneyimini yansıtır.

Core Web Vitals'ı oluşturan metrikler zamanla gelişecektir. Mevcut grup; yükleme, etkileşim ve görsel kararlılık olmak üzere kullanıcı deneyiminin üç yönüne odaklanmakta olup aşağıdaki metrikleri (ve ilgili eşiklerini) içerir:

Largest Contentful Paint eşiği önerileri Interaction to Next Paint eşiği önerileri Cumulative Layout Shift eşiği önerileri
  • Largest Contentful Paint (LCP): Yükleme performansını ölçer. İyi bir kullanıcı deneyimi sağlamak için LCP, sayfa yüklenmeye başladıktan sonraki 2,5 saniye içinde gerçekleşmelidir.
  • Interaction to Next Paint (INP): Etkileşimliliği ölçer. İyi bir kullanıcı deneyimi sunmak için sayfaların INP değeri 200 milisaniye veya daha az olmalıdır.
  • Cumulative Layout Shift (CLS): Görsel kararlılığı ölçer. İyi bir kullanıcı deneyimi sunmak için sayfaların CLS değeri 0, 1 veya daha az olmalıdır.

Kullanıcılarınızın büyük çoğunluğu açısından bu metriklerde önerilen hedefe ulaştığınızdan emin olmak için mobil ve masaüstü cihazlarda bölümlendirilmiş sayfa yüklemelerinin 75. yüzdelik dilim eşiğini ölçebilirsiniz.

Core Web Vitals uygunluğunu değerlendiren araçlar, Core Web Vitals metriklerinin üçü için de önerilen hedefleri 75. yüzdelik dilimde karşılayan sayfaları başarılı olarak değerlendirmelidir.

Yaşam döngüsü

Core Web Vitals izleme parkurundaki metrikler, deneysel, beklemede ve kararlı olmak üzere üç aşamadan oluşan bir yaşam döngüsünden geçer.

Core Web Vitals metriklerinin üç yaşam döngüsü aşaması, üç tane çift açılı ayraç şeklinde görselleştirilmiştir. Soldan sağa doğru aşamalar deneysel, beklemede ve kararlı olarak sıralanır.
Core Web Vitals yaşam döngüsünün aşamaları.

Her aşama, geliştiricilere her bir metrik hakkında nasıl düşünmeleri gerektiğini bildirmek için tasarlanmıştır:

  • Deneysel metrikler, testlere ve topluluk geri bildirimlerine bağlı olarak önemli değişiklikler geçirmeye devam edebilecek, gelecekteki Core Web Vitals metrikleridir.
  • Beklemedeki metrikler, test ve geri bildirim aşamasını geçen ve kararlı hale gelmek için iyi tanımlanmış bir zaman çizelgesine sahip olan gelecekteki Core Web Vitals metrikleridir.
  • Kararlı metrikler, Chrome'un mükemmel kullanıcı deneyimleri için gerekli gördüğü mevcut Core Web Vitals kümesidir.

Core Web Vitals aşağıdaki yaşam döngüsü aşamalarındadır:

  • LCP: Kararlı
  • CLS: Kararlı
  • INP: Mevcut ürün

Deneysel

Bir metrik ilk geliştirildiğinde ve ekosisteme girdiğinde deneysel metrik olarak kabul edilir.

Deneysel aşamanın amacı, önce çözülecek sorunu inceleyerek ve muhtemelen önceki metriklerin ele almadığı noktaları yineleyerek bir metriğin uygunluğunu değerlendirmektir. Örneğin, Interaction to Next Paint (INP), başlangıçta web'deki çalışma zamanı performans sorunlarını First Input Delay (FID)'den daha kapsamlı bir şekilde ele almak için deneysel bir metrik olarak geliştirildi.

Core Web Vitals yaşam döngüsünün deneysel aşaması, hataları belirleyerek ve hatta ilk tanımında değişiklikler yaparak bir metriğin geliştirilmesinde esneklik sağlamayı da amaçlar. Ayrıca bu aşamada topluluk geri bildirimi en önemli unsurdur.

Beklemede

Chrome Ekibi, deneysel bir metriğin yeterli geri bildirim aldığını ve etkinliğini kanıtladığını belirlediğinde bu metrik beklemede olan metrik haline gelir. Örneğin, INP, 2023'te deneysel durumdan beklemede olan duruma yükseltildi ve nihayetinde FID'nin kullanımdan kaldırılması amaçlandı.

Beklemedeki metrikler, ekosisteme uyum sağlaması için en az altı ay boyunca bu aşamada tutulur. Daha fazla geliştirici metriği kullanmaya başladıkça topluluk geri bildirimi bu aşamanın önemli bir parçası olmaya devam edecek.

Kararlı

Core Web Vitals adayı bir metrik nihai hale getirildiğinde sabit metrik olur. Bu aşamada metrik, Core Web Vital olabilir.

Sabit metrikler aktif olarak desteklenir ve hata düzeltmelerine ve tanım değişikliklerine tabi olabilir. Sabit Core Web Vitals metrikleri yılda bir kereden fazla değişmez. Core Web Vitals'da yapılan tüm değişiklikler, metriğin resmi belgelerinde ve değişiklik günlüğünde açıkça belirtilir. Core Web Vitals, tüm değerlendirmelere de dahil edilir.

Core Web Vitals'ı ölçme ve raporlama araçları

Google, Core Web Vitals'ın tüm web deneyimleri için kritik öneme sahip olduğuna inanmaktadır. Bu nedenle, bu metrikleri tüm popüler araçlarında göstermeyi taahhüt eder. Aşağıdaki bölümlerde, hangi araçların Core Web Vitals'ı desteklediği ayrıntılı olarak açıklanmaktadır.

Core Web Vitals'ı ölçmek için kullanılan alan araçları

Chrome Kullanıcı Deneyimi Raporu, her bir Core Web Vitals için anonimleştirilmiş, gerçek kullanıcı ölçümü verilerini toplar. Bu veriler, site sahiplerinin sayfalarında analizi manuel olarak uygulamalarına gerek kalmadan performanslarını hızlı bir şekilde değerlendirmelerini sağlar ve Chrome Geliştirici Araçları, PageSpeed Insights ve Search Console'un Core Web Vitals raporu gibi araçlara güç verir.

  LCP INP CLS
Chrome User Experience Report
Chrome Geliştirici Araçları
PageSpeed Insights
Search Console (Core Web Vitals raporu)

Chrome Kullanıcı Deneyimi Raporu'nun sağladığı veriler, sitelerin performansını hızlı bir şekilde değerlendirmenin bir yolunu sunar ancak regresyonları doğru bir şekilde teşhis etmek, izlemek ve bunlara hızlı bir şekilde tepki vermek için genellikle gerekli olan ayrıntılı, sayfa görüntüleme başına telemetriyi sağlamaz. Bu nedenle, sitelerin kendi gerçek kullanıcı izleme sistemlerini kurmalarını önemle tavsiye ederiz.

JavaScript'te Core Web Vitals'ı ölçme

Core Web Vitals'ın her biri, standart web API'leri kullanılarak JavaScript'te ölçülebilir.

Tüm Core Web Vitals'ı ölçmenin en kolay yolu, web-vitals JavaScript kitaplığını kullanmaktır. Bu kitaplık, temel web API'leri etrafında küçük ve üretime hazır bir sarmalayıcıdır. Her metriği, daha önce listelenen tüm Google araçları tarafından nasıl raporlandığıyla tam olarak eşleşecek şekilde ölçer.

web-vitals kitaplığıyla her metriği ölçmek için tek bir işlev çağrılabilir. Kullanım ve API ile ilgili tüm ayrıntılar için dokümanlara bakın.

import {onCLS, onINP, onLCP} from 'web-vitals';

function sendToAnalytics(metric) {
  const body = JSON.stringify(metric);
  // Use `navigator.sendBeacon()` if available, falling back to `fetch()`.
  (navigator.sendBeacon && navigator.sendBeacon('/analytics', body)) ||
    fetch('/analytics', {body, method: 'POST', keepalive: true});
}

onCLS(sendToAnalytics);
onINP(sendToAnalytics);
onLCP(sendToAnalytics);

Sitenizi, Core Web Vitals verilerinizi ölçmek ve bir analiz uç noktasına göndermek için web-vitals kitaplığını kullanacak şekilde yapılandırdıktan sonraki adım, sayfalarınızın sayfa ziyaretlerinin en az% 75'i için önerilen eşikleri karşılayıp karşılamadığını görmek üzere bu verileri toplamak ve raporlamaktır.

Bazı analiz sağlayıcılar, Core Web Vitals metrikleri için yerleşik destek sunsa da bu desteği sunmayanlar bile araçlarında Core Web Vitals'ı ölçmenize olanak tanıyan temel özel metrik özelliklerini içermelidir.

Bu metrikleri doğrudan temel web API'lerini kullanarak ölçmeyi tercih eden geliştiriciler, uygulama ayrıntıları için bunun yerine aşağıdaki metrik kılavuzlarını kullanabilir:

Popüler analiz hizmetlerini veya kendi şirket içi analiz araçlarınızı kullanarak bu metrikleri ölçmeyle ilgili ek rehberlik için Web Verileri'ni sahada ölçmeyle ilgili en iyi uygulamalar başlıklı makaleyi inceleyin.

Core Web Vitals'ı ölçmek için laboratuvar araçları

Tüm Core Web Vitals metrikleri öncelikle alan metrikleri olsa da birçoğu laboratuvarda da ölçülebilir.

Laboratuvar ölçümü, geliştirme aşamasındaki özelliklerin performansını test etmenin en iyi yoludur. Bu özellikler, kullanıcılara sunulmadan önce performans gerilemelerini yakalamanın da en iyi yoludur.

Laboratuvar ortamında Core Web Vitals'ı ölçmek için aşağıdaki araçlar kullanılabilir:

  LCP INP CLS
Chrome Geliştirici Araçları
Lighthouse (bunun yerine TBT'yi kullanın)

Laboratuvar ölçümü, harika deneyimler sunmanın önemli bir parçası olsa da saha ölçümünün yerini tutmaz.

Bir sitenin performansı, kullanıcının cihazının özelliklerine, ağ koşullarına, cihazda çalışan diğer işlemlere ve sayfayla nasıl etkileşimde bulunduğuna bağlı olarak önemli ölçüde değişebilir. Aslında, Core Web Vitals metriklerinin her birinin puanı kullanıcı etkileşiminden etkilenebilir. Yalnızca saha ölçümü, eksiksiz bir resim oluşturabilir.

Puanlarınızı artırmaya yönelik öneriler

Aşağıdaki kılavuzlarda, sayfalarınızı her bir Core Web Vitals için nasıl optimize edeceğinize dair özel öneriler sunulmaktadır:

Core Web Vitals'ı iyileştirmenin birçok yolu vardır ve her yaklaşım, her durum için farklı düzeylerde etki, alaka düzeyi ve kullanım kolaylığı sunar. Chrome Ekibi'nin en önemli önerilerinin kısa bir listesi için Core Web Vitals'ı iyileştirmenin en etkili yolları başlıklı makaleye bakın.

Diğer Web Verileri

Core Web Vitals, mükemmel bir kullanıcı deneyimini anlamak ve sunmak için kritik metrikler olsa da destekleyici başka metrikler de vardır.

Bu diğer metrikler, deneyimin daha büyük bir bölümünü yakalamaya veya belirli bir sorunu teşhis etmeye yardımcı olmak için üç Core Web Vitals metriği yerine veya bu metrikleri destekleyici olarak kullanılabilir.

Örneğin, Time to First Byte (TTFB) ve First Contentful Paint (FCP) metrikleri, yükleme deneyiminin önemli yönleridir ve LCP ile ilgili sorunları (sırasıyla yavaş sunucu yanıt süreleri veya oluşturmayı engelleyen kaynaklar) teşhis etmek için kullanışlıdır.

Benzer şekilde, Total Blocking Time (TBT) gibi bir metrik, laboratuvar metrikleri arasında yer alır ve INP'yi etkileyebilecek olası etkileşim sorunlarını yakalamak ve teşhis etmek için hayati önem taşır. Ancak bu metrikler, sahada ölçülebilir olmadıkları ve kullanıcı odaklı bir sonucu yansıtmadıkları için Core Web Vitals kümesinin bir parçası değildir.

Web Verileri'nde yapılan değişiklikler

Web Vitals ve Core Web Vitals, geliştiricilerin web'deki deneyimin kalitesini ölçmek için kullanabileceği en iyi sinyalleri temsil eder. Ancak bu sinyaller mükemmel değildir ve gelecekte iyileştirme veya eklemeler yapılması beklenir.

Core Web Vitals, tüm web sayfaları için geçerlidir ve ilgili Google araçlarında yer alır. Bu metriklerdeki değişiklikler geniş kapsamlı bir etkiye sahip olacaktır. Bu nedenle, geliştiriciler Core Web Vitals'ın tanımlarının ve eşiklerinin sabit olmasını, güncellemelerin ise önceden bildirilmesini ve yıllık olarak düzenli bir şekilde yapılmasını beklemelidir.

Diğer Web Vitals genellikle bağlama veya araca özgüdür ve Core Web Vitals'a kıyasla daha deneysel olabilir. Bu nedenle, tanımları ve eşikleri daha sık değişebilir.

Tüm Web Vitals ile ilgili değişiklikler bu herkese açık CHANGELOG açıkça belgelenir.