E-ticaret UX: sayfa türüne göre kurallar

Kısaca

E-ticaret UX, alışverişçinin ürünü bulup güvenle seçebilmesini, sürprizsiz ödeyip siparişini takip edebilmesini sağlayan tasarımdır. Her sayfa türünün tek bir işi vardır: ana sayfa yön verir, liste karşılaştırtır, ürün sayfası soruları cevaplar, sepet toplamı gösterir. Bu rehberdeki kurallar Baymard Institute ve Nielsen Norman Group'un kullanıcı testlerine dayanır.

Kısaca

Bir e-ticaret sitesi, arka arkaya gelen sayfa türlerinden oluşur. Alışverişçi ana sayfadan ya da aramadan girer, listede karşılaştırır, ürün sayfasında karar verir. Sonra sepete ve ödemeye geçer, en son hesabına dönüp kargosunu sorar.

Bu yüzden e-ticaret sitesi tasarımına sayfa sayfa bakıyorum. Her sayfa türünün kendine ait bir sorusu var ve kurallar o soruya göre değişiyor. Ürün sayfasında doğru olan şey, sepette yanlış olabilir.

Bu rehber, e-ticaret üzerine yazdığım sayfaların çıkış noktası. Ödeme akışının ayrıntıları ödeme sayfası (checkout) tasarımı sayfasında, alan alan form kuralları ise form tasarımı sayfasında. Burada her sayfa türünün temel kurallarını ve nereden başlayacağınızı anlatıyorum.

Şekil: Bir alışverişçinin geçtiği sayfa türleri, sırasıyla. Her adım aşağıdaki bölümüne gider.

Kural listesi: sayfa türüne göre süzün

Aşağıdaki liste bu rehberdeki kuralların kısa hali. Kendi sitenize bakarken bir sayfa türü seçin ve yalnızca o sayfanın kurallarını kontrol edin.

Deneyin

