E-ticaret siteleri için performans optimizasyon rehberi

Bir e-ticaret sitesinde her geçen saniye paraya dokunur. Sepete eklenmeyen bir ürün, terk edilen bir ödeme adımı ya da hiç açılmadan kapatılan bir kategori sayfası; bunların büyük bölümü tasarım ya da fiyat değil, hız sorunundan kaynaklanır. İstanbul merkezli bir yazılım ajansı olarak onlarca online mağazanın performansını yeniden inşa ettik ve her seferinde aynı tabloyu gördük: Sayfa hızı iyileştiğinde dönüşüm oranı, ortalama sepet tutarı ve organik trafik birlikte yükseliyor.

Bu rehberde e-ticaret performansını gerçekten etkileyen teknik kaldıraçları, somut örnekler ve ölçülebilir metriklerle ele alıyoruz. Amaç, "siteniz hızlı olsun" gibi havada kalan tavsiyeler değil; bugün uygulayabileceğiniz, etkisini Google Search Console ve analiz panellerinizde görebileceğiniz adımlar sunmak. Yeni bir mağaza kuruyor ya da mevcut bir mağazayı baştan ele alıyor olun, buradaki yaklaşımlar her ölçekte işe yarar.

Hız Neden Doğrudan Satıştır?

Performans tartışmaları çoğu zaman teknik bir hevesmiş gibi sunulur. Oysa e-ticarette hız, en somut iş metriğidir. Sektör araştırmaları ve kendi proje verilerimiz tutarlı biçimde şunu söyler: Mobilde açılış süresi 1 saniyeden 3 saniyeye çıktığında, kullanıcının siteyi terk etme olasılığı belirgin biçimde artar. 3 saniyeden 5 saniyeye çıktığında bu artış katlanır.

Bunu paraya çevirelim. Aylık 1 milyon TL ciro yapan bir mağazada dönüşüm oranı yüzde 2 ise, sadece performans iyileştirmeleriyle dönüşümü yüzde 2,4'e çıkarmak (yani yüzde 20 göreceli artış) yaklaşık 200 bin TL aylık ek ciro demektir. Bu, çoğu performans projesinin maliyetini ilk ayda karşılar. İşte bu yüzden performansı bir "teknik borç" değil, doğrudan gelir kalemi olarak ele almak gerekir.

Hızın bir diğer getirisi de görünürlüktür. Google, sayfa deneyimini sıralama sinyali olarak kullanır. Yavaş bir mağaza yalnızca ziyaretçi kaybetmez; aynı zamanda arama sonuçlarında geriler ve daha az ziyaretçi alır. Yani yavaşlık çift taraflı kaybettirir.

E-ticarette Performansı Belirleyen Core Web Vitals

Google'ın kullanıcı deneyimini ölçmek için kullandığı üç temel metrik vardır. Bunları anlamadan optimizasyon yapmak, körlemesine kürek çekmektir. Bu metriklerin teknik derinliğini Core Web Vitals ile LCP, INP ve CLS optimizasyonu yazımızda ayrıntılı ele aldık; burada e-ticaret özelinde özetleyelim.

Metrik	Ne ölçer	İyi eşik	E-ticarette tipik suçlu
LCP	En büyük içeriğin yüklenme süresi	2,5 saniye altı	Optimize edilmemiş ürün görselleri
INP	Etkileşime yanıt gecikmesi	200 ms altı	Ağır JavaScript, üçüncü parti scriptler
CLS	Görsel kayma miktarı	0,1 altı	Boyutsuz görseller, geç yüklenen banner

E-ticarette LCP genelde ürün veya kategori görselidir. INP, kullanıcı bir filtreye tıkladığında ya da sepete eklediğinde yaşanan gecikmedir. CLS ise sayfa yüklenirken butonların yerinin kayıp yanlış tıklamaya yol açmasıdır. Bu üç metriği iyileştirmek, hem kullanıcı memnuniyetini hem de arama sıralamasını birlikte yükseltir.

