Site hızı neden önemlidir?
Site hızı önemlidir, çünkü ziyaretçi yavaş açılan bir sayfayı beklemek yerine çoğu zaman geri dönüp başka bir siteye gider. Özellikle telefonda, mobil veriyle alışveriş yapan bir müşteri için her gecikme sepeti terk etmek için bir neden olabilir.
Google da sayfa deneyimini değerlendirirken hızı ve kararlılığı ölçen Core Web Vitals değerlerini kullanır. Hız tek başına sıralamayı belirlemez, ama aynı kalitede içeriğe sahip iki sayfadan daha iyi deneyim sunanın öne çıkmasına yardım eder. Google Ads'te ise açılış sayfası deneyimi reklamın kalitesini etkileyen unsurlardan biridir.
Yapay zeka asistanları ve arama motorlarının tarayıcıları da hızlı, temiz yapılı sayfaları daha kolay okur. Binlerce ürünlü bir mağazada sayfaların hızlı açılması, tarayıcıların daha fazla ürünü düzenli olarak ziyaret edebilmesi demektir.
Core Web Vitals nedir: LCP, INP ve CLS ne anlama gelir?
Core Web Vitals, Google'ın bir sayfanın gerçek kullanıcılar için ne kadar hızlı, tepkili ve kararlı olduğunu ölçtüğü üç temel değerdir. Bu değerler, Chrome kullanan gerçek ziyaretçilerden toplanan saha verisine (field data) dayanır.
Üçünü günlük dille şöyle açıklayabiliriz:
Bu üç değer birlikte değerlendirilir; biri iyi, diğeri kötüyse sayfa deneyimi yine zayıf görünür. Search Console, sitendeki sayfaları bu değerlere göre “iyi”, “iyileştirilmesi gerekiyor” ve “kötü” olarak gruplar. Biz de çalışmaya en çok ziyaret alan ve satışa en yakın sayfa gruplarından başlarız.
Mobil ve masaüstü değerleri ayrı ölçülür. Müşterilerin önemli bir kısmı siteye telefondan geldiği için önceliği her zaman mobil deneyime veririz.
- LCP (Largest Contentful Paint): Sayfadaki en büyük öğenin, genellikle ana görselin ya da başlığın ne kadar sürede göründüğü
- INP (Interaction to Next Paint): Bir düğmeye bastığında ya da menü açtığında sayfanın ne kadar çabuk tepki verdiği
- CLS (Cumulative Layout Shift): Sayfa yüklenirken öğelerin yerinden kayıp kaymadığı; örneğin tam tıklayacakken düğmenin aşağı kaçması
| Belirti | Olası neden | Çözüm |
|---|---|---|
| Ana görsel geç görünüyor (LCP yüksek) | Büyük, sıkıştırılmamış görsel; yavaş sunucu | WebP/AVIF, doğru boyut, önbellek ve CDN |
| Tıklamalar geç tepki veriyor (INP yüksek) | Ağır JavaScript, çok sayıda harici betik | Gereksiz betikleri kaldırma ve erteleme |
| Sayfa yüklenirken içerik kayıyor (CLS yüksek) | Boyutu belirtilmemiş görseller, geç yüklenen bantlar | Görsel ölçülerini sabitleme, alan ayırma |
| Kategori ve arama sayfaları yavaş | Çok ürün ve varyasyon, ağır sorgular | Nesne önbelleği, sorgu iyileştirme, filtre düzeni |
| Yönetim paneli ağır açılıyor | Şişmiş veritabanı, fazla eklenti | Veritabanı temizliği ve eklenti denetimi |
WordPress ve WooCommerce siteleri neden yavaşlar?
WordPress ve WooCommerce sitelerinin yavaşlamasının en sık nedenleri sıkıştırılmamış büyük görseller, fazla ve ağır eklentiler, önbellek eksikliği ve yetersiz barındırmadır. Çoğu zaman tek bir büyük sorun değil, zamanla biriken birçok küçük sorun vardır.
Ağır sayfa oluşturucular (page builder), her sayfada yüklenen ama kullanılmayan kod dosyaları, sayfayı bekleten harici betikler (sohbet araçları, takip kodları, sosyal medya bileşenleri) ve yıllar içinde şişmiş bir veritabanı da sık karşılaştığımız nedenlerdir. WooCommerce'te çok sayıda ürün ve varyasyonu olan mağazalarda kategori ve arama sayfaları ayrıca yük getirir.
Sunucu tarafında eski bir PHP sürümü, nesne önbelleğinin (object cache) olmaması ya da paylaşımlı bir hostingin kaynak yetersizliği, kod ne kadar iyi olursa olsun siteyi yavaşlatabilir. Bu yüzden ölçümü yalnızca tarayıcıda değil, sunucu yanıt süresi tarafında da yaparız.
Site hızı optimizasyonunda neler yapıyoruz?
Hız optimizasyonunda önce ölçer, sonra en çok etki eden sorundan başlayarak düzeltiriz; rastgele bir hız eklentisi kurup bırakmayız. Her adımdan sonra yeniden ölçer, iyileşmeyi seninle paylaşırız.
Sitenin durumuna göre yaptığımız başlıca işler:
Kuyumcu, mobilya ya da doğal taş mağazaları gibi görselin satışta belirleyici olduğu sektörlerde görsel kalitesinden ödün vermeden boyutu küçültmek ayrı bir özen ister. Ürün fotoğraflarını sıkıştırırken taşın rengini, kumaşın dokusunu ya da metalin parlaklığını korumaya dikkat ederiz.
- Görselleri WebP veya AVIF biçimine çevirme, doğru boyutlandırma ve geç yükleme (lazy load)
- Sayfa önbelleği ve nesne önbelleği (ör. Redis) kurulumu
- Cloudflare gibi bir CDN ile içeriğin ziyaretçiye yakın sunuculardan dağıtılması
- Kullanılmayan eklentilerin kaldırılması, ağır olanların hafif alternatifleriyle değiştirilmesi
- CSS ve JavaScript dosyalarının küçültülmesi, gereksiz yüklenenlerin ertelenmesi
- Veritabanı temizliği ve WooCommerce sorgularının iyileştirilmesi
- Güncel PHP sürümü ve gerekirse daha uygun bir barındırmaya taşıma
Site hızı nasıl ölçülür?
Site hızı, Google PageSpeed Insights, Search Console'daki Core Web Vitals raporu ve tarayıcının geliştirici araçlarıyla ölçülür. Önemli olan tek bir puana takılmak değil, gerçek kullanıcıların deneyimini gösteren saha verisi ile test ortamındaki laboratuvar verisini (lab data) birlikte okumaktır.
PageSpeed puanı her testte biraz değişebilir; bu normaldir. Biz bu yüzden aynı sayfaları aynı koşullarda birkaç kez ölçer, anasayfa, kategori, ürün ve ödeme sayfaları gibi satış için kritik sayfaları ayrı ayrı izleriz.
Çalışmanın başında mevcut durumu, sonunda yapılan değişiklikleri ve yeni ölçümleri içeren yazılı bir özet hazırlarız. Saha verisinin güncellenmesi zaman aldığı için Search Console'daki değişimi de sonraki haftalarda birlikte takip ederiz.
Ölçümleri farklı cihazlar ve bağlantı hızlarıyla da tekrarlarız. Yeni bir telefonda hızlı açılan bir sayfa, orta seviye bir cihazda ve zayıf bir mobil bağlantıda çok farklı davranabilir; müşterinin gerçekte nasıl bir deneyim yaşadığını görmek için bu fark önemlidir.
3D ürünler ve hareketli sayfalar siteyi yavaşlatır mı?
Doğru kurulduğunda hayır; 3D ürün vitrini, sanal deneme ve hareketli sahneler sayfanın ilk açılışını yavaşlatmayacak şekilde yüklenebilir. Bunun için ağır dosyaları yalnızca ihtiyaç duyulduğunda, örneğin müşteri deneme düğmesine bastığında ya da ilgili bölüme geldiğinde yükleriz.
“Parmağında gör” sanal deneme tarayıcıda çalışır ve müşteri düğmeye basana kadar sayfaya yük getirmez. Three.js ve GSAP ile hazırladığımız hareketli sitelerde de 3D modelleri sıkıştırır, mobil cihazlar için daha hafif sürümler hazırlar ve sayfa metninin animasyondan bağımsız olarak hemen görünmesini sağlarız.
Bu yaklaşım sayesinde müşteri gelişmiş deneyimi kullanmak istediğinde ona ulaşır, istemeyen ziyaretçi ise sade ve hızlı bir sayfa görür. Hem hız hem de etkileyici ürün sunumu aynı sayfada birlikte var olabilir.
Hız kalıcı olsun: güncelleme ve bakım
Hızlandırılmış bir site, yeni eklentiler, büyük görseller ve yeni takip kodları eklendikçe zamanla yeniden yavaşlayabilir. Bu yüzden hız çalışmasını bir defalık iş olarak değil, düzenli bakımın parçası olarak görürüz.
Bakım ve destek hizmetinde güncellemeleri önce kopyada dener, Core Web Vitals değerlerini düzenli olarak izler ve bir sorun belirdiğinde nedenini bulup düzeltiriz. İçerik ekleyen ekibine de görselleri doğru boyutta yüklemek gibi küçük ama etkili alışkanlıkları anlatırız.
Yeni bir eklenti ya da kampanya bandı eklemeden önce bize sorarsan, siteye etkisini önceden değerlendirip daha hafif bir yol önerebiliriz. Küçük bir alışkanlık gibi görünse de sitenin yıllar boyunca hızlı kalmasında en büyük farkı bu yaratır.