Bu listede 22 kural var.

  • Ne sattığınızı ilk ekranda söyleyin.

    Ana sayfa

    Neden?

    NN/g'nin çalışmasında katılımcılar, aşırı kalabalık ve ne satıldığını göstermeyen ana sayfalarda zorlandı.

    Kaynak: NN/g, Harley 2018

  • Kategorileri ana menüde gösterin, tek bir “Alışveriş” linkine saklamayın.

    Ana sayfa

    Neden?

    Harley'ye göre ürünü beklediği yerde bulamayan kullanıcı, sitenin onu satmadığını varsayar.

    Kaynak: NN/g, Harley 2018

  • Arama bir link değil, yazılabilir bir kutu olsun.

    Ana sayfaArama

    Neden?

    Nielsen, useit.com'da ana sayfadaki arama linkini kutuyla değiştirince arama kullanımının %91 arttığını yazdı.

    Kaynak: Nielsen 2001

  • Her ürün kartında ad, fotoğraf, fiyat ve diğer renk seçenekleri görünsün.

    Kategori ve liste

    Neden?

    Harley'ye göre her liste kartında en az bu dört bilgi bulunmalı.

    Kaynak: NN/g, Harley 2018

  • Aynı filtrede birden fazla değer seçilebilsin.

    Kategori ve liste

    Neden?

    Seçenekleri birleştiremeyen katılımcılar filtreleri daha az kullandı. Sitelerin %14'ü buna izin vermiyor.

    Kaynak: Baymard 2025

  • Uygulanan filtreleri listenin üstünde toplayın.

    Kategori ve liste

    Neden?

    Baymard uygulanan filtrelerin bir özette görünmesini önerir. Sitelerin %20'si bu özeti göstermiyor.

    Kaynak: Baymard 2025

  • Fiyat, puan, çok satan ve en yeni sıralaması sunun.

    Kategori ve liste

    Neden?

    Baymard'ın testinde ürünleri tanımayan bir katılımcı “çok satanlar” sıralamasını seçti. Sitelerin %69'u dört sıralamanın hepsini sunmuyor.

    Kaynak: Baymard 2025

  • Özellik içeren aramaları anlayın: “kırmızı mont 38 beden”.

    Arama

    Neden?

    Sitelerin %39'u renk, beden ya da malzeme içeren aramalarda sorun yaşıyor. Özelliği görünür bir filtre olarak uygulamak kontrolü kullanıcıya verir.

    Kaynak: Baymard 2026

  • Ürün dışı aramalara cevap verin: “iade”, “kargo”.

    Arama

    Neden?

    Kullanıcı arama kutusunun tüm siteyi kapsamasını bekler. Sitelerin %66'sı bu aramalarda yardım içeriği yerine ürün listeler.

    Kaynak: Baymard 2026

  • “Sonuç bulunamadı” sayfası çıkmaz sokak olmasın.

    Arama

    Neden?

    Sitelerin yaklaşık yarısı, sonuçsuz bir aramadan sonra kullanıcıya devam edecek etkili bir yol sunmuyor.

    Kaynak: Baymard 2025

  • Beden seçimini açılır menüde değil, butonlarla gösterin.

    Ürün sayfasıMobil

    Neden?

    Bedenleri menüde saklamak, hangisinin stokta olduğunu anlamayı zorlaştırır. Sitelerin %57'si beden için buton kullanmıyor.

    Kaynak: Baymard 2026

  • Stok durumunu, renk ya da beden seçilince hemen gösterin.

    Ürün sayfası

    Neden?

    Kullanıcı ürünün tükendiğini sepete ekledikten sonra öğrenmemeli.

    Kaynak: NN/g, Sherwin 2019

  • Kargo ve iade bilgisini satın alma alanının yanına koyun.

    Ürün sayfası

    Neden?

    Kullanıcıların %60'ı iade bilgisini ürün sayfasında arıyor. Sitelerin %44'ü orada ne gösteriyor ne de bağlantı veriyor.

    Kaynak: Baymard 2026

  • Sepete ekleyince belirgin bir onay verin.

    Ürün sayfası

    Neden?

    Yetersiz geri bildirimde bazı kullanıcılar ürünü eklediğini sandı, bazıları tekrar tekrar ekledi. Sepet simgesindeki küçük sayı değişimi sık gözden kaçar.

    Kaynak: NN/g, Sherwin 2019; Schade 2014

  • Kargo dahil toplamı sepette gösterin.

    Sepet

    Neden?

    Ödeme sırasında terk edenlerin %40'ı ek maliyetlerin yüksekliğini, %12'si toplam tutarı baştan görememeyi neden olarak verdi.

    Kaynak: Baymard 2025

  • İndirim kodunu erken girilebilir ya da otomatik uygulanır yapın.

    Sepet

    Neden?

    NN/g'ye göre indirimi kullanmayı zorlaştırmak kullanıcının güvenini aşındırır.

    Kaynak: NN/g, Schade 2014

  • Misafir ödemeyi en belirgin seçenek yapın.

    Ödeme

    Neden?

    Ödemede terk edenlerin %18'i, sitenin hesap açmayı istemesini neden olarak verdi.

    Kaynak: Baymard 2025

  • Havale/EFT seçilince IBAN'ı, açıklamayı ve son ödeme zamanını tek ekranda verin.

    Ödeme

    Neden?

    Bu benim gözlemim. Kullanıcı bu bilgileri bankasının uygulamasına geçince aklında tutmak zorunda kalmamalı.

    Kaynak: Sezer'in gözlemi

  • Sipariş listesinde ürün ve sipariş bilgilerini katlanmış alanlara saklamayın.

    Hesap

    Neden?

    Bilgileri katlanmış alanda saklamak, testte hiç göstermemek kadar kötü sonuç verdi.

    Kaynak: Baymard 2026

  • Kargo takibini sitenin içinde gösterin.

    Hesap

    Neden?

    Takibi üçüncü taraf bir siteye bırakmak, kullanıcının bilgi ve gezinme ihtiyacını çoğu zaman karşılamıyor. Baymard'ın nicel çalışmasında sipariş takibi en önemli self servis özelliği çıktı.

    Kaynak: Baymard, Collins 2026

  • Ana menüyü ve arama önerilerini telefonda ayrıca test edin.

    Mobil

    Neden?

    Baymard'ın mobil değerlendirmesinde en zayıf alanlar ana menü, arama önerileri ve formlar oldu.

    Kaynak: Baymard, mobil araştırma

  • Dokunma hedeflerini parmağa göre büyük tutun.

    Mobil

    Neden?

    Bu benim gözlemim. Küçük bir ekranda yanlış dokunuş, yanlış bedenin ya da yanlış ürünün sepete girmesi demektir.

    Kaynak: Sezer'in gözlemi

