Web Sitesi Hızlandırma Teknikleri

Bir saniye. Araştırmalar, sayfa yüklenme süresi 1 saniyeden 3 saniyeye çıktığında ziyaretçi terk etme oranının yüzde 30'a yakın arttığını gösteriyor. Yani siteniz yavaşladıkça, kapının önüne kadar gelen müşteriler içeri girmeden dönüyor. İyi haber şu: web sitesi hızlandırma çoğu zaman sihir değil, bilinen birkaç tekniğin disiplinli uygulanmasıdır.

Önce ölçün, sonra müdahale edin

Hızı iyileştirmenin ilk kuralı, nereden başlayacağınızı bilmektir. Tahminle değil, veriyle hareket edin. Sitenizin mevcut yüklenme süresini ve sayfa boyutunu site hız testi aracıyla ölçerek başlayın. Sunucunun döndürdüğü yanıt başlıklarını ve önbellek ayarlarını ise HTTP header checker ile inceleyebilirsiniz. Elinizde net bir başlangıç noktası olmadan yaptığınız her değişiklik karanlıkta atış olur.

Görseller: en sık görülen yavaşlık sebebi

Sayfa ağırlığının çoğu genellikle görsellerden gelir. Telefonla çekilmiş, 4 MB'lık bir fotoğrafı küçültmeden siteye koymak, ziyaretçiye gereksiz yere onlarca megabayt indirtmek demektir. Görsel optimizasyonu için:

• Modern formatları (WebP, AVIF) kullanın; aynı kaliteyi çok daha küçük boyutta verirler.
• Görselleri gösterilecekleri boyutta sunun; 3000 piksellik görseli 300 piksellik alana sığdırmak israftır.
• Ekranda henüz görünmeyen görselleri sonradan yükleyin (lazy loading).

Çoğu sitenin hız sorununun yarısı, sadece görselleri doğru boyutlandırmakla çözülür.

Önbellekleme (cache): aynı işi iki kez yapmamak

Önbellekleme, daha önce yüklenmiş içerikleri tekrar tekrar sunucudan çekmek yerine kullanıcının tarayıcısında veya ara sunucularda saklamaktır. Doğru yapılandırılmış bir önbellek, tekrar gelen ziyaretçiler için sayfayı neredeyse anında açar. Tarayıcı önbelleği, sunucu önbelleği ve CDN önbelleği birlikte kullanıldığında sonuç çarpıcıdır.

Kod ve dosya optimizasyonu

Yüklenen her dosya bir maliyettir. Sayfa hızı artırma çalışmasının teknik tarafında şunlar yer alır:

1. Küçültme (minification): CSS, JavaScript ve HTML dosyalarından gereksiz boşluk ve karakterleri temizlemek.
2. Sıkıştırma: Sunucudan gönderilen dosyaları Gzip veya Brotli ile sıkıştırmak.
3. Kod bölme: Tüm kodu tek seferde yüklemek yerine, yalnızca o sayfada gereken kısmı yüklemek.
4. Kullanılmayan kodu temizlemek: Eski eklentilerden veya temalardan kalan ölü kodu kaldırmak.

Modern çatılar bu işlerin çoğunu otomatik yapar. Örneğin Next.js, kod bölme ve görsel optimizasyonunu hazır sunar; nedenini Next.js nedir yazısında anlattık. Doğru teknoloji seçimi hız savaşının yarısını baştan kazandırır; seçenekler için en iyi web teknolojileri yazısına bakabilirsiniz.

Altyapı ve dağıtım ağı (CDN)

Sunucunuz İstanbul'daysa, İzmir'deki ziyaretçi bile ufak bir gecikme yaşar; Almanya'daki ziyaretçi çok daha fazlasını. CDN (içerik dağıtım ağı), site içeriğini dünyanın farklı noktalarındaki sunuculara kopyalayarak ziyaretçiye en yakın yerden sunar. Bu, özellikle farklı bölgelere hitap eden siteler için ciddi fark yaratır. DNS yapılandırmanızı ve yönlendirmenizi DNS lookup aracıyla kontrol etmek, altyapı sorunlarını erken yakalamanıza yardımcı olur.

Hız sadece konfor değil, SEO'dur

