Web sitenizin ziyaretçilerinin neredeyse yarısının, web sitenizin 2 saniye içinde ya da daha kısa bir sürede yüklenmesini beklediğini biliyor muydunuz? Hatta daha kötüsü, bu ziyaretçilerin çoğu 3 saniye içinde yüklenmediği taktirde web sitenizi terk edecektir.
Neyse ki web sitenizi hızlandırarak ziyaretçilerin web sitenizi terk etmesini önemli ölçüde azaltabilirsiniz.
Bir web sayfasında indirilen baytların çoğunu genellikle görüntüler oluşturur. Sayfanızın hızını önemli ölçüde artırmak için bir yol arıyorsanız, yapmanız gereken ilk şey WordPress web sitenizdeki görüntüleri optimize etmektir.
İşte ışık hızında yüklenme süreleri elde etmek için kullanabileceğiniz 5 optimizasyon ipucu:
- Görüntüleri sıkıştırın.
WordPress web sitenizde yavaş yüklenen görüntülerin önüne geçmenin en iyi yolu, görüntülerinizi yüklemeden önce bu görüntüleri görüntü düzenleme yazılımlarıyla sıkıştırmaktır. Fakat doğru yazılımı bulamadıysanız ya da sitenizdeki daha önceden yüklenmiş olan görüntüleri optimize etmek istiyorsanız ne yapabilirsiniz?
Aşağıda değineceğimiz görüntü sıkıştırma eklentisi, görüntüleri WordPress web sitenize yüklerken anlık olarak optimize etmenizi sağlayan kolay bir yöntemdir.
Görüntü sıkıştırma yaptığınız zaman, görüntü kaliteleri etkilenmeden görüntülerinizin boyutlarını azaltabilirsiniz. Sıkıştırma işlemi ile bir görüntünün boyutları ziyaretçilerin fark edemeyeceği şekilde azaltılır ve görüntüler hala net ve keskin görünür.
Yüksek çözünürlüğü olan görüntüleri sıkıştırmak için kullanabileceğiniz en iyi eklenti EWWW Image Optimizer eklentisidir. Eklentiyi etkinleştirdiğiniz zaman yüklediğiniz tüm görüntüleri otomatik olarak optimize edebilirsiniz. Ayrıca bu eklenti ile web sitenize daha önce yüklemiş olduğunuz görüntüleri de optimize edebilirsiniz.
- Lazy Load’dan faydalanın.
Web sitenizde daha yavaş yüklenmelere sebep olan çok sayıda görüntü kullanmak mı istiyorsunuz?
Görüntülerin sayısını azaltmak ideal bir çözüm değildir. Özellikle sadece metin ile veremeyeceğiniz mesajları iletmek istediğiniz zaman görüntü ekleyememeniz büyük bir eksiklik olur. Eğer WordPress web sitenizin çoğu sayfasında birçok resim kullanıyorsanız, bu görüntülerin sadece gerekli olanlarının kullanıcılara görünür olmalarını isteyebilirsiniz. Böylelikle sadece ilgili ekrandaki görüntüler yüklenir, diğer görüntüler ise ziyaretçi üzerine gelene kadar yüklenmeyecektir. Bu duruma Lazy Load denir. Lazy load ile bantgenişliğinizden tasarruf edersiniz ve sayfa yüklenme hızlarınız artar.
Lazy load yüklemeleri yapmak için tek yapmanız gereken, Lazy Load eklentisini web sitenizde etkinleştirmektir.
- Doğru formatı kullanın.
Web siteniz için görüntü düzenlemeleri yaparken, görüntü kalitesi ve dosya boyutu arasında uyuşma olmalıdır. Görüntü formatlarını doğru olarak kaydetmek, görüntüleri optimize etmenin ve görüntü kalitesi ile dosya boyutu arasında uyuşma sağlamanın en iyi yoludur.
Web siteniz için doğru olan görüntü dosya biçiminin hangisi olduğunu merak ediyor musunuz? İşte en yaygın olanları:
- JPG, bir kayıplı sıkıştırma dosya biçimidir. Fotoğrafları daha küçük bir boyutta depolamak için bu formatı kullanabilirsiniz. Farklı renklerdeki çok sayıda görüntü için en iyi seçenektir.
- PNG, kayıpsız bir sıkıştırma dosya biçimidir. Daha basit ve saydam görüntüler için bu formatı kullanabilirsiniz. Çizimleri ve metinleri daha küçük bir boyutta saklamanız için iyi bir seçenektir.
- GIF, çok küçük görüntüler için ve sadece birkaç renk kullanan görüntüler için en iyi seçenektir.
İşte bu 3 farklı dosya formatının görünümleri:
Web için optimize edilmiş görüntüleri düzenlemek ve kaydetmek için kullanabileceğiniz en iyi yol Photoshop kullanmaktır. Bunun yerine ücretsiz bir alternatif arıyorsanız GIMP’i tercih edebilirsiniz.
İşte görüntü kalitesi ve görüntü boyutu arasında mükemmel bir uyum sağlamak için görüntülerinizi optimize etmenize yardımcı olacak birkaç ücretsiz online araç:
- TinyPNG, PNG dosyalarınızın kalitesinde bir bozulma olmadan boyutlarını azaltmanızı sağlayan akıllı bir kayıplı sıkıştırma aracıdır. Her biri en fazla 5 MB olacak şekilde maksimum 20 görüntüye kadar yükleme yapabilirsiniz.
- JPEGmini, JPEG dosyalarınızın kalitelerinde bir bozulma olmadan boyutlarını azaltmanızı sağlayan bir sıkıştırma aracıdır. Web sürümü ücretsizdir ve ayrıca masaüstü uygulaması olarak kullanabileceğiniz premium versiyonu da mevcuttur.
- ImageOptim, görüntülerin dosya boyutlarını azaltmanıza olanak veren bir Mac uygulamasıdır.
- Görüntü Hotlink’i Önleyin
Hotlinking, orijinal kaynaktan yükleme yapan fakat üçüncü parti sitelerde sunulan görüntülerin sunucunuzdan bant genişliği çalması işlemidir. Bu uygulama sunucu yükünüzü ve bant genişliği kullanımınızı artırır.
WordPress web sitenizden hotlinking’i devre dışı bırakmanın kolay yolu, .htaccess dosyanıza aşağıdaki kodu eklemektir.
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?websiteniz.com [NC]
RewriteRule \.(jpg|jpeg|png|gif)$ – [NC,F,L]
Yukarıdaki kodda websiteniz.com olan domain adınızı değiştirdiğinizden emin olun.
Bu kod, görüntülerin arama sonuçlarında ve web sitenizde görüntülenmesine izin verir fakat hotlink bağlantılarını engeller.
- Görüntüler yerine CSS kullanın.
Bir görüntüyü kullanmak genellikle HTML’den, CSS’ten ve JavaScript’ten daha fazla bayt kullanımını gerektirir. Bir görüntü yerine mümkün olduğunca CSS kullanmak, yüklenme sürelerinizi düşürmek için harika bir yoldur. Örneğin, basit CSS kullanarak gradyanlar, yuvarlanmış dikdörtgenler ya da gölgeler gibi belirli şekilleri yapabilirsiniz.
CSS’i kullanırken tarayıcı uyumluluğuna dikkat edin çünkü tüm tarayıcılarda aynı şekilde görüntüler oluşmaz.
Yukarıda verdiğimiz görüntü optimizasyonu ipuçları ile sayfa yüklenme sürelerinizi önemli ölçüde azaltabilirsiniz. Yüklenme sürelerindeki her gelişme, ziyaretçilerinizin web sitenizde daha uzun süre kalmalarını sağlar.