Bir sayfa türü seçin, liste yalnızca o sayfaya ait kuralları göstersin. Her kuralın altındaki “Neden?” satırı gerekçeyi ve kaynağı açar. Bazı kurallar iki sayfa türünde birden görünür. Yüzdeler Baymard'ın çalışmalarından gelir.

Listedeki site oranları, Baymard'ın incelediği büyük sitelerde o kuralı uygulamayanların payıdır. Sepet ve ödeme kurallarındaki yüzdeler ise alışverişçilerin verdiği terk nedenleridir. İkisi de yalnızca o örneklemi anlatır, bütün pazarı temsil etmez.

Ana sayfa: yön verin

Ana sayfanın işi yön vermektir. NN/g'den Aurora Harley'nin 2018 tarihli rehberine göre ana sayfa, sitenin ne sattığını ve neden farklı olduğunu anlatmalıdır. Çalışmadaki katılımcılar, aşırı kalabalık ve ne satıldığını göstermeyen ana sayfalarda zorlandı.

Kategorileri ana menüde açıkça gösterin. Harley, kategorileri tek bir "Alışveriş" linkinin arkasına saklamamayı önerir. Ona göre ürünü beklediği yerde bulamayan kullanıcı, sitenin onu satmadığını varsayar.

Aynı rehber, bir ürünün birden fazla kategoride durabilmesini de önerir. Örneğin bir termos hem "Mutfak" hem "Kamp" altında bulunabilmelidir. Bu bir bilgi mimarisi kararıdır ve menü tasarımından önce verilir.

Ana sayfadaki arama, üstüne tıklanan bir link olarak kalmamalı. Yazılabilir bir kutu olmalı. Jakob Nielsen bunu 2001'de yazdı ve kendi sitesi useit.com'da linki kutuyla değiştirince arama kullanımının %91 arttığını aktardı. Ayrıca aramanın her sayfada bulunmasını önerdi, çünkü kullanıcının nerede kaybolacağını bilemezsiniz.

Audit'lerde sık gördüğüm tablo şu: ilk ekranı dönen kampanya görselleri kaplıyor, kategoriler ise aşağıda kalıyor. Kampanya önemli olabilir. Ama ilk kez gelen biri, önce burada ne satıldığını anlamak ister.

Kategori ve listeleme sayfası: karşılaştırtın

Liste sayfası karşılaştırma yeridir. Baymard'ın 2025 ürün listesi değerlendirmesinde masaüstü sitelerin %58'i, mobil sitelerin %78'i "zayıf" ile "vasat" arasında puan aldı.

Ürün kartı

Harley'nin rehberine göre liste kartında en az dört bilgi bulunmalı. Bunlar kısa ve anlamlı bir ad, karşılaştırmaya yetecek büyüklükte fotoğraf, diğer renklerin işareti ve fiyattır.

Baymard iki şey daha ekler. Bir ürünün renklerini ayrı kartlar yerine tek kartta toplayın. Sitelerin %42'si bunu yapmıyor. Farklı miktarlarda satılan ürünlerde birim fiyatı gösterin; sitelerin %67'si göstermiyor.

Alt kategoriler

NN/g, alt kategorileri liste sayfasının içine almayı ve filtrelerden ayrı, listenin üstünde göstermeyi önerir. Çalışmada en başarılı sayfalar alt kategorileri böyle gösteriyordu ve alt kategoriler daha kolay bulunuyordu. Seçenek sayısının karar süresine etkisi için Hick yasasına bakabilirsiniz.

Filtre ve sıralama

