Yayınlanma tarihi: 4 Mayıs 2020
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 Vitals, sitenizin sunduğu deneyimi ölçmenize yardımcı olabilir ve siteyi geliştirme fırsatlarını saptayabilir.
Genel Bakış
Web Vitals, 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 sağlamıştır. Bazı geliştiriciler bu araçları kullanma konusunda uzmandır. Diğerleri ise hem araç hem de metrik bolluğunun takip edilmesini zor buluyor.
Site sahiplerinin, kullanıcılarına sundukları deneyimin kalitesini anlamak için performans uzmanı olmaları gerekmemelidir. Web Vitals girişimi, durumu basitleştirmeyi ve sitelerin en önemli metriklere (Core Web Vitals) odaklanmasına yardımcı olmayı amaçlar.
Önemli Web Verileri
Önemli Web Verileri, Web Verileri'nin tüm web sayfaları için geçerli olan alt kümesidir. Tüm site sahipleri tarafından ölçülmesi gereken bu metrik, tüm Google araçlarında gösterilir. Core Web Vitals'in her biri kullanıcı deneyiminin farklı bir yönünü temsil eder, sahada ölçülebilirdir ve kritik bir kullanıcı odaklı sonucun gerçek dünyadaki deneyimini yansıtır.
Core Web Vitals'ı oluşturan metrikler zaman içinde gelişecektir. Mevcut grup, kullanıcı deneyiminin üç yönüne (yükleme, etkileşim ve görsel kararlılık) odaklanır ve aşağıdaki metrikleri (ve ilgili eşiklerini) içerir:
- Largest Contentful Paint (LCP): Yükleme performansını ölçer. İyi bir kullanıcı deneyimi sağlamak için LCP, sayfanın ilk kez yüklenmeye başlamasından sonraki 2,5 saniye içinde gerçekleşmelidir.
- Interaction to Next Paint (INP): Etkileşimi ölçer. İyi bir kullanıcı deneyimi sağlamak için sayfaların INP'si 200 milisaniye veya daha kısa olmalıdır.
- Cumulative Layout Shift (CLS): Görsel kararlılığı ölçer. İyi bir kullanıcı deneyimi sağlamak için sayfaların CLS'si 0, 1 veya daha az olmalıdır.
Kullanıcılarınızın çoğu için bu metrikler için önerilen hedefe ulaştığınızdan emin olmak amacıyla, mobil ve masaüstü cihazlar arasında segmentlere ayrılmış sayfa yüklemelerinin yüzde 75'lik dilimi iyi bir eşiktir.
Core Web Vitals'a uygunluğu değerlendiren araçlar, Core Web Vitals metriklerinin üçünün de 75. yüzdelik diliminde önerilen hedefleri karşılayan sayfaları geçer notuyla değerlendirmelidir.
Yaşam döngüsü
Core Web Vitals kanalındaki metrikler, deneysel, beklemede ve kararlı olmak üzere üç aşamadan oluşan bir yaşam döngüsü geçirir.
Her aşama, geliştiricilere her metrik hakkında nasıl düşünmeleri gerektiğini belirtmek için tasarlanmıştır:
- Deneysel metrikler, testlere ve topluluk geri bildirimlerine bağlı olarak hâlâ önemli değişiklikler geçiriyor olabilecek potansiyel Core Web Vitals'tir.
- Beklemede olan metrikler, test ve geri bildirim aşamasını geçmiş ve kararlı hale gelmek için net bir zaman çizelgesi olan gelecekteki Core Web Vitals'tir.
- Kararlı metrikler, Chrome'un mükemmel kullanıcı deneyimleri için gerekli bulduğu mevcut Core Web Vitals grubudur.
Core Web Vitals, yaşam döngüsünün şu aşamalarındadır:
Experimental
İlk kez geliştirilen ve ekosisteme giren metrikler deneme metriği olarak kabul edilir.
Deneme aşamasının amacı, önce çözülecek sorunu keşfederek ve muhtemelen önceki metriklerin ele alamamış olabileceği sorunları tekrarlayarak bir metriğin uygunluğunu değerlendirmektir. Örneğin, Interaction to Next Paint (INP) başlangıçta web'de bulunan ç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ı tespit ederek ve hatta ilk tanımında yapılan değişiklikleri keşfederek bir metriğin geliştirilmesinde esneklik sağlamak için de tasarlanmıştır. Bu aşamada topluluk geri bildirimleri de en önemli rolü oynar.
Beklemede
Chrome Ekibi, deneysel bir metriğin yeterli geri bildirim aldığını ve etkinliğini kanıtladığını belirlediğinde bu metrik beklemedeki metrik olur. Örneğin, INP 2023'te FID'nin kullanımdan kaldırılması amacıyla deneysel durumdan beklemede durumuna geçirildi.
Beklemedeki metrikler, ekosistemin 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 bildirimleri bu aşamanın önemli bir parçası olmaya devam ediyor.
Kararlı
Core Web Vitals için aday metrik kesinleştiğinde sabit bir metrik haline gelir. Bu durumda metrik, Core Web Vitals olabilir.
Kararlı metrikler etkin bir şekilde desteklenir ve hata düzeltmelerine ve tanım değişikliklerine tabi olabilir. Sabit Core Web Vitals metrikleri yılda bir defadan fazla değiştirilmez. Core Web Vitals'ta yapılan tüm değişiklikler, metriğin resmi dokümanlarında ve değişiklik günlüğünde açıkça belirtilir. Core Web Vitals da tüm değerlendirmelere dahil edilir.
Core Web Vitals'ı ölçmek ve bildirmek için kullanılan araçlar
Google, Core Web Vitals'ın tüm web deneyimleri için kritik olduğuna inanıyor. Bu nedenle, bu metrikleri tüm popüler araçlarında göstermeye kararlıdır. Aşağıdaki bölümlerde, Core Web Vitals'ı hangi araçların desteklediği ayrıntılı olarak açıklanmaktadır.
Core Web Vitals'ı ölçmek için alan araçları
Chrome Kullanıcı Deneyimi Raporu, her Core Web Vital için anonimleştirilmiş, gerçek kullanıcı ölçüm verilerini toplar. Bu veriler, site sahiplerinin sayfalarında analizleri manuel olarak enstrümante etmelerine gerek kalmadan performanslarını hızlı bir şekilde değerlendirmelerini sağlar ve Chrome DevTools, PageSpeed Insights ve Search Console'un Core Web Vitals raporu gibi araçları destekler.
| LCP | INP | CLS | |
| Chrome Kullanıcı Deneyimi Raporu | |||
| 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ı değerlendirmenin hızlı bir yolunu sunar ancak genellikle gerilemelerin doğru şekilde teşhis edilmesi, izlenmesi ve hızlı bir şekilde tepki verilmesi için gereken ayrıntılı sayfa görüntüleme başına telemetriyi sağlamaz. Bu nedenle, sitelerin kendi gerçek kullanıcı izlemelerini oluşturmaları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 Önemli Web Verileri'ni ölçmenin en kolay yolu, web-vitals JavaScript kitaplığını kullanmaktır. Bu kitaplık, temel web API'lerinin etrafında küçük, üretime hazır bir sarmalayıcıdır ve her metriği daha önce listelenen tüm Google araçları tarafından raporlanma şekliyle tam olarak eşleşecek şekilde ölçer.
web-vitals kitaplığıyla her bir metrik tek bir işlev çağrılmasıyla ölçülebilir. Kullanım ve API 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 sonra, bir sonraki adımda 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 toplayıp raporlamanız gerekir.
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 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 daha fazla bilgi 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ı
Core Web Vitals'ın tümü öncelikle saha metrikleri olsa da bunların çoğu laboratuvarda da ölçülebilir.
Laboratuvar ölçümü, özelliklerin performansını geliştirme aşamasındayken (kullanıcılara sunulmadan önce) test etmenin en iyi yoludur. Ayrıca, performanstaki gerilemelerin gerçekleşmeden önce tespit edilmesinin en iyi yoludur.
Core Web Vitals'ı laboratuvar ortamında ölçmek için aşağıdaki araçlardan yararlanabilirsiniz:
| LCP | INP | CLS | |
|---|---|---|---|
| Chrome Geliştirici Araçları | |||
| Lighthouse | (bunun yerine TBT kullanın) |
Laboratuvar ölçümü, mükemmel deneyimler sunmanın önemli bir parçası olsa da saha ölçümünün yerini almaz.
Bir sitenin performansı, kullanıcının cihaz özelliklerine, ağ koşullarına, cihazda çalışan diğer işlemlere ve sayfayla nasıl etkileşime geçtiğine bağlı olarak önemli ölçüde değişiklik gösterebilir. Aslında, Core Web Vitals metriklerinin her birinin puanı kullanıcı etkileşiminden etkilenebilir. Yalnızca saha ölçümü, tüm resmi doğru bir şekilde yakalayabilir.
Puanlarınızı iyileştirmeye yönelik öneriler
Aşağıdaki kılavuzlarda, sayfalarınızı Core Web Vitals'ın her biri için nasıl optimize edeceğinizle ilgili ö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ı makaleyi inceleyin.
Diğer Web Vitals metrikleri
Core Web Vitals, mükemmel bir kullanıcı deneyimini anlamak ve sunmak için önemli metrikler olsa da destekleyici başka metrikler de vardır.
Bu diğer metrikler, deneyimin daha büyük bir bölümünü yakalamanıza veya belirli bir sorunu teşhis etmenize yardımcı olmak için proxy olarak ya da üç Core Web Vitals için ek metrikler olarak kullanılabilir.
Örneğin, ilk bayta geçiş süresi (TTFB) ve ilk zengin içerikli boyama (FCP) metrikleri, yükleme deneyiminin önemli yönleridir ve LCP ile ilgili sorunları (sırasıyla yavaş sunucu yanıt süreleri veya oluşturma işlemini engelleyen kaynaklar) teşhis etmek için yararlıdır.
Benzer şekilde, Total Blocking Time (TBT) gibi bir laboratuvar metriği, INP'yi etkileyebilecek olası etkileşimli sorunları tespit edip teşhis etmede çok önemlidir. Ancak bu metrikler, saha ölçümüne uygun olmadığı ve kullanıcı odaklı bir sonuç yansıtmadığı için Core Web Vitals grubunun bir parçası değildir.
Web Verileri'nde yapılan değişiklikler
Web Vitals ve Core Web Vitals, geliştiricilerin web'de deneyim kalitesini ölçmek için kullanabileceği en iyi sinyalleri temsil eder. Ancak bu sinyaller mükemmel değildir ve gelecekte iyileştirmeler veya eklemeler yapılması beklenir.
Önemli Web Verileri tüm web sayfalarıyla alakalı olup alakalı Google araçlarında yer alır. Bu metriklerde yapılacak değişikliklerin geniş kapsamlı bir etkisi olacaktır. Bu nedenle, geliştiricilerin Core Web Vitals'ın tanımlarının ve eşiklerinin sabit olmasını, güncellemelerin önceden bildirilmesini ve tahmin edilebilir, yıllık bir ritimde olmasını beklemesi gerekir.
Diğer Web Vitals genellikle bağlama veya araca özeldir ve Core Web Vitals'tan daha deneysel olabilir. Bu nedenle, bunların tanımları ve eşikleri daha sık değişebilir.
Tüm Web Vitals değişiklikleri, herkese açık bu DEĞİŞİKLİK GÜNLÜĞÜ'nde açıkça belirtilir.