← Özelliklere Dön
Pro

Core Web Vitals

Core Web Vitals, Google'ın sıraladığı üç metriği (LCP, CLS ve INP) görüntülediğiniz sayfada canlı olarak ölçülür, Google'ın eşiklerine göre derecelendirilir ve her sayının arkasındaki kesin öğeye kadar takip edilir.

Core Web Vitals, sayfalarınızın sıralamasının bir kısmına karar verir, ancak bunları ölçmenin olağan yolları tuhaftır. Laboratuar araçları kimsenin deneyimlemediği sentetik bir yükü puanlar. Search Console, gerçek kullanıcıları dört hafta gecikmeli olarak URL grupları halinde gruplandırılmış olarak raporlar. İkisi de önünüzdeki sayfada hangi öğenin sorun olduğunu söylemez.

Bu araç, gerçekte baktığınız sayfayı siz onu kullanırken ölçer. LCP, CLS ve INP'nin her biri, Google'ın yayınlanan eşik değerlerine göre İyi, Çalışma Gerekiyor veya Kötü derecelendirmesi ile kendi değerini gösteren bir kutucuk ve nerede oturduğunuzu gösteren bir çubuk alır. FCP ve TTFB bağlam açısından yanlarında yer alır, çünkü yavaş bir sunucunun neden olduğu yavaş bir LCP, ağır bir görüntünün neden olduğu sorundan farklı bir sorundur.

Tanımlar, Chrome'un CrUX'a rapor ettiği bilgilerle eşleşir; bu, sayıları Search Console ile karşılaştırmayı düşünüyorsanız önemlidir. CLS, her vardiyayı safça bir araya getirmek yerine, oturum pencerelerini kullanır; bir pencere bir saniyelik bir boşluktan sonra veya beş saniyede sona erer ve en kötü pencere kazanır. INP, etkileşim gecikme sürelerinizin yüzde 98'lik dilimidir; normal bir ziyaret için bu, yalnızca en yavaş etkileşimdir. LCP, tıpkı Chrome'un yaptığı gibi, ilk etkileşiminizde değişmeyi durdurur.

En yararlısı, her sayının atfedilmesidir. Panel, en büyük boyama öğesini, kayan öğeleri ve en yavaş etkileşimleri adlandırır ve Göster düğmesi bunlardan herhangi birine kaydırarak sayfada ana hatlarını çizer. CLS'nin 0,31 olduğunu bilmek yerine içeriğinizi aşağı iten banner'ı görürsünüz. Kopya raporu size her şeyi bir bilet metni olarak verir.

Canlı Önizleme
example.com/products
Core Web Vitals Canlı ölçüm
LCPİyi
1.84 s
CLSFakir
0.312
INPÇalışmaya ihtiyaç var
248 ms
FCP 1.12 s
TTFB 410 ms
En büyük öğe
1.84 s section.hero > img.banner Göstermek
En büyük düzen değişiklikleri
0.241 div.promo-banner Göstermek
0.071 ul.product-grid > li:nth-of-type(3) Göstermek
Temel Özellikler

Canlı LCP, CLS ve INP

Siz sayfayı kullandıkça üç sıralama ölçümü güncellenir: kaydırma CLS'yi taşır, tıklama ve yazma INP'yi taşır. Her biri Google'ın eşik değerlerine göre İyi, Çalışılması Gerekiyor veya Kötü olarak derecelendirilmiştir.

Hangi Elementin Olduğunu Size Söyler

En büyük boya elemanını, kayan elemanları ve en yavaş etkileşimleri adlandırır. Bunlardan herhangi birine gitmek ve doğrudan sayfada ana hatlarını çizmek için Göster tuşuna basın.

Chrome'un Kendi Tanımları

CLS, 1 saniyelik boşluk ve 5 saniyelik sınıra sahip oturum pencereleri kullanır, INP, etkileşim gecikmelerinin 98. yüzdelik dilimidir ve LCP ilk etkileşimde donar; böylece sayılarınız Search Console ile aynı hizada olur.

Bağlam İçin FCP ve TTFB

İlk İçerikli Boya ve İlk Bayta Kadar Süre, büyük üçün yanında yer alır, böylece yanlış şeyi optimize etmeye başlamadan önce yavaş bir sunucuyu ağır bir kahraman görüntüsünden ayırt edebilirsiniz.

Etkileşim Dağılımı

Etkinlik türü ve ilgili öğeyle en yavaş etkileşimlerinizi listeler, böylece tahmin etmek yerine yavaş bir açılır menü veya filtre bulunabilir.

Kopyalanabilir Rapor

Tek tıklamayla her ölçüm, derecelendirme ve rahatsız edici seçici, bir bilete, çekme isteğine veya müşteri e-postasına yapıştırmaya hazır şekilde düz metin olarak kopyalanır.

Yaygın Kullanım Durumları

Bir sayfayı gönderilmeden önce kontrol etme

Bir ay sonra Search Console'dan öğrenmek yerine, LCP, CLS ve INP'nin yeni şablon yayına girmeden önce yeşil renkte olduğunu doğrulayın.

Search Console uyarısının peşine düşmek

Search Console size bir grup URL'nin CLS'de başarısız olduğunu söyler; bu araçla bunlardan birini açın ve kaydırmayı tam olarak hangi elemanın yaptığını görün.

Sıçrayan elementi bulmak

Sayfayı kaydırın ve CLS tırmanışını izleyin, ardından içeriğinizi taşıyan geç yüklenen reklamı, banner'ı veya web yazı tipini özetlemek için Göster'e basın.

Yavaş bir arayüzü teşhis etme

Hangi kontrolün yüzlerce milisaniyeye mal olduğunu bulmak için filtrelere, menülere ve modallara tıklayın, ardından en yavaş etkileşim listesini okuyun.

Bir optimizasyonun işe yaradığını kanıtlamak

Sayıları kaydedin, düzeltmeyi uygulayın, ardından aynı sayfayı yeniden ölçün ve iki raporu yan yana karşılaştırın.

Nasıl Kullanılır
1

Core Web Vitals'yi açın

DevSuite Pro dock'taki Core Web Vitals simgesine tıklayın. Metrik döşemeler, sayfanın önceden kaydettiği şeyleri kullanarak hemen görünür.

2

Temiz bir LCP için yeniden yükleyin

LCP yalnızca sayfa yüklemesinin başlangıcında anlamlıdır, bu nedenle güvenebileceğiniz bir okuma istediğinizde panel açıkken sayfayı yeniden yükleyin.

3

Sayfayı normal şekilde kullanın

CLS'yi uygulamak için tüm sayfayı kaydırın ve INP ölçümleri oluşturmak için tıklayın, dokunun ve yazın. Kutucuklar siz ilerledikçe güncellenir.

4

Suçluyu bulun

LCP öğesinin, düzen değiştirme kaynağının veya yavaş etkileşimin yanındaki Göster'e basın. Sayfa ona doğru kaydırılır ve ana hatlarıyla belirtilir, böylece hangi öğenin sorumlu olduğu konusunda belirsizlik kalmaz.

5

Raporu kopyala

Her ölçüm, derecelendirme ve seçicinin düz metin özeti için Raporu kopyala'yı tıklayın. CLS ve INP'yi yeniden sıfırdan başlatmak için Sıfırla'ya basın.

Denemeye Hazır mısınız?

DevSuite Pro'yu ücretsiz yükleyin ve tarayıcınız için 71'dan fazla geliştirici aracının kilidini açın.

Chrome'a Ekle Edge'e Ekle FireFox'a Ekle