Baymard'a göre beş filtre, uygulanabildiği her sitede bulunmalı: fiyat, kullanıcı puanı, renk, beden ve marka. Sitelerin %51'i bunların hepsini sunmuyor. Aynı filtrede birden fazla değer seçilemediğinde katılımcılar filtreleri çok daha az ya da daha az etkili kullandı.

Uygulanan filtreleri listenin üstünde bir özet halinde gösterin. Sıralamada da dört seçenek bulunsun: fiyat, kullanıcı puanı, çok satan ve en yeni. Baymard'ın testinde hoparlörleri tanımayan bir katılımcı, ne seçeceğini bilmediği için "çok satan" sıralamasına geçti.

Yatay filtre çubuklarına dikkat edin. Baymard'a göre bu çubuklarda filtre seçenekleri varsayılan olarak görünmüyor ve bazı katılımcılar "Tüm filtreler" butonunu gözden kaçırdı. Bu düzen ancak sınırlı sayıda filtre türüyle işe yarıyor.

Arama: kullanıcının dilini anlayın

Alışverişçilerin yaklaşık yarısı ürün ararken önce arama kutusuna gider. Baymard'ın 2026 arama değerlendirmesinde katılımcıların kabaca yarısı böyle yaptı. Aynı değerlendirmede sitelerin %56'sı kullanıcıların arama ihtiyacını yeterince karşılayamadı.

Baymard aramaları sekiz türe ayırır. Tabloda her türün benim yazdığım Türkçe bir örneği ve o türde sorun yaşayan sitelerin oranı var.

Arama türüÖrnekSorunlu siteler
Tam ad ya da model kodu“KX-200 süpürge”%12
Ürün türü“mont”%20
Özellik“kırmızı mont 38 beden”%39
Kullanım amacı“anneler günü hediyesi”%43
Kısaltma ve sembol“tv” ve “televizyon”%54
Uyumluluk“KX-200 süpürge torbası”%44
Belirti“diz ağrısı”%37
Ürün dışı“iade”, “kargo ücreti”%66

En büyük açık ürün dışı aramalarda. Kullanıcı "iade" yazınca iade sayfasını bekler, siteler ise çoğu zaman ürün listeler. Baymard'a göre kullanıcılar arama kutusunun ürünlerle sınırlı kalmayıp bütün siteyi kapsamasını bekliyor.

Özellik içeren aramalarda Baymard, özelliği görünür bir filtre olarak uygulamayı önerir. "Kırmızı mont" aramasında "Renk: kırmızı" filtresi açık görünürse kullanıcı ne olduğunu anlar ve isterse kaldırır.

Türkçede bir de karakter konusu var. Kullanıcı "çanta" yerine "canta", "şemsiye" yerine "semsiye" yazabilir. Baymard tam ad aramalarında yazım hatalarını tolere etmeyi önerir. Türkçe karakter eşleştirmesi, bunun bizdeki karşılığı.

Sonuç bulunamadığında

Baymard'a göre sitelerin yaklaşık yarısı, sonuçsuz bir aramadan sonra kullanıcıya etkili bir devam yolu sunmuyor. Önerdiği yollar arasında ilgili kategoriler, sadeleştirilmiş alternatif aramalar ve destek iletişimi var. Yalnızca "arama ipuçları" yazmak yetmiyor. Bu ekranın nasıl kurulacağını boş durum tasarımı sayfasında ayrıca anlattım.

Nielsen'in 2001 tarihli bir uyarısı bugün de işe yarıyor: arama belirli bir bölümle sınırlıysa, varsayılan kapsam "tüm site" olmalı. Sınırlı arama sonuç vermediğinde, tüm sitede aratmanın belirgin bir yolu sunulmalı.

Ürün sayfası: soruları cevaplayın

Ürün sayfası, alışverişçinin bütün sorularını cevaplamalıdır. NN/g'den Katie Sherwin'in 2019 rehberi olmazsa olmazları şöyle sıralar.

  • Açıklayıcı bir ad ve tanınır fotoğraflar.
  • Büyütülebilir görsel.
  • Ürüne özel ücretleri içeren fiyat.
  • Anlaşılır seçenekler ve stok durumu.
  • Net geri bildirim veren bir sepete ekle butonu.
  • Kısa ve bilgi veren bir açıklama.