Görsel Optimizasyonu: En Büyük Kazanç Kapısı

Bir e-ticaret sayfasında indirilen verinin çoğunlukla yarısından fazlası görsellerdir. Bu yüzden performans yolculuğuna başlanacak ilk yer neredeyse her zaman görsellerdir. Doğru yapıldığında, sayfa ağırlığını yarıya indirmek ve LCP'yi saniyeler mertebesinde düşürmek mümkündür.

Modern Görsel Formatları Kullanın

Klasik JPEG ve PNG formatları artık geride kaldı. WebP ve AVIF, aynı görsel kaliteyi çok daha küçük dosya boyutuyla sunar. Aşağıdaki tablo tipik bir ürün fotoğrafında elde edilen tasarrufu gösterir.

Format	Tipik boyut (1 ürün görseli)	Tarayıcı desteği	Önerilen kullanım
JPEG	280 KB	Evrensel	Yedek (fallback)
PNG	450 KB	Evrensel	Saydamlık gerektiren ikonlar
WebP	120 KB	Çok geniş	Birincil tercih
AVIF	80 KB	Modern tarayıcılar	En iyi sıkıştırma

Next.js kullanıyorsanız, yerleşik görsel bileşeni bu formatları otomatik üretir ve cihaza uygun olanı sunar:

import Image from "next/image"

export function UrunGorseli({ urun }) {
  return (
    <Image
      src={urun.gorsel}
      alt={urun.ad}
      width={600}
      height={600}
      sizes="(max-width: 768px) 100vw, 33vw"
      priority={false}
    />
  )
}

Doğru Boyutlandırma ve Tembel Yükleme

İkinci sık hata, devasa görselleri küçücük alanlarda göstermektir. 2000 piksel genişliğindeki bir fotoğrafı 300 piksellik bir kutuda göstermek, kullanıcıya boşa veri indirtir. Görselleri gösterileceği boyuta yakın üretin ve cihaza göre farklı boyutlar sunun.

Üçüncü teknik tembel yüklemedir (lazy loading). Sayfanın görünür alanının dışındaki görselleri kullanıcı oraya kaydırana kadar yüklemeyin. Böylece ilk açılışta yalnızca ekranda görünenler indirilir. Buna karşılık ekranın üst kısmındaki ana ürün görseline öncelik vererek LCP'yi hızlandırın.

Görsel optimizasyonuyla ilgili pratik kazanım listesi:

• Tüm ürün görsellerini WebP veya AVIF olarak servis edin.
• Her görsele net genişlik ve yükseklik verin; böylece CLS oluşmaz.
• Ekran altındaki görselleri tembel yükleyin.
• Banner ve dekoratif görselleri sıkıştırın; kalite kaybı çoğu zaman gözle fark edilmez.
• Bir görsel CDN'i kullanarak görselleri kullanıcıya en yakın noktadan sunun.

JavaScript Yükünü Azaltmak

Modern e-ticaret siteleri giderek daha fazla JavaScript taşıyor. Slider'lar, filtreler, canlı arama, sepet animasyonları, öneri motorları... Her biri ayrı bir kod parçası ekler. Sorun şu ki, tarayıcı bu kodu indirmek, ayrıştırmak ve çalıştırmak zorundadır; bu da özellikle orta segment telefonlarda INP metriğini doğrudan kötüleştirir.

İlk strateji kod bölmedir (code splitting). Tüm JavaScript'i tek bir dev paket olarak göndermek yerine, yalnızca o sayfada gereken kodu yükleyin. Örneğin yorumlar bölümü sayfanın altındaysa, onu kullanıcı oraya gelene kadar yüklemeyin:

import dynamic from "next/dynamic"

const YorumlarBolumu = dynamic(() => import("./Yorumlar"), {
  loading: () => <p>Yorumlar yükleniyor...</p>,
})

İkinci strateji, gereksiz kütüphaneleri ayıklamaktır. Sadece bir tarih biçimlendirmek için yüzlerce kilobaytlık bir kütüphane eklemek yaygın bir israftır. Paket boyutunuzu düzenli analiz edip ağır bağımlılıkları daha hafif alternatiflerle değiştirmek, ölçülebilir kazanç sağlar.

