Web Sitesi Sipariş Özeti Ekranı: Neyi Nasıl Göstermeli?
Sipariş özeti, kullanıcının "ne alıyorum ve ne ödeyeceğim" sorusunu yanıtladığı yerdir. Bu soru net yanıtlanmadığında ödeme adımındaki tereddüt doğrudan terke dönüşür.
Bu rehberde özet ekranında nelerin gösterileceğini, yerleşimin nasıl kurulacağını ve mobil düzeni ele alıyoruz. Tasarımın sitenize uyarlanması için Weblike web sitesi tasarımı ekibimizden destek alabilirsiniz.
Web Sitesi Sipariş Özeti Ekranı Nedir?
web sitesi sipariş özeti ekranı, satın alınacak ürünlerin ve toplam tutarın bir arada gösterildiği bölümdür. Ödeme akışı boyunca görünür kalması beklenir.
Bu ekran bir liste değildir. Kullanıcının kararını doğruladığı son kontrol noktasıdır.
Hangi Bilgiler Gösterilmeli?
Özet, karar için gereken bilgiyi taşımalı ve fazlasını taşımamalıdır. Kalabalık özet okunmaz.
- Ürün: Görsel, ad ve varyant.
- Adet: Değiştirilebilir alan.
- Ara toplam: Ürünlerin tutarı.
- Ek kalemler: Kargo, indirim, vergi.
Ürün Görseli
Küçük bir ürün görseli, metinden daha hızlı tanınır. Kullanıcı doğru ürünü seçtiğini bir bakışta doğrular.
Görsel küçük ama tanınabilir olmalıdır. Çok küçük görseller işlevsizdir.
Varyant Bilgisi
Renk, beden ve ölçü bilgisi mutlaka gösterilmelidir. Yanlış varyant en sık iade nedenlerindendir.
Bu bilgi ürün adının altında ayrı satırda verilmelidir. Ad içine sıkıştırmak okunabilirliği düşürür.
Adet Değiştirme
Özet üzerinden adet değiştirilebilmelidir. Sepete geri dönmek zorunda kalmak akışı bozar.
Değişiklik sonrası tutar anında güncellenmelidir. Gecikme belirsizlik üretir.
Ürün Çıkarma
Kullanıcı ürünü özetten çıkarabilmelidir. Ancak bu işlem yanlışlıkla yapılmamalıdır.
Geri alma seçeneği sunulabilir. Onay sorusu yerine geri alma daha akıcıdır.
Tutar Dökümü
Toplam tutarın neden oluştuğu açıkça gösterilmelidir. Tek bir rakam güven vermez.
Ara toplam, kargo, indirim ve varsa vergi ayrı satırlarda yer almalıdır.
Kargo Satırı
Kargo ücreti hesaplanmadan önce "hesaplanacak" ifadesi kullanılabilir. Boş bırakmak kafa karıştırır.
Ücretsiz kargo durumu belirgin gösterilmelidir. Bu bilgi olumlu bir sinyal üretir.
Ücretsiz Kargo Eşiği
Eşiğe yaklaşan sepetlerde kalan tutar gösterilebilir. Bu bilgi sepet büyütmeye teşvik eder.
Mesaj baskıcı olmamalıdır. Bilgilendirici bir ton tercih edilir.
İndirim Gösterimi
Uygulanan indirim ayrı satırda ve negatif değer olarak gösterilmelidir. Kullanıcı kazancını görmelidir.
İndirimin kaynağı da belirtilmelidir. Hangi kuponun uygulandığı yazılmalıdır.
Kupon Alanı
Kupon kodu alanı özet içinde yer alabilir. Ancak çok belirgin olmamalıdır.
Büyük bir kupon alanı, kuponu olmayan kullanıcıyı kod aramaya iter ve akışı böler.
Toplam Vurgusu
Ödenecek nihai tutar görsel olarak öne çıkarılmalıdır. Diğer satırlardan ayrışmalıdır.
Punto büyüklüğü ve kalınlık bu ayrımı sağlar. Renk tek başına yeterli değildir.
Yerleşim
Masaüstünde özet genellikle sağ sütunda yer alır. Form sol tarafta kalır.
Bu düzen alışılmıştır ve tarama alışkanlığına uygundur. Değiştirmek için gerekçe gerekir.
Yapışkan Davranış
Form uzunsa özet kaydırma boyunca görünür kalabilir. Bu davranış güven verir.
Yapışkan alan ekranı kaplamamalıdır. Küçük ekranlarda devre dışı bırakılabilir.
Mobil Düzen
Mobilde özet formun üstünde ya da katlanabilir bir bölümde sunulur. Her ikisi de geçerlidir.
Katlanabilir yapıda toplam tutar kapalıyken de görünmelidir. Mobil öncelikli tasarımı mobil öncelikli tasarım yazısında ele aldık.
Katlanabilir Özet
Mobilde tüm ürünleri listelemek yer kaplar. Katlanabilir yapı bu sorunu çözer.
Kapalı haldeyken ürün sayısı ve toplam gösterilmelidir. Açma bağlantısı net olmalıdır.
Uzun Sepetler
Çok ürünlü sepetlerde özet uzar. İlk birkaç ürün gösterilip kalanı gizlenebilir.
Gizlenen ürün sayısı belirtilmelidir. Kullanıcı tamamını görebilmelidir.
Teslimat Bilgisi
Seçilen teslimat yöntemi ve tahmini tarih özette gösterilebilir. Bu bilgi kararı destekler.
Teslimat tarihi gösterimini teslimat tarihi gösterimi yazısında inceleyebilirsiniz.
Stok Uyarısı
Sepetteki bir ürün tükenmişse özet üzerinde uyarı verilmelidir. Ödeme anında çıkan hata güven kaybı üretir.
Stok uyarı mesajlarını stok uyarı mesajı yazısında ele aldık. Uyarı erken verilmelidir.
Düzenleme Bağlantısı
Özetten sepete dönüş bağlantısı bulunmalıdır. Kullanıcı değişiklik yapmak isteyebilir.
Dönüş sonrası akışa kaldığı yerden devam edilmelidir. Baştan başlatmak sinir bozucudur.
Güven Unsurları
İade koşulu ve güvenli ödeme bilgisi özetin yakınında yer alabilir. Bu bilgiler son tereddüdü azaltır.
Kısa ifadeler tercih edilmelidir. Uzun metin okunmaz.
Onay Ekranı Farkı
Sipariş özeti ile onay ekranı farklıdır. Özet karar öncesinde, onay işlem sonrasında gösterilir.
Onay ekranı tasarımını onay ekranı tasarımı yazısında bulabilirsiniz. İçerikleri benzer ama amaçları ayrıdır.
Sipariş Notu
Kullanıcının sipariş notu bırakabileceği alan özet yakınında olabilir. Bu alan isteğe bağlı tutulmalıdır.
Sipariş notu alanını sipariş notu alanı yazısında ele aldık. Alan büyük olmamalıdır.
Para Birimi
Tutarlar tek bir para biriminde ve tutarlı biçimde gösterilmelidir. Biçim değişikliği kafa karıştırır.
Para birimi simgesi her tutarın yanında yer almalıdır. Yalnızca toplamda göstermek yetersizdir.
Yuvarlama
Kuruş hesapları tutarlı yuvarlanmalıdır. Satırların toplamı ile gösterilen toplam birebir uyuşmalıdır.
Uyuşmazlık küçük görünse de güveni zedeler. Hesaplama tek noktada yapılmalıdır.
Erişilebilirlik
Özet tablo yapısında sunuluyorsa başlıklar doğru tanımlanmalıdır. Ekran okuyucu satırları anlamlı okumalıdır.
Tutar güncellemeleri de duyurulmalıdır. Sessiz değişim fark edilmez.
Sipariş özeti ekranında kontrol listesi
web sitesi sipariş özeti ekranı tasarlanırken dört başlık karara bağlanır. Bu kararlar ekranın hem bilgi hem güven işlevini belirler.
Gösterilecek alanlar, tutar dökümü, mobil düzen ve düzenleme imkânı bu başlıklardır. web sitesi sipariş özeti ekranı bu dördü netleştiğinde tereddüdü ortadan kaldırır.
Test Edilmesi
Özet farklı sepet durumlarıyla test edilmelidir. Tek ürün, çok ürün ve indirimli sepet farklı davranır.
Uzun ürün adları ve çok varyantlı ürünler de denenmelidir. Taşma sorunları bu testlerde görünür.
Hız ve Performans
Özet alanı her tutar değişiminde yeniden hesaplanır. Bu hesaplamanın hızlı olması akışın akıcılığını belirler.
Sayfa hızını Google PageSpeed Insights üzerinden ölçebilir, ödeme akışındaki gecikmeleri ayrı değerlendirebilirsiniz. Ödeme adımı sitenin en hızlı bölümü olmalıdır.
Arama Görünürlüğü
Sepet ve ödeme sayfaları arama sonuçlarında yer almamalıdır. Bu sayfalar dizine kapatılır.
Dizinleme durumunu Google Search Console üzerinden doğrulayabilirsiniz. Yanlışlıkla dizine girmiş ödeme sayfaları güvenlik ve gizlilik sorunu üretir.
Ürün görseli, adı, varyantı, adedi ve tutar dökümü. Fazlası okunabilirliği düşürür.
Mutlaka. Yanlış varyant en sık iade nedenlerindendir ve özet son doğrulama noktasıdır.
Evet. Sepete geri dönmek zorunda kalmak akışı bozar ve terk riskini artırır.
Ara toplam, kargo ve indirim ayrı satırlarda; ödenecek tutar görsel olarak öne çıkarılmalıdır.
Hayır. Büyük kupon alanı, kuponu olmayan kullanıcıyı kod aramaya iter ve akışı böler.
Katlanabilir bölüm olarak. Kapalıyken bile ürün sayısı ve toplam tutar görünmelidir.
Masaüstünde form uzunsa yapışkan davranış güven verir. Küçük ekranlarda devre dışı bırakılabilir.
Özet üzerinde, mümkün olan en erken anda. Ödeme anında çıkan hata güven kaybı üretir.
Hesaplama tek noktada yapılmalıdır. Küçük bir kuruş farkı bile güveni zedeler.
Sipariş özeti, ödeme akışında kullanıcının en çok baktığı ve en az düşünerek okuduğu alandır; bu yüzden gösterilen her satırın bir sorusu yanıtlaması gerekir. Tutarın nasıl oluştuğunu açıkça döken ve değişikliğe izin veren bir özet, ödeme adımındaki tereddüdün büyük bölümünü daha oluşmadan ortadan kaldırır.