Baymard'ın 2026 ürün sayfası değerlendirmesinde masaüstü sitelerin yalnızca %48'i "iyi" ya da "makul" puan aldı. Mobilde bu oran %38. Sık görülen açıkları aşağıda topladım.

Seçenekler ve stok

Bedeni açılır menüde değil, butonlarla gösterin. Sitelerin %57'si beden seçimi için buton kullanmıyor. Baymard'a göre bedenleri bir menüde saklamak, hangi bedenin stokta olduğunu anlamayı zorlaştırıyor.

Sherwin'e göre stok durumu özellikle renk ya da bedene göre değişiyorsa açıkça görünmelidir. Kullanıcı ürünün tükendiğini sepete ekledikten sonra öğrenmemeli.

Görseller

Baymard'ın testlerinde kullanıcıların %42'si ürünün boyutunu fotoğraflardan anlamaya çalıştı. Buna karşın sitelerin %37'si, ürünü boyutu bilinen bir şeyin yanında gösteren fotoğraf sunmuyor. Baymard, ürünün yanına bir insan ya da boyutu bilinen bir nesne koymayı önerir. Örneğin bir sırt çantasının yanına bir dizüstü bilgisayar koyabilirsiniz.

Kargo, iade ve toplam tutar

Sherwin'in çalışmasında katılımcılar siteleri karşılaştırırken kargo ücretini de fiyata kattı. Bu yüzden kargo bilgisi ürün sayfasında görünmeli.

İade bilgisi de aynı yerde aranıyor. Baymard'a göre kullanıcıların %60'ı iade bilgisini ürün sayfasında arıyor, ama sitelerin %44'ü orada ne bilgi ne bağlantı veriyor. Sitelerin %67'si de satın alma alanının yanında toplam tutar tahmini göstermiyor.

Sepete ekleme

Sepete ekleyince belirgin bir onay verin. Sherwin'in testinde yetersiz geri bildirim yüzünden bazı kullanıcılar ürünü eklediğini sandı, bazıları da tekrar tekrar ekledi. NN/g'den Amy Schade da 2014'te, sepet simgesindeki küçük bir sayı değişiminin sık gözden kaçtığını yazmıştı.

Yorumlar

Sherwin, olumlu ve olumsuz yorumların ikisini de göstermeyi ve bir özet sunmayı önerir; birçok kullanıcı önce olumsuz yorumlara bakıyor. Baymard'a göre sitelerin %89'u olumsuz yorumlara cevap vermiyor. Bence şikâyete verilen sakin bir cevap, yıldız ortalamasından daha çok şey söyler.

Sepet: toplamı gösterin

Sepetin işi toplamı göstermek ve kullanıcının kararını rahatça değiştirmesine izin vermektir. Baymard'ın 50 çalışmadan derlediği ortalama sepet terk oranı %70,22.

Terklerin bir kısmı tasarımla ilgili değil. Baymard'a göre ABD'li alışverişçilerin %42'si sepeti yalnızca göz attığı için bıraktı. Ama ödemede terk edenlerin %40'ı ek maliyetlerin yüksekliğini, %12'si toplam tutarı baştan görememeyi neden olarak verdi.

Bu ikisini tasarım düzeltebilir: kargo dahil toplamı sepette gösterin. Nedenlerin tamamını ve ödeme adımlarını checkout sayfasında tablo halinde verdim, burada tekrar etmiyorum.

Ücretsiz kargo sınırınız varsa, sepette sınıra ne kadar kaldığını yazın. "Ücretsiz kargoya 86 TL kaldı" cümlesi, kullanıcıyı hesap yapmaktan kurtarır. Bu benim tasarım önerim, bir araştırma bulgusu değil.

İndirim kodunda Schade, ilan edilen indirimi hak eden kullanıcıya otomatik uygulamayı önerir. Kod gerekiyorsa, ödeme sayfasından çok önce kolayca girilebilmeli. Ona göre indirimi kullanmayı zorlaştırmak güveni aşındırır.