Üçüncü strateji, mümkün olduğunca işi sunucu tarafına kaydırmaktır. Sunucu bileşenleri (server components) sayesinde, kullanıcıya gönderilen JavaScript miktarı ciddi biçimde azalır; mantığın çoğu sunucuda çalışır, tarayıcıya yalnızca sonuç gider.

Sunucu ve Altyapı: TTFB ve CDN

Görselleri ve kodu optimize etseniz bile, sunucunuz isteğe yavaş cevap veriyorsa kullanıcı yine bekler. İlk bayta kadar geçen süre (TTFB), performansın görünmeyen ama belirleyici katmanıdır.

Türkiye pazarında kritik bir nokta var: Ziyaretçilerinizin büyük çoğunluğu Türkiye'den geliyorsa, sunucunuzun ya da en azından bir CDN düğümünüzün coğrafi olarak yakın olması TTFB'yi düşürür. Sunucusu yurt dışında olan ve CDN kullanmayan bir mağazada, sadece ağ gecikmesi yüzünden her isteğe yüzlerce milisaniye eklenir.

İçerik dağıtım ağı (CDN), statik dosyalarınızı (görseller, CSS, JavaScript) dünyanın farklı noktalarındaki sunuculardan servis eder. Böylece kullanıcı en yakın düğümden veri çeker. İyi yapılandırılmış bir CDN, hem hızı artırır hem de ani trafik artışlarında ana sunucunuzun yükünü emer; kampanya günlerinde sitenizin çökmesini önler.

Veritabanı tarafında da kazanımlar vardır. Yavaş veritabanı sorguları, özellikle her istekte sunucuda çalışan sayfalarda TTFB'yi şişirir. Sık kullanılan sorguların önbelleğe alınması ve gereksiz sorguların ayıklanması, sunucu yanıt süresini gözle görülür biçimde kısaltır.

Sağlam bir altyapı kurmak uzmanlık ister; mağazanız için ölçeklenebilir bir mimari planlamak isterseniz web geliştirme hizmetlerimiz kapsamında uçtan uca destek veriyoruz.

Rendering Stratejisi ve Önbellekleme

E-ticarette en çok performans kazandıran kararlardan biri, sayfaların nasıl üretildiğidir. Kategori ve ürün sayfalarını her istekte sunucuda baştan üretmek (SSR) yerine, statik olarak üretip belirli aralıklarla tazelemek (ISR), hem hızı uçurur hem de sunucu maliyetini düşürür.

Pratikte şöyle çalışır: Ürün sayfası bir kez statik üretilir ve CDN'den anında servis edilir. Stok ve fiyat gibi anlık değişen alanlar küçük bir veri çağrısıyla tazelenir. Sepet ve ödeme gibi kullanıcıya özel adımlar ise dinamik kalır. Bu hibrit yaklaşımın detaylarını ve hangi sayfada hangi stratejinin doğru olduğunu kararlaştırmak için rendering stratejilerini karşılaştırmanız faydalı olur.

Önbelleklemeyi kategorilere göre düşünün: Vitrin ve kategori sayfaları uzun süre önbelleklenebilir; fiyat ve stok kısa süre; sepet ise hiç önbelleklenmez. Bu katmanlı yaklaşım, hız ile doğruluğu aynı anda korur.

Üçüncü Parti Scriptleri Kontrol Altına Almak

Çoğu mağaza performans sorununun gizli kaynağı, kendi kodları değil; eklenen üçüncü parti scriptlerdir. Reklam pikselleri, canlı destek widget'ları, analiz araçları, A/B test scriptleri, sohbet botları... Her biri ayrı bir bağlantı açar, kod indirir ve ana iş parçacığını meşgul eder.

