Web sitelerinin yavaş çalışmasının en büyük nedenlerinden biri, yüksek boyutlu ve optimize edilmemiş görsellerdir. Doğru uygulanan bir resim optimizasyonu; site hızınızı artırır, sunucu maliyetlerinizi düşürür ve Google Görseller aramasından ciddi organik trafik çekmenizi sağlar.
Resim Optimizasyonu Nedir?
Resim optimizasyonu, web sitenizdeki görsellerin kalitesini görsel olarak fark edilemeyecek bir seviyede korurken, dosya boyutlarını mümkün olan en aza indirme sürecidir. Aynı zamanda resim dosyalarının SEO (Arama Motoru Optimizasyonu) standartlarına uygun hale getirilmesini (dosya isimleri, alt etiketleri vb.) kapsar.
Adım 1: Doğru Resim Formatını Seçme
Resmi sıkıştırmadan önce doğru formata sahip olduğundan emin olmalısınız:
- JPEG (JPG): Fotoğraflar ve çok renkli karmaşık görseller için en iyi formattır. İyi sıkıştırılır ancak saydamlık (transparan arka plan) desteklemez.
- PNG: Şeffaf (saydam) arka plan gerektiren logolar, ikonlar veya az renkli grafikler için kullanılır. JPEG’e göre dosya boyutu daha büyüktür.
- WebP: Google tarafından geliştirilen, hem saydamlığı destekleyen hem de JPEG ve PNG’ye göre %30 oranında daha küçük dosya boyutları sunan yeni nesil web formatıdır.
- SVG: Logolar ve vektörel illüstrasyonlar için idealdir. Boyutu ne kadar büyütülürse büyütülsün kalitesi bozulmaz ve dosya boyutu çok küçüktür.
Adım 2: Resim Boyutlandırma ve Sıkıştırma
Bir blog yazısının içine ekleyeceğiniz fotoğrafın genişliği genellikle 800-1000 pikseli geçmemelidir. Ancak kullanıcılar bazen telefondan çektikleri 4000×3000 piksel boyutlarındaki (ve 5 MB büyüklüğündeki) fotoğrafları doğrudan siteye yüklerler. Bu, devasa bir hız kaybıdır.
Ücretsiz Sıkıştırma Araçları
- TinyPNG: JPEG ve PNG dosyalarınızı kaliteden ödün vermeden %60-70 oranında küçültebilirsiniz.
- Squoosh.app: Google’ın hazırladığı bu araçla görseli farklı formatlara (özellikle WebP’ye) çevirebilir ve kalite/boyut dengesini anlık olarak görebilirsiniz.
WordPress Sıkıştırma Eklentileri
Eğer WordPress kullanıyorsanız Smush, Imagify, ShortPixel veya WebP Express gibi eklentiler kurarak, resim yüklendiği anda otomatik olarak sıkıştırılmasını ve WebP’ye dönüştürülmesini sağlayabilirsiniz.
Adım 3: SEO İçin Resim Optimizasyonu (Alt Etiketi ve Dosya Adı)
Arama motorları bir resmi insan gözüyle göremezler. O resmin neyle ilgili olduğunu anlamak için metin ipuçlarına ihtiyaç duyarlar.
1. Dosya Adını Doğru Yazın
IMG_2023_8945.jpg yerine, görselin içeriğini anlatan kirmizi-spor-ayakkabi.jpg gibi aralarında tire bulunan anlamlı dosya adları kullanın.
2. Alt Metin (Alt Text) Ekleyin
Alt metin, resim yüklenmediğinde veya görme engelli bireylerin kullandığı ekran okuyucularda devreye giren açıklamadır. Görselin tam olarak ne anlattığını tanımlamalı ve mümkünse içeriğin anahtar kelimesini doğal bir şekilde barındırmalıdır.
Adım 4: Lazy Loading (Tembel Yükleme) Kullanımı
Bir kullanıcı sayfanıza girdiğinde, sayfanın en altındaki resimlerin o an yüklenmesine gerek yoktur. Lazy loading teknolojisi, görsellerin sadece kullanıcının ekranına girdiklerinde yüklenmesini sağlar. Bu, başlangıç yükleme hızını (LCP) muazzam derecede iyileştirir. Modern tarayıcılar bu özelliği HTML koduna loading=”lazy” eklenmesiyle destekler.
Sonuç
Etkili bir resim optimizasyonu; doğru formatı (tercihen WebP) seçmek, boyutları ekran alanına göre kırpmak, kayıplı sıkıştırma yapmak ve doğru SEO etiketleriyle arama motorlarına sunmak adımlarından oluşur. Bu 4 adımı standart bir alışkanlık haline getirdiğinizde, sitenizin hızlanması kaçınılmazdır.