Adet değiştirmek, ürünü silmek ve sonraya bırakmak tek dokunuşla olmalı. Kullanıcı yanlışlıkla bir ürünü sildiyse, geri alma seçeneği görünmeli. Baymard'ın ürün sayfası değerlendirmesine göre sitelerin %89'unda "kaydet" özelliklerine ulaşmak ya da onları kullanmak zor.

Ödeme: sürpriz yapmayın

Ödeme adımını ayrı bir sayfada ayrıntılı anlattım, o yüzden burada kısa tutuyorum. Temel kural şu: ödeme sürpriz içermemeli. Zorunlu hesap ya da son adımda çıkan bir ücret, kullanıcının beklemediği şeylerdir.

  • Misafir ödemeyi en belirgin seçenek yapın. Baymard'ın listesinde terk edenlerin %18'i hesap açma isteğini neden olarak verdi. Bunun en ünlü örneği 300 milyon dolarlık buton hikayesidir.
  • Alan sayısını azaltın, hatayı da ilgili alanın yanında gösterin. Alan alan kurallar form tasarımı sayfasında.
  • Hata mesajı kullanıcıya ne yapacağını söylesin. "İşlem başarısız" yeterli değildir; hata mesajı yazma sayfasında örnekleri var.

Kullanıcıyı sona doğru sıkıştıran tasarım hileleri için dark pattern rehberine bakabilirsiniz.

Hesap ve sipariş takibi: sonrasını unutmayın

Satış ödeme ekranında bitmez. Kullanıcı birkaç gün sonra hesabına girip kargosunu, faturasını ya da iadesini arar. Baymard'ın nicel çalışmasında katılımcıların %50'si sipariş takibini en önemli self servis özelliği olarak seçti.

Sipariş listesi ve takip

Baymard'ın Eylül 2026'da yayımladığı hesap araştırmasına göre sipariş listesinde temel ürün ve sipariş bilgileri görünmelidir. Bu bilgileri katlanmış alanlara saklamak, testte hiç göstermemek kadar kötü sonuç verdi.

Takip sayfasında Baymard altı bilgi önerir: tahmini teslim tarihi, durum çubuğu, kargo firmasının adı, tıklanabilir takip numarası, gönderi geçmişi ve paketteki ürünlerin özeti. İncelenen sitelerin yalnızca %33'ü altısını birden veriyor, %25'i teslim tarihini güvenilir biçimde göstermiyor.

Takibi mümkünse sitenin içinde gösterin. Baymard'a göre kullanıcıyı üçüncü taraf takip sitesine gönderen siteler, çoğu zaman kullanıcının bilgi ve gezinme ihtiyacını karşılamıyor. Bu takip sayfaları sipariş detayına doğrudan bağlantı da vermiyordu.

İade ve giriş

Aynı araştırmaya göre katılımcılar bir ürünün iade edilebilir olup olmadığını anlamakta sık zorlandı. İade süresi dolunca "İade başlat" butonunu sessizce kaldırmak kafa karıştırdı. Butonu kaldırmak yerine sürenin dolduğunu ve kullanıcının ne yapabileceğini yazın.

Baymard'ın testlerinden birinde, giriş ekranındaki katılımcılar şifre kurallarıyla ilgili hiçbir yönlendirme görmedi. Yazdıkları şifreyi görme imkânları da yoktu. Katılımcıların %60'ı isteğe bağlı iki adımlı doğrulamayı olumlu karşıladı. Ama güvenlik adımları ödemeyi ve hesap yönetimini engellememeli.

Mobil: her sayfayı telefonda yeniden düşünün

Mobil, bütün sayfa türlerinin üstünde duran bir katmandır. Baymard'a göre mobil, birçok e-ticaret sitesinde çoğu zaman trafiğin %50'sini oluşturuyor. Ama bazı sitelerde mobil sürüm, masaüstünün yarısından daha az ziyaretçiyi müşteriye çeviriyor.

Baymard'ın 138 büyük mobil siteyi kapsayan değerlendirmesinde hiçbir site genel olarak "iyi" puan almadı, %62'si "vasat" ya da daha kötü çıktı. En zayıf alanlar ana menü, arama önerileri, formlar ve site genelindeki ortak öğelerdi.

