Web Tasarım

Web Sitesi Hızı Neden Bu Kadar Önemli? Core Web Vitals Rehberi

Web Sitesi Hızı Neden Bu Kadar Önemli? Core Web Vitals Rehberi

Yavaş bir site hem ziyaretçi hem de Google nezdinde kaybettirir. Kullanıcı tarafında etki serttir: yükleme süresi 1 saniyeden 3 saniyeye çıktığında hemen çıkma oranı yaklaşık üçte bir artar. Google tarafında ise hız, Core Web Vitals metrikleri üzerinden doğrudan bir sıralama sinyalidir.

Bu yazıda üç temel metriği, neyi ölçtüklerini ve nasıl iyileştirileceğini anlatıyoruz.

LCP — En büyük içerikli boyama

LCP, ekranda görünen en büyük öğenin yüklenme süresini ölçer. Bu genellikle hero görseli veya ana başlıktır. Hedef: 2,5 saniyenin altı.

LCP'yi bozan en yaygın sebep optimize edilmemiş görsellerdir. Çözümler sırayla: görselleri WebP formatına çevirin (JPEG'e göre yaklaşık %30 daha küçük), gerçek gösterim boyutunda sunun (1920 piksel genişliğinde bir görseli 600 piksellik alanda göstermeyin), ekranın üstündeki görsele fetchpriority="high" verin ve lazy loading uygulamayın — hero görselini geciktirmek LCP'yi doğrudan kötüleştirir.

İkinci sebep, render'ı bloklayan kaynaklardır. Harici CSS ve font dosyaları yüklenene kadar tarayıcı hiçbir şey çizemez. Fontları display=swap ile yükleyin, kritik olmayan CSS'i ertelemeli hâle getirin.

INP — Etkileşimden boyamaya

INP, kullanıcının bir düğmeye tıkladıktan sonra ekranda tepki görene kadar geçen süreyi ölçer. 2024'te FID metriğinin yerini aldı ve daha gerçekçi bir gösterge sunuyor. Hedef: 200 milisaniyenin altı.

INP'yi bozan şey ağır JavaScript'tir. Tarayıcı uzun süren bir script çalıştırırken kullanıcı etkileşimlerine yanıt veremez, sayfa "donmuş" hissi verir.

Çözüm: kullanılmayan JavaScript'i kaldırın. Çoğu sitede yıllar içinde biriken ve kimsenin kaldırmaya cesaret edemediği analitik, chat, popup ve pazarlama scriptleri toplam JS yükünün yarısından fazlasını oluşturur. Hangi scriptin gerçekten iş yaptığını sorgulayın.

Kalan scriptleri defer ile yükleyin ve üçüncü taraf scriptlerini mümkünse kullanıcı etkileşiminden sonra başlatın.

CLS — Kümülatif düzen kayması

CLS, sayfa yüklenirken içeriğin ne kadar zıpladığını ölçer. Okumaya başladığınız metnin aniden aşağı kayması veya tıklamak üzereyken düğmenin yer değiştirmesi bu metriğe girer. Hedef: 0,1'in altı.

En yaygın sebep, boyutu belirtilmemiş görsellerdir. Her <img> etiketine width ve height öznitelikleri ekleyin; tarayıcı yer ayırabilsin. Aynı şey iframe ve reklam alanları için de geçerlidir.

İkinci sebep, sonradan yüklenen fontlardır. Font değiştiğinde metin yeniden akar. font-display: swap ve yedek fontun benzer metriklere sahip olması bu etkiyi azaltır.

Üçüncüsü, mevcut içeriğin üstüne itilerek eklenen çerez bandı veya duyuru çubuklarıdır. Bunları sabit konumlandırın veya baştan yer ayırın.

Nasıl ölçülür

İki tür veri vardır ve ikisi de gereklidir.

Saha verisi gerçek kullanıcılardan toplanır. Google Search Console'daki "Önemli Web Verileri" raporu ve PageSpeed Insights'ın üst bölümü bu veriyi gösterir. Sıralamayı etkileyen budur.

Laboratuvar verisi kontrollü bir ortamda simüle edilir. PageSpeed Insights'ın alt bölümü ve Lighthouse bu veriyi üretir. Sorunu teşhis etmek için kullanışlıdır ama saha verisinden farklı çıkabilir.

Karar verirken saha verisine bakın, düzeltirken laboratuvar verisinin önerilerini uygulayın. Saha verisinin güncellenmesi 28 günlük pencere kullandığı için yaklaşık bir ay sürer — düzeltmeden hemen sonra sonuç beklemeyin.

Öncelik sırası

