# Ürün görselleri performans için nasıl optimize edilir

> Bir ürün sayfasında veya kategori sayfasında görseller genellikle sayfanın toplam ağırlığının büyük bölümünü oluşturur. Aynı zamanda koda veya barındırmaya dokunmadan devreye alınabilecek en basit performans kaldıracıdır.

- Source canonique : [https://allaux.fr/tr/guides/optimiser-images-produits](https://allaux.fr/tr/guides/optimiser-images-produits)
- Langue : TR
- Dernière mise à jour : 2026-09-30

## Doğrudan yanıt

> Görselleri modern, sıkıştırılmış bir formatta (WebP veya AVIF), tam çözünürlük yerine gerçekten görüntülenen boyutlarda sunun ve loading="lazy" özniteliği sayesinde yükleme sırasında görünür ekranın dışında kalanların yüklenmesini erteleyin.

## Sırasıyla devreye alınması gereken kaldıraçlar

1. **Gerçekten görüntülenen boyuta yeniden boyutlandırın** — 300 piksellik bir küçük resimde gösterilen, genişliği birkaç bin piksel olan bir görsel, hiçbir görsel fayda sağlamadan bant genişliği israf eder. Üretilen boyutlar, temanın gerçekte kullandığı boyutlarla eşleşmelidir.
2. **Modern, sıkıştırılmış bir formata dönüştürün** — WebP ve giderek daha fazla AVIF, eşdeğer görsel kalitede JPEG veya PNG'ye göre belirgin şekilde daha düşük ağırlık sunar. Çoğu güncel CMS ve barındırma hizmeti bu formatları otomatik olarak üretebilir veya dönüştürebilir.
3. **Ekran dışındaki görsellerin yüklenmesini erteleyin** — HTML loading="lazy" özniteliği, tarayıcıya bir görseli yalnızca görünür alana yaklaştığında yüklemesini söyler; bu da çok sayıda ürün içeren bir sayfanın ilk görüntülenmesini hızlandırır.
4. **Yüklemede görünür olan ana görseli ertelemeyin** — Hemen görünen en büyük görsel (genellikle ana ürün görseli) ertelenmemelidir, çünkü Google'ın Core Web Vitals göstergelerinden biri olan LCP ölçümünü belirleyen tam olarak budur.
5. **Trafiğe göre görselleri bir CDN üzerinden sunun** — Bir CDN, görsel sunumunu ziyaretçiye coğrafi olarak yakın bir noktadan dağıtır; bu da yalnızca sıkıştırmanın sağlayabileceğinin ötesinde aktarım süresini azaltır.

## Görsellerin algılanan performansı neden bu kadar etkilediği

Onlarca ürün gösteren bir kategori sayfasında, optimize edilmemiş her küçük resim diğerlerine eklenir: her görselde birkaç on kilobaytlık bir tasarruf, görünen ürün sayısıyla çarpıldığında, tek bir CSS veya JavaScript dosyasında yapılacak eşdeğer bir optimizasyondan çok daha fazla, ziyaretçinin algıladığı yükleme süresini doğrudan değiştirir.

Arama motoru optimizasyonuyla bağlantı doğrudandır: Google'ın kullandığı üç Core Web Vitals göstergesinden biri olan LCP, tam olarak sayfanın en büyük görünür öğesinin görüntülenme süresini ölçer; bu öğe çoğunlukla bir ürün sayfasındaki ürün görseli veya ana sayfadaki bir banner'dır. Görselleri optimize etmek, hem ziyaretçi deneyimini hem de Google tarafından açıkça dikkate alınan bir kriteri iyileştirir.

## Sık yapılan hatalar

- Herhangi bir ön yeniden boyutlandırma yapmadan doğrudan bir fotoğraf makinesinden veya akıllı telefondan gelen, genellikle birkaç megabaytlık fotoğrafları yüklemek.
- Hemen görünen ana görselin yüklenmesini ertelemek; bu, LCP'yi iyileştirmek yerine tam tersine kötüleştirir.
- Bu formatları desteklemeyen eski tarayıcılar için bir yedek sürüm öngörmeden modern formatlara dönüştürmek.
- Algılanan kaliteyi belirgin şekilde bozacak kadar aşırı sıkıştırmak; bu, bir ürün sayfasında ziyaretçinin güvenine zarar verebilir.

## Yakınlaştırma (zoom) versiyonunu da düşünün

> Yakınlaştırma özelliğine sahip bir ürün sayfasında, zoom için kullanılan yüksek çözünürlüklü görselin, ziyaretçi bu özelliği gerçekten tetikleyene kadar yüklenmesine gerek yoktur. Tıklama veya üzerine gelme anına erteleme, ziyaretçilerin yalnızca bir azınlığı zoom özelliğini kullanırken her ziyarette ağır bir görselin yüklenmesini önler.

## FAQ

### Görselleri manuel olarak mı optimize etmek gerekir, yoksa otomatik araçlar var mı?

Birçok PrestaShop eklentisi ve WooCommerce eklentisi, yükleme anında veya mevcut tüm katalog üzerinde sonradan sıkıştırma ve dönüştürmeyi otomatikleştirir; bu da görsel görsel manuel işlemi ortadan kaldırır.

### Görsel optimizasyonu yavaş bir mağazayı çözmeye yeter mi?

Gerçek ve genellikle hızlı uygulanabilen bir kazanım sağlar, ancak indekslenmemiş SQL sorguları veya yanlış yapılandırılmış önbellek gibi bir sorunu düzeltmez: birden fazla kaldıraçtan biridir, tek başına çözüm değildir.

### WebP formatı tüm tarayıcılarla uyumlu mu?

Modern tarayıcılar günümüzde bunu büyük ölçüde destekliyor. Kalan uyumsuzluk durumları için, JPEG veya PNG yedek sürümü içeren bir picture etiketi tüm tarayıcılarda görüntülenmeyi garanti eder.