Küçük ekranda kullanıcı sayfanın genelini göremez. Baymard'ın deyişiyle en iyi mobil kalıplar bile birer uzlaşmadır. Bu yüzden masaüstü tasarımı daraltmak yerine her sayfa türünü telefonda yeniden kurarım.

  • Filtreleri tam ekran bir panelde açın ve uygulanan filtre sayısını butonun üstünde gösterin.
  • Sepete ekle butonunu başparmağın uzandığı yere koyun. Hedefin boyutu ve uzaklığı için Fitts yasası ve dokunma alanı sayfalarına bakın.
  • Formlarda doğru klavyeyi açın: telefon alanında rakam klavyesi, e-postada @ işaretli klavye.
  • Kendi telefonunuzda, mobil veriyle, gerçek bir sipariş verin. Benim deneyimimde masaüstünde görünmeyen takılmalar en çok burada çıkıyor.

Uygulamanız da varsa, uygulama ekranlarına özgü konular için mobil uygulama tasarımı rehberine göz atın.

Türkiye'de e-ticarete özgü noktalar

Bu bölümdeki her şey kendi audit'lerimden gelen genel gözlemler. Bir oran ya da istatistik vermiyorum, çünkü bu konularda açıp okuduğum güvenilir bir Türkçe kaynak yok.

Taksit. Taksit seçenekleri ürün sayfasında görünmüyorsa, kullanıcı bunu çoğu zaman ödeme adımında kartını girdikten sonra öğrenir. Ürün sayfasında "taksit seçeneklerini gör" bağlantısı ve kısa bir tablo bu soruyu erken cevaplar. Tablo, kartın bankasına göre değişiyorsa bunu açıkça yazmalı.

Kargo ücreti. Ücretsiz kargo sınırı çoğu zaman ana sayfanın üstündeki bir şeritte yazar, sepette ise unutulur. Sınırı ürün sayfasında ve sepette tekrar edin, kalan tutarı da gösterin. Kargo firması seçimi varsa ücret farkını seçeneğin yanında yazın.

Havale/EFT. Bu seçenekte kullanıcı siteden çıkıp bankasının uygulamasına geçer. IBAN'ı kopyalama butonuyla, alıcı adını, açıklamaya yazılacak sipariş numarasını ve son ödeme zamanını tek ekranda verin. Aynı bilgileri onay e-postasında da tekrarlayın, çünkü kullanıcı ekrana geri dönemeyebilir.

Nereden başlamalı

Bütün kuralları aynı anda uygulamaya çalışmayın. Önce analitikte hangi sayfa türünde en çok kullanıcı kaybettiğinize bakın: listeden ürüne geçiş mi düşük, sepetten ödemeye mi?

  1. En çok kaybettiğiniz adımı seçin. Kural filtresinde o sayfa türünü açıp tek tek kontrol edin.

  2. Telefonda kendiniz deneyin. Gerçek bir ürün arayın, filtreleyin, sepete ekleyin ve ödeyin. Takıldığınız her yeri not edin.

  3. Kullanıcıyla doğrulayın. Birkaç kişilik bir kullanılabilirlik testi, sizin göremediğiniz takılmaları gösterir.

  4. Değişikliği ölçün. Trafiğiniz yetiyorsa iki sürümü karşılaştırın. Örneklem büyüklüğünü A/B test hesaplayıcısıyla önceden hesaplayın.

Bunu dışarıdan bir gözle yaptırmak isterseniz bir audit doğru başlangıçtır. Nasıl yapıldığını UX audit rehberinde anlattım.

Benim notum

E-ticaret audit'lerinde en sık gördüğüm sorun, ekibin ana sayfaya fazla, liste sayfasına az emek vermesidir. Ana sayfa toplantılarda konuşulur, liste sayfası ise yıllarca aynı kalır. Oysa gördüğüm kadarıyla alışverişçi asıl kararını listede, filtre ve fotoğraf arasında veriyor.

