Bir web sitesi sahibi eninde sonunda ziyaretçi sayısını arttırmanın yollarını aramaya başlar. İster bir blog sahibi, ister bir satış sitesi sahibi olun. ziyaretçi sitenizin yaşam gücüdür.
Sitenize ziyaretçi çekebilmenin en başında ise SEO yani arama motoru optimizasyonu gelir. SEO Kısa vadede siteniz için ziyaretçi sağlayabilir, uzun vadede ise sadık kullanıcılarınızın olması web sitenizin performansı çok ama çok önemlidir.
Sayfaların hızlı yüklenmesi, kullanıcının sayfa geçişleri arasında beklememesi ziyaretçilerinizin sitenizi diğer muadil sitelere göre daha çok kullanmasına ve sevmesine yol açar. Diğer taraftan web sitenizin performansının da SEO üzerine doğrudan etkisi olduğu gerçeğini aklınızda tutun.
İnternet üzerinde Performansın ziyaretçi sayısı üzerindeki etkisine dair birkaç araştırma var. Bu araştırmalardan çıkan ortak sonuca göre yavaş açılan sayfaların kullanıcılar üzerindeki etkileri istatistiksel olarak şöyle sıralanmış;
- %11 – Daha az sayfa görüntüleme
- %16 – Daha az müşteri memnuniyeti
- %7 – Her anlamda getiri kaybı
Farklı araştırma gruplarına göre ise,
- %47 – Kullanıcı websitesinin 2 saniyenin altına yüklenmesini bekliyor
- %40 – Kullanıcı, eğer sayfa 3 saniyenin üzerinde yükleniyorsa, siteyi terk ediyor
- %52 – Online alışveriş yapan kullanıcı ise sadakat için sayfa hızını önemli görüyor
İstatistikler insanların bekleme sürelerine tahammülünün azaldığını gösteriyor. Bu durumda web sitelerimizin hızını artırmak için almamız gerekli önlemleri birkaç madde halinde inceleyelim.
1. HTTP İsteklerini Optimize Etmek
Bir web sitesinin yüklenmesi sırasında içeriğin büyük bir kısmı, css, js, resimler vs. oluşuyor. Tüm bu parçalar için ayrı ayrı HTTP istek gönderiliyor. sonuç olarak artan bu istekler sonucu sayfanın yüklenmesini de gecikiyor.
HTTP istekleri azaltmak için;
- Sayfadaki istek sayısı optimize edilmeli
- Resim yerine CSS kullanılabiliyorsa, kullanılmalı
- Birden fazla CSS ve JavaScript dosyası varsa birleştirilmeli
- Scriptler mümkün olduğunca kısa tutulmalı
- Sorun olmayacak tüm JavaScript dosyaları, sayfanın en altında referans edilmeli
- CDN kullanılmalı
2. CDN(Content Delivery Network) Kullanımı
CDN =İçerik Dağıtım Ağı
Web sitenizdeki resim/fotoğraf, CSS ve JavaScript gibi statik içerikli dosyaları farklı bir web adresi üzerinden hizmete açmak ve kullanmak sayfalarınızın yüklenme hızını ciddi şekilde etkilemektedir. CDN Kullanmak bilhassa çok fazla sayıda CSS ve JavaScript dosyası kullanılan durumlarda sayfanızın yüklenme hızında önemli bir kazanım elde edebilirsiniz.
3. Sunucu Cevap Süresinin Kısaltılması
Sunucu yanıt süresindeki hedef en fazla 200 ms olmalıdır. Sunucu cevap süresi, website trafiği, kaynak kullanımı, sunucuda çalışan kodların kalitesi ve sunucu yazılımı zincirin halkaları gibi birbirini etkileyen unsurlardır.
Öncelikle network çıkışının hızlı olması buradaki en kilit noktadır. Yine sunucuda işlemlerin hızlı olması adına yüksek hızda çalışan CPU ve SSD kullanımı da işlem sürelerini kısaltacak, dolayısıyla performansa doğrudan etki edecektir. Hosting seçerken size sunduğu imkanları araştırmak bu konuda sizi en baştan bu konudaki çözüme götürecektir.
4. İçerik Sıkıştırma
Kaliteli bir içeriğe sahip sayfalar genelde 100 KB üzerinde bir boyuta sahiptir. Kaliteli içerikten kasıt UX, SEO, resim kalitesi vs. gibi birçok alanda iyi olan sayfa demek aslında.
Kalite için belli bir boyuta ihtiyaç olduğu için, bu kaliteli ve büyük sayfaların yüklenme zamanını azaltmak için sıkıştırma yöntemlerini kullanabiliriz. Sıkıştırma işleminden sonra sayfanın istemciye gidecek boyutu %80 oranlarına kadar azalacaktır. Sunucu-istemci arasında sıkıştırma ve sıkıştırılan içeriğin açılması için işlemler yapılacak olsa da, gelen-giden verideki kazanç genellikle bu işlemin çok ötesinde bir performans kazancı sağlayacaktır. Bu konuyla ilgili kullanılan sıkıştırma yöntemlerinden biri olan GZIP‘e göz atabilirsiniz.
5. Tarayıcı Önbellek Kullanımı
Bir websitesi için tarayıcı önbellek özelliği aktif olduğunda, web sitesine ilk girişten sonraki tüm girişlerde (önbellek süresi boyunca), önbelleklenen veriler için gereksiz HTTP istekler olmayacaktır. Yani istemci ilk istekte sizin sunucunuza gider ve içeriği alır, içerik istemci tarafında önbellekte saklanır ve zaman aşımı olmadığı sürece sonraki isteklerde yanıt kendi bilgisayarından alınır. Bu da ikinci ve sonraki taleplerin süresini oldukça hızlandırır.
Her sayfanın önbelleğe alınması tabii ki pek mümkün değildir, ancak içeriği değişmeyen veya çok nadir değişen sayfalarda tarayıcı önbellek kullanımını aktif etmek kullanıcıların sayfalarınıza erişimini hızlandıracaktır.
6. Dosyaların Küçültülmesi (Minify)
Websitesi tasarımı yaparken kodlarımızı en okunabilir şekilde yazıyoruz. Çünkü geliştirme sırasında kodun okunabilirliği bizim için çok önemli. Okunabilirlik adına kod satırları arasında çok fazla boş satırlar, boş karakterler oluyor. Bundan dolayıda kodlarımız olduğundan fazla boyutlara sahip oluyor.
JavaScript, CSS ve HTML kodlarındaki gereksiz alanları temizleyerek, dosya boyutlarını da küçültebiliriz. Bu işlemleri manuel olarak yapmamız tabii ki zor, zaten gereksiz de bir işlem. Piyasada bu dosyaları minimize etmek için kullanılan birçok kütüphane ve online araç mevcut. Bunları kullanarak dosyalarınızın boyutlarını düşürebilirsiniz.
7. Resim Boyutlarının Optimize Edilmesi
Resimler için boyut ve format önemlidir. Tarayıcı üzerinde gösterilen resimlerin bazıları gereksiz seviyede kaliteli olabilir. Resimlerin kalitesi kullanıcıların anlamayacağı kadar düşürülmelidir. Bunun için kullanılabilecek birçok online araç var.
Resimler için diğer önemli bir konu, resmin formatı. Mümkün olduğu sürece
- JPEG kullanılmalı.
- PNG’nin zaten bir amacı var ve kullanılması gerektiği durumlarda kullanılmalı.
- GIF sadece küçük ve basit animasyonlar için kullanılabilir.
- BMP ve TIFF hiç kullanılmamalı.
Resimler konusunda bilinmesi gereken diğer bir konu da <img src=”” etiketindeki src kısmının boş bırakılmaması. Aynı şey linklerdeki href attribute için de geçerli. Eğer boş bırakılırsa gereksiz yere sitenin kök adresine HTTP istek yapılacaktır.
SONUÇ
Yukarıda yazılanlar aslında performans için yapılması gereken temel işler. Yukarıdaki temel işlerin içerisinde bazı detay konularda var. İleride işleyeceğimiz konular içine alıyorum.
Web sitesi performansı artırmak için uygulayacağımız hatalı işlemler / çözümler sitenin UI, UX, SEO gibi önemli yapılarını bozabileceğini unutmayın. Bu çalışmaları dikkatli ve özenli yapmalıyız.