Google, sayfa hızını ve kullanıcı deneyimini doğrudan bir sıralama sinyali olarak kullanıyor. Yani yavaş site sadece ziyaretçi değil, sıralama da kaybettirir. Hız, teknik SEO'nun ayrılmaz bir parçasıdır; konuyu teknik SEO rehberi yazısında ele aldık. SEO'nun bütününe yabancıysanız SEO nedir yazısı iyi bir başlangıç.

Önce büyük taşları kaldırın

Hızlandırma çalışmasında en sık yapılan hata, küçük detaylarla uğraşırken asıl yükü gözden kaçırmaktır. Birkaç milisaniye kazandıran ince ayarlarla vakit harcamadan önce, sayfayı gerçekten yavaşlatan büyük kalemleri bulun: dev görseller, ağır eklentiler ve gereksiz dış betikler. Genelde sorunun yüzde sekseni, bu birkaç büyük kaynaktan gelir. Önce onları çözmek, en kısa sürede en görünür iyileşmeyi sağlar.

Mobil hız ayrı bir öncelik

Trafiğin büyük kısmı telefondan geldiği için, mobil hız masaüstünden daha kritik. Mobil cihazlar genelde daha yavaş bağlantı ve işlemciyle çalışır; bu yüzden hafif tasarım şarttır. Her ekrana uyum sağlayan yapının mantığını responsive tasarım nedir yazısında bulabilirsiniz.

Yazı tipleri ve üçüncü parti kodlar

Çoğu site sahibinin gözden kaçırdığı iki sinsi yavaşlık kaynağı vardır. Birincisi web yazı tipleri: çok sayıda farklı font ve kalınlık yüklemek, sayfanın açılışını geciktirir. Çözüm, az sayıda font kullanmak ve yüklenirken metnin görünür kalmasını sağlamaktır. İkincisi ise üçüncü parti kodlardır; sohbet pencereleri, reklam etiketleri, analiz araçları ve sosyal medya butonları arka planda ciddi yük bindirebilir. Gerçekten ihtiyaç duymadığınız her dış betiği kaldırmak, sayfayı hissedilir derecede hafifletir.

Veritabanı ve sunucu yanıt süresi

Bazı durumlarda yavaşlığın kaynağı tarayıcı değil, sunucudur. İçeriğin veritabanından gelmesi gecikiyorsa, kullanıcı daha ilk baytı bile geç alır. Veritabanı sorgularını optimize etmek, sık kullanılan verileri önbelleğe almak ve yeterli kaynağa sahip bir sunucu kullanmak bu sorunu çözer. Sunucunuzun ilk yanıt süresini ve durum kodlarını HTTP header checker aracıyla gözlemleyebilirsiniz.

Dönüşüm ve gelir bağlantısı

Hız soyut bir teknik metrik değil, doğrudan paradır. Daha hızlı açılan bir e-ticaret sitesi daha çok satar; daha hızlı bir kurumsal site daha çok teklif alır. Çünkü ziyaretçi beklemeyi sevmez ve bekletildiğinde gider. Bu yüzden hız çalışmasını bir gider değil, dönüşüm yatırımı olarak görmek gerekir. E-ticaret özelinde bu ilişkiyi e-ticaret sitesi kurma rehberi yazısında da ele aldık.

Hızlı bir kontrol listesi

• Görseller küçültüldü ve modern formata çevrildi mi?
• Tarayıcı ve sunucu önbelleği yapılandırıldı mı?
• CSS, JS ve HTML küçültülüp sıkıştırıldı mı?
• Gereksiz eklenti ve ölü kod temizlendi mi?
• CDN kullanılıyor mu?
• Mobil performans ayrıca test edildi mi?

Web sitesi hızlandırma; ölçmek, görselleri ve kodu optimize etmek, önbelleği doğru kurmak ve sağlam bir altyapı kullanmaktan geçer. Bu adımlar bir araya geldiğinde hem ziyaretçi memnuniyeti hem de Google sıralamanız yükselir. Sitenizi gözle görülür şekilde hızlandırmak için Melih Bilge ile iletişime geçin; önce ölçer, sonra somut bir iyileştirme planı sunarız.