İkinci sırada sürpriz maliyet gelir. Kargo ücreti, taksit farkı ya da hizmet bedeli son adımda ortaya çıkınca kullanıcı bütün siteye şüpheyle bakmaya başlar. Bu sorunu bir tasarım değişikliğinden çok, bilgiyi erken söyleme kararı çözer.

Bir de hesap sayfası var. Ekipler satıştan sonraki ekranları çoğu zaman en son ve en hızlı tasarlar. Bence "kargom nerede?" sorusuna verilen cevap, bir sonraki siparişi de etkiliyor.

Sık sorulanlar

E-ticaret UX ile e-ticaret sitesi tasarımı aynı şey mi?

Büyük ölçüde örtüşürler. Site tasarımı görünüşü de kapsar. E-ticaret UX ise alışverişçinin ürünü bulup seçip ödeyebilmesine ve siparişini takip edebilmesine odaklanır.

E-ticaret sitesinde UX'e nereden başlamalıyım?

Analitikte en çok kullanıcı kaybettiğiniz sayfa türünden başlayın. Çoğu sitede bu liste sayfası, ürün sayfası ya da sepettir. O sayfanın kurallarını kontrol edin, sonra kullanıcıyla doğrulayın.

Bu kurallar küçük bir site için de geçerli mi?

Evet. Site oranları Baymard'ın incelediği büyük sitelerden gelir, ama kuralların arkasındaki kullanıcı davranışı aynıdır. Küçük bir katalogda filtre ve arama daha basit olabilir, toplam tutar ve stok bilgisi yine önemlidir.

Ödeme sayfasının kuralları neden burada ayrıntılı değil?

Ödeme akışı kendi başına bir sayfa kadar konu içeriyor. Misafir ödeme, adım göstergesi ve hata yönetimi gibi ayrıntıları ödeme sayfası tasarımı kalıbında ayrıca anlattım.

Kaynaklar (12)
  1. Aurora Harley, UX Guidelines for Ecommerce Homepages, Category Pages, and Product Listing Pages, Nielsen Norman Group. 12 Ağustos 2018; ana sayfa, kategori ve liste kuralları
  2. Katie Sherwin, UX Guidelines for Ecommerce Product Pages, Nielsen Norman Group. 24 Kasım 2019; ürün sayfasının olmazsa olmazları
  3. Amy Schade, Ecommerce UX: 3 Design Trends to Follow and 3 to Avoid, Nielsen Norman Group. 26 Ocak 2014; sepete ekleme onayı ve indirim kodları
  4. Jakob Nielsen, Search: Visible and Simple, Nielsen Norman Group. 12 Mayıs 2001; arama kutusu ve kapsam, %91 artış
  5. Mark Crowley, Product List UX 2025: 8 Common Pitfalls & Best Practices, Baymard Institute. güncelleme 9 Eylül 2025; liste, filtre ve sıralama oranları
  6. Edward Scott, Ecommerce Search UX 2026: 8 Search "Query Types" UX Best Practices, Baymard Institute. güncelleme 29 Nisan 2026; sekiz arama türü ve oranlar
  7. Sonia Sousa, Search UX: 5 Proven Strategies for Improving "No Results" Pages, Baymard Institute. güncelleme 18 Şubat 2025; sonuçsuz arama sonrası devam yolları
  8. Edward Scott, Product Page UX 2026: 10 Pitfalls and Best Practices, Baymard Institute. güncelleme 18 Mart 2026; ürün sayfası oranları
  9. Baymard Institute, 50 Cart Abandonment Rate Statistics 2026. güncelleme 22 Eylül 2025; %70,22 ortalama, terk nedenleri, %42 göz atma
  10. Sally Collins, Accounts & Self-Service UX Research Update and Expansion: 3 Key Takeaways, Baymard Institute. 9 Eylül 2026; sipariş listesi, iade, giriş, iki adımlı doğrulama
  11. Sally Collins, Always Provide 6 Key Order-Tracking Details on the Ecommerce Site, Baymard Institute. güncelleme 5 Mayıs 2026; altı takip bilgisi, %50 nicel bulgu, üçüncü taraf takip sayfaları
  12. Baymard Institute, Mobile E-Commerce UX. açılış 3 Kasım 2026; 138 mobil site değerlendirmesi