Sınırlı zamanınız varsa şu sırayla ilerleyin. Önce görselleri optimize edin; bu genellikle en büyük tek kazancı verir ve en az risk taşır. Sonra kullanılmayan JavaScript'i temizleyin. Ardından görsellere boyut öznitelikleri ekleyin. En son sunucu yanıt süresine bakın.

Sunucu tarafında GZIP sıkıştırma açık olmalı, statik dosyalar uzun süreli önbelleğe alınmalı ve mümkünse bir CDN kullanılmalıdır.

Hız bir kerelik iş değil

Site yayına girdiğinde hızlı olabilir ama zamanla yavaşlar: yeni eklentiler, yeni takip kodları, optimize edilmemiş yeni görseller. Bu yüzden hız ölçümünü rutine bağlayın.

Ayda bir PageSpeed testi çalıştırın ve sonucu kaydedin. Ani bir düşüş olduğunda son eklenen şeyi bulmak kolay olur. Düzenli bakım yapılan siteler yıllarca hızlı kalır; bakımsız siteler altı ayda yavaşlar.

Barındırma seçiminin etkisi

Görselleri ne kadar optimize ederseniz edin, sunucu yavaş yanıt veriyorsa tavana çarparsınız. Sunucunun ilk baytı gönderme süresi (TTFB) 600 milisaniyenin üzerindeyse sorun kodunuzda değil, barındırmadadır.

Paylaşımlı hosting paketlerinde yüzlerce site aynı kaynağı paylaşır; komşu sitelerden biri yoğunlaştığında sizin siteniz de yavaşlar. Ziyaretçi sayınız arttıysa veya e-ticaret yapıyorsanız daha güçlü bir pakete geçmek, aylar süren optimizasyon çalışmasından daha hızlı sonuç verebilir.

Sunucunuzun fiziksel konumu da önemlidir. Hedef kitleniz Türkiye'deyse Türkiye'de veya Avrupa'da barındırma, Amerika'daki bir sunucudan belirgin biçimde hızlıdır.

Mobilde ayrı ölçün

PageSpeed Insights masaüstü ve mobil için ayrı puan verir ve aradaki fark genellikle büyüktür. Google sıralamada mobil veriyi esas alır, dolayısıyla masaüstü puanınızın 95 olması bir şey ifade etmez.

Mobil puanın düşük olmasının sebebi genellikle işlemci gücüdür. Orta seviye bir telefon, masaüstü bilgisayarın çok altında JavaScript işler. Masaüstünde fark edilmeyen bir script, mobilde saniyeler kaybettirir.

Gerçek bir testi kendi telefonunuzla, mobil veri üzerinden yapın. Wi-Fi ve yeni model telefonla yapılan test gerçeği yansıtmaz.

Hızın iş sonuçlarına etkisi

Hız çalışmasını teknik bir konu olarak görmek, bütçe ayırmayı zorlaştırır. Oysa etkisi doğrudan gelirdir.

E-ticarette sayfa hızındaki iyileşme dönüşüm oranını yükseltir; aynı trafikle daha çok satış demektir. Hizmet sitelerinde form doldurma oranını artırır. Reklam veriyorsanız açılış sayfası deneyimi Google Ads kalite puanını etkiler ve kalite puanı yükseldiğinde tıklama başı maliyetiniz düşer — yani hız, doğrudan reklam bütçenizi de küçültür.

Bu üç etkiyi birlikte düşündüğünüzde, hız optimizasyonu genellikle en hızlı geri dönen teknik yatırımdır.

Sitenizin hız ve teknik sağlığını düzenli olarak takip edilmesini istiyorsanız web sitesi bakım ve teknik destek hizmetimizi inceleyebilirsiniz. Hızın SEO içindeki yerini SEO temelleri yazımızda daha geniş bir çerçevede ele aldık. Yeni bir site planlıyorsanız ücretsiz teklif alabilirsiniz.

#site hızı #core web vitals #performans
Bu yazıyı paylaş:
VANTA Studio
VANTA Studio

Markaları dijital geleceğe hazırlayan premium web tasarım ve yazılım ajansı. Kurumsal siteler, e-ticaret ve dijital pazarlama çözümleriyle işinizi büyütüyoruz.

vantastudio.com.tr

Yorumlar (0)

Henüz yorum yapılmamış. İlk yorumu sen yap!

Yorum Yap

Yorumunuz yönetici onayından sonra yayınlanır. E-posta adresiniz gösterilmez.

Bültenimize katılın

Web tasarım, SEO ve dijital pazarlama ipuçlarını doğrudan e-postanıza alın. Spam yok, istediğiniz an çıkabilirsiniz.

Hâlâ karar veremediniz mi?

Projenizi birlikte değerlendirelim ve size en uygun çözümü sunalım.

Ücretsiz Teklif Al