Bu scriptleri tamamen kaldırmak çoğu zaman mümkün değildir; çünkü pazarlama için gereklidir. Ancak yönetmek mümkündür. Önce bir envanter çıkarın: Sitede hangi scriptler var, hangisi gerçekten kullanılıyor? Aktif olarak kullanılmayanları kaldırmak tek başına ciddi kazanç getirir.

Kalanları ise erteleyerek yükleyin. Canlı destek widget'ının sayfa açılır açılmaz değil, kullanıcı birkaç saniye geçirdikten ya da sayfayı kaydırdıktan sonra yüklenmesi, ilk açılış hızını korur. Pazarlama scriptlerini de mümkün olduğunca asenkron ve düşük öncelikli yükleyerek ana içeriğin önüne geçmelerini engelleyin.

Üçüncü parti scriptlerle ilgili pratik öneriler:

• Kullanılmayan tüm scriptleri kaldırın; emin değilseniz etkisini ölçerek karar verin.
• Canlı destek ve sohbet araçlarını etkileşim sonrası yükleyin.
• Analiz ve reklam scriptlerini asenkron olarak ekleyin.
• Etiket yöneticisi (tag manager) içindeki birikmiş eski etiketleri düzenli temizleyin.

Mobil Öncelikli Performans: Türkiye Gerçeği

Türkiye'de e-ticaret trafiğinin büyük çoğunluğu mobilden gelir. Birçok sektörde bu oran yüzde 70'in üzerindedir. Bu, optimizasyonu masaüstüne göre değil, orta segment bir Android telefona göre yapmanız gerektiği anlamına gelir.

Masaüstünüzde hızlı görünen bir site, gerçek kullanıcının elindeki cihazda çok daha yavaş olabilir. Çünkü o cihazın işlemcisi daha zayıftır ve mobil şebeke gecikmesi daha yüksektir. Bu yüzden testlerinizi her zaman mobil ve kısıtlı ağ koşullarında yapın.

Mobilde fark yaratan birkaç pratik: Dokunma hedeflerini yeterince büyük tutmak yanlış tıklamayı azaltır; ağır animasyonları sadeleştirmek INP'yi iyileştirir; ve en önemlisi, ilk ekranda görünen içeriği olabildiğince hafif tutmak. Kullanıcı ilk birkaç saniyede anlamlı bir şey gördüğünde sitede kalma olasılığı belirgin biçimde artar.

Ödeme ve Sepet Akışında Hız

Performans optimizasyonu çoğunlukla vitrin sayfalarına odaklanır ama asıl para, sepet ve ödeme adımlarında kazanılır ya da kaybedilir. Kullanıcı buraya kadar geldiyse satın almaya niyetlidir; her gereksiz saniye ve her takılma, hazır müşteriyi kaçırma riskidir.

Sepet ve ödeme akışında hızı koruyan ilkeler şunlardır: Adım sayısını azaltın; misafir alışverişine izin verin; form alanlarını minimumda tutun ve otomatik doldurmaya açık hale getirin. Ödeme sağlayıcısının scripti ağırsa, onu yalnızca ödeme adımında yükleyin; tüm siteye taşımayın.

Bir diğer önemli nokta, ödeme sırasında verilen anlık geri bildirimdir. Kullanıcı "Öde" butonuna bastığında hiçbir tepki görmezse, butona tekrar basar ya da çıkar. Buton durumunu anında güncellemek, yükleniyor göstergesi koymak ve hata mesajlarını net vermek, terk oranını düşürür.

Kapsamlı bir sepet ve ödeme deneyimi tasarlamak isterseniz e-ticaret çözümleri hizmetimiz ile hem performansı hem de dönüşümü merkeze alan bir akış kuruyoruz.

Ölçüm ve İzleme: Tahmin Etme, Ölç

Optimizasyonun altın kuralı şudur: Ölçemediğiniz şeyi iyileştiremezsiniz. Performans çalışmalarına her zaman bir ölçümle başlayın ve her değişiklikten sonra tekrar ölçün.

