Küçük İşletme Web Siteleri için Core Web Vitals: LCP, INP ve CLS İçin Sade Bir Rehber

Google artık gerçek kullanıcı deneyimini bir sıralama faktörü olarak kullanıyor ve küçük işletme web siteleri için bu, Core Web Vitals'ın her zamankinden daha önemli olduğu anlamına geliyor. Siteniz yavaş veya zıplıyorsa, ziyaretçi ve sıralama kaybediyorsunuz. İyi haber: En büyük sorunları düzeltmek için geliştirici olmanıza gerek yok.

Core Web Vitals Aslında Nedir?

Core Web Vitals, Google'ın kullanıcıların sayfalarınızı nasıl deneyimlediğini puanlamak için kullandığı üç özel ölçümdür. Bunları web sitenizin hızı, tepkiselliği ve görsel kararlılığı için bir sağlık kontrolü olarak düşünün.

• LCP (Largest Contentful Paint) – Ana içeriğin (genellikle bir hero görseli veya başlık) görünmesi ne kadar sürer. 2,5 saniyenin altını hedefleyin.
• INP (Interaction to Next Paint) – Birisi tıkladığında veya dokunduğunda sayfanız ne kadar hızlı yanıt verir. 200 milisaniyenin altını hedefleyin.
• CLS (Cumulative Layout Shift) – Sayfanız yüklenirken ne kadar zıplar. 0,1'den az olmasını hedefleyin.

Bunlardan herhangi biri kırmızıdaysa, Google bunu fark eder—ziyaretçileriniz de öyle.

Kendi Puanlarınızı Nasıl Kontrol Edersiniz (Kod Gerekmez)

Tam olarak nerede durduğunuzu size söyleyen iki ücretsiz aracınız var.

PageSpeed Insights – pagespeed.web.dev adresine gidin, URL'nizi girin ve Analyze'e basın. Mobil ve masaüstü için bir puan, ayrıca belirli fırsatların bir listesini alırsınız. "Diagnose performance issues" bölümü yapılacaklar listenizdir.

Google Search Console – Sitenizi doğruladıysanız, "Experience" > "Core Web Vitals" altına bakın. Bu, gerçek ziyaretçilerden gelen gerçek dünya verilerini URL'ye göre gruplandırılmış olarak gösterir. Hangi sayfaların "Poor," "Need improvement" veya "Good" olduğunu söyler.

İkisini de çalıştırın. PageSpeed Insights size laboratuvar verileri ve düzeltmeler verir; Search Console ise gerçek kullanıcıların sitenizi zaman içinde nasıl deneyimlediğini gösterir.

Fark Yaratan Önceliklendirilmiş Kodsuz Düzeltmeler

Tek bir kod satırına dokunmanıza gerek yok. Bu üç düzeltmeyle sırayla başlayın.

1. Hero Görsellerini Sıkıştırın ve Yeniden Boyutlandırın

LCP'niz neredeyse her zaman bir görseldir. 4MB'lık bir hero fotoğrafı bir numaralı katildir.

• Görselleri tam olarak görüntülendikleri boyutlara yeniden boyutlandırın (genellikle 1600px'den geniş olmamalı).
• Squoosh veya TinyPNG gibi ücretsiz araçlarla sıkıştırın—200KB'nin altını hedefleyin.
• Platformunuz destekliyorsa WebP formatını kullanın.

webceke kullanıyorsanız, görseller otomatik olarak optimize edilir ve modern formatlarda sunulur, yani bu sizin için halledilir.

2. Render Engelleyen Slider'ları ve Ağır Fontları Kaldırın

Slider'lar ve carousel'ler, başka bir şey görünmeden önce birden fazla büyük görsel ve JavaScript yükler. LCP'yi geciktirir ve INP'yi bozar. Bunları tek bir statik hero görseli veya basit bir grid ile değiştirin.

Ağır fontlar başka bir suçludur. Her font dosyası ayrı bir indirmedir. Kendinizi bir veya iki font ailesiyle sınırlayın ve mümkün olduğunda sistem fontlarını kullanın. Özel fontlar kullanmanız gerekiyorsa, yalnızca gerçekten ihtiyacınız olan ağırlıkları yükleyin.

3. Reklamlar ve Embed'ler İçin Yer Ayırın

CLS, içerik sabit bir boyut olmadan yüklendiğinde ortaya çıkar. Reklamlar, YouTube embed'leri ve sosyal medya gönderileri yaygın suçlulardır.

• Görsellere ve iframe'lere her zaman açık genişlik ve yükseklik öznitelikleri ayarlayın.
• Reklamlar için, reklam yüklenmeden önce düzeninizde sabit boyutlu bir kapsayıcı ayırın.
• Mevcut içeriğin üzerine banner veya pop-up enjekte etmekten kaçının.

Bu, sayfanın zıplamasını durdurur ve CLS puanınızı düşük tutar.

Öncesi ve Sonrası: Gerçek Bir Örnek

Yerel bir fırının 5,8 saniyelik LCP'si, 340ms INP'si ve 0,32 CLS'si vardı. Hero görselini sıkıştırdıktan, bir slider'ı kaldırdıktan ve bir Instagram embed'i için yer ayırdıktan sonra puanlar 1,9s LCP, 120ms INP ve 0,04 CLS'ye düştü.

Sonuçlar hızın ötesine geçti:

• Organik trafik üç ayda %42 arttı.
• Hemen çıkma oranı %68'den %41'e düştü.
• Online siparişler %27 arttı.

Daha iyi Core Web Vitals, daha fazla insanın kalması, keşfetmesi ve satın alması anlamına geldi.

Sonraki Adımınız

Küçük işletme web siteleri için Core Web Vitals sadece teknik bir onay kutusu değil—kaç müşterinin sizi bulup güvendiğini doğrudan etkiler. Puanlarınızı bugün PageSpeed Insights ve Search Console ile kontrol edin, ardından yukarıdaki üç düzeltmeyi ele alın.

Manuel işi atlamayı tercih ederseniz, webceke görselleri, fontları ve düzen kararlılığını otomatik olarak optimize eden hızlı, mobil uyumlu siteler oluşturur. webceke'yi ücretsiz deneyin ve ilk günden yeşil puan alan bir siteye sahip olun.