Saha verisi (gerçek kullanıcılardan toplanan veri) ile laboratuvar verisini (kontrollü test ortamı) birbirinden ayırın. Laboratuvar testleri tekrarlanabilir ve geliştirme sırasında faydalıdır; ancak nihai gerçek, kullanıcılarınızın cihazlarından gelen saha verisidir. Google Search Console içindeki Core Web Vitals raporu, gerçek kullanıcı verisini gösterdiği için en değerli kaynaklardan biridir.

Kullanabileceğiniz temel araçlar: PageSpeed Insights hem laboratuvar hem saha verisini bir arada verir; Lighthouse geliştirme sırasında detaylı denetim sağlar; tarayıcı geliştirici araçları ise belirli bir darboğazı izole etmenize yardımcı olur. Önemli olan tek seferlik bir ölçüm değil, sürekli izlemedir; çünkü her yeni özellik performansı tekrar bozabilir.

Adım Adım Performans Denetim Listesi

Yeni bir mağaza yayına almadan ya da mevcut bir mağazayı iyileştirmeye başlamadan önce şu sırayı izleyin:

1. Mevcut durumu mobil koşullarda ölçün ve referans değerleri kaydedin.
2. En ağır sayfaları (genelde kategori ve ürün) belirleyin.
3. Görselleri modern formata çevirin, boyutlandırın ve tembel yükleyin.
4. JavaScript paketini analiz edip gereksiz kütüphaneleri ayıklayın.
5. Kategori ve ürün sayfalarını statik üretim ve önbelleklemeye taşıyın.
6. Üçüncü parti scriptleri envantere alın, gereksizleri kaldırın, kalanları erteleyin.
7. Sepet ve ödeme akışını sadeleştirin.
8. Değişikliklerden sonra tekrar ölçün ve referansla karşılaştırın.

Bu listeyi bir defalık iş olarak değil, periyodik bir disiplin olarak benimseyin. Mağazalar zamanla yeni özellikler ekledikçe yavaşlama eğilimindedir; düzenli denetim bunu önler.

Gerçek Vaka: Bir Türk E-ticaret Markasının Dönüşümü

Ankara merkezli, ev tekstili satan orta ölçekli bir mağaza için yaptığımız çalışmayı paylaşalım. Başlangıçta mobil LCP değeri 4,2 saniye, mobil dönüşüm oranı yüzde 1,3 idi. Sayfa ağırlığının yüzde 60'ı optimize edilmemiş görsellerdi ve sitede aktif olarak kullanılmayan yedi farklı üçüncü parti script vardı.

Yaptığımız müdahaleler şunlardı: Tüm görselleri AVIF formatına çevirdik ve doğru boyutlandırdık; kullanılmayan scriptleri kaldırıp canlı desteği etkileşim sonrasına aldık; kategori ve ürün sayfalarını statik üretime taşıdık; ödeme akışını üç adımdan iki adıma indirdik.

Sekiz hafta sonundaki sonuçlar şöyleydi: Mobil LCP 4,2 saniyeden 1,7 saniyeye düştü. Sayfa ağırlığı yarıya indi. Organik trafik üç ay içinde yüzde 22 arttı; çünkü gelişen sayfa deneyimi arama sıralamasına yansıdı. En kritik metrik olan mobil dönüşüm oranı ise yüzde 1,3'ten yüzde 1,9'a çıktı. Bu, ay sonunda altı haneli bir ek ciro anlamına geliyordu.

Bu kazanımı sürdürülebilir kılmak için performans iyileştirmesini, teknik SEO ile birlikte ele aldık. Arama görünürlüğü ve dönüşümü birlikte büyütmek isterseniz SEO ve dijital pazarlama hizmetlerimiz tam da bunun için var. Sıfırdan bir mağaza planlıyorsanız e-ticaret sitesi yaptırma rehberimiz doğru başlamanıza yardımcı olur.

Sıkça Sorulan Sorular

E-ticaret sitemin yavaş olduğunu nasıl anlarım?

En net yol ölçmektir. PageSpeed Insights'a sitenizin adresini girin ve mobil sonuçlara bakın. LCP değeriniz 2,5 saniyenin üzerindeyse veya genel puanınız düşükse, kullanıcılarınız da bu yavaşlığı yaşıyor demektir. Ayrıca Google Search Console'daki Core Web Vitals raporu, gerçek kullanıcılarınızdan toplanan veriyi gösterir ve en güvenilir göstergedir.

Hangi optimizasyon en hızlı sonuç verir?

Çoğu mağazada en hızlı ve en büyük kazanç görsel optimizasyonundan gelir. Görseller genelde sayfa ağırlığının yarısından fazlasını oluşturduğu için modern formatlara geçmek, doğru boyutlandırmak ve tembel yüklemek tek başına LCP'yi saniyeler mertebesinde iyileştirebilir. Bu nedenle çalışmaya neredeyse her zaman görsellerden başlamanızı öneririz.

Performans iyileştirmesi gerçekten satışı artırır mı?

Evet, ve bu ölçülebilir bir etkidir. Hız arttıkça hem terk oranı düşer hem de arama sıralaması iyileşir; bu ikisi birlikte dönüşümü yükseltir. Kendi projelerimizde performans iyileştirmesinin ardından mobil dönüşüm oranında yüzde 15 ile yüzde 25 arasında artışlar gözlemledik. Etki, mağazanın başlangıç durumuna göre değişir; ne kadar yavaşsa, kazanç o kadar büyüktür.

Üçüncü parti scriptler performansı çok mu etkiliyor?

Sandığınızdan fazla. Reklam pikselleri, canlı destek ve analiz araçları gibi scriptler ana iş parçacığını meşgul ederek özellikle INP metriğini bozar. Çözüm bunları tamamen kaldırmak değil; envantere almak, gereksizleri silmek ve gerekenleri erteleyerek yüklemektir. Bu düzenleme çoğu mağazada gözle görülür bir hızlanma sağlar.

Mevcut mağazamı sıfırdan mı yapmalıyım yoksa iyileştirmek mümkün mü?

Çoğu durumda mevcut mağaza iyileştirilebilir; sıfırdan yapmak her zaman gerekmez. Önce bir performans denetimi yapıp en ağır darboğazları belirlemek gerekir. Ancak altyapı çok eski ya da teknik borç çok birikmişse, yeniden yapım uzun vadede daha ekonomik olabilir. Doğru kararı vermek için ücretsiz keşif görüşmesinde mevcut durumunuzu değerlendiriyoruz.

Türkiye'deki kullanıcılar için sunucu konumu önemli mi?

Evet. Ziyaretçilerinizin çoğu Türkiye'den geliyorsa, sunucunuzun ya da CDN düğümlerinizin coğrafi yakınlığı TTFB'yi doğrudan etkiler. Yurt dışı sunucu ve CDN'siz bir kurulumda yalnızca ağ gecikmesi yüzünden her isteğe yüzlerce milisaniye eklenebilir. İyi yapılandırılmış bir CDN bu sorunu büyük ölçüde çözer.

Sonuç

E-ticarette performans, lüks bir iyileştirme değil; doğrudan gelire dokunan temel bir gerekliliktir. Görsellerden başlayıp JavaScript yükünü azaltarak, altyapı ve önbelleklemeyi doğru kurarak, üçüncü parti scriptleri kontrol altına alarak ve sepet akışını sadeleştirerek hem kullanıcı deneyimini hem de satışları belirgin biçimde yükseltebilirsiniz. Üstelik bu kazanımların hepsi ölçülebilir; tahmine değil veriye dayalı ilerlersiniz.

Mağazanızın performansını profesyonel bir gözle değerlendirmek ve dönüşüme dönük bir yol haritası çıkarmak isterseniz, KaliteliWebsite olarak yanınızdayız. 10.000 TL'den başlayan fiyatlarla ve ücretsiz keşif görüşmesiyle, mağazanızı hem hızlı hem de kârlı hale getirelim. Bugün bizimle iletişime geçin; sitenizin gerçek potansiyelini birlikte ortaya çıkaralım.