Optimize Edilmiş Dönüşüm için Ürün Sayfası Örnekleri: Kılavuzla Tamamlayın

Yayınlanan: 2022-03-01

Şunu hayal edin: Gece geç oldu ve kendinizi internette buldunuz. Tüm hafta boyunca sizi rahatsız eden soruna mükemmel bir çözüm arıyorsunuz. Daha önce burada bulundun. Kambur, başın ellerinde ve uyku kapını çalıyor. Tüm umutlar kaybolmadan hemen önce, Eureka! Sonunda umut verici bir arama sonucu elde edersiniz. Nefesinizi tutarak tıklayın ve…

Hiçbir şey olmuyor. Sonsuzluktan sonra, metin duvarları ve tek, küçük pikselli bir ürün görüntüsü ile beyaz bir ekran görüntülenmeye başlar. Çevirmeli ağ çağından geriye dönüşler zihninizi dolduruyor. Sayfayı bir çare bulmak için tararsınız, ancak fiyat bilgisi, müşteri incelemesi ve daha fazla bilgi için aramanızı söyleyen birden fazla telefon numarası ile karşılaşırsınız. Çalışan bir bağlantı bilgisi değil ve bunların tek sosyal kanıtı, size bu ürünün "Purrrfect!" olduğunu söyleyen bir kedinin animasyonu. Acı verici bir şekilde açık: Bir web sitesi mezarlığına rastladınız.

Bu kabusun mağazanız olmasına izin vermeyin! En iyi kullanıcı deneyimleri, kullanıcıyı virüsten koruma yazılımlarını çalıştırmaları gerekip gerekmediğini merak eden sitelerden ziyade, ilgi çekici ve düzenli olarak güncellenen web sitelerinden gelir. İster yeni başlıyor olun, ister e-ticaret mağazanıza bir güncelleme vermek istiyorsanız, yardım etmek için buradayız!

Bu yazıda, her ürün sayfasının sahip olması gereken minimum kriterlerin yanı sıra kaçınılması gereken bazı tasarım seçeneklerini gözden geçireceğiz. Hatta bir sonraki projenize ilham vermenize yardımcı olmak için favori ürün sayfalarımızdan oluşan bir koleksiyonu hızlı bir artılar ve eksiler listesiyle bir araya getirdik!

Mükemmel Ürün Sayfası Oluşturma

Ürün sayfanızın amacı, ürününüzü satmaktır! Ancak aynı zamanda ziyaretçilerinizin web sitenizin onlar için ne yapmasını beklediğini anlamakla da ilgilidir. ABD'de ortalama bir insan günde yedi saat 50 dakika internette vakit geçiriyor. Her gün farklı web sitelerine bakmak için çok fazla zaman harcadıklarından, sitenizi ziyaret eden insanlar deneyimlerine birinci sınıf bir şarap garsonunun bir şişe şarabı eleştirdiği gibi davranacaktır. Ziyaretçileriniz, iyi bir deneyim ile kötü bir deneyim arasındaki nüansları anlama konusunda oldukça yeteneklidir.

Ürün sayfanız yalnızca ziyaretçilerinizin beklediği temel bilgileri içermemeli, aynı zamanda sorunsuz bir kullanıcı deneyimi sağlamalı ve aynı zamanda geri gelmelerini sağlayacak kendi benzersiz yeteneğinizi de içermelidir.

Kullanıcılarınızın beklentilerini karşılamak, ne aradıklarından emin değilseniz, sıkı bir ipte yürümek gibi hissedebilir. Bu nedenle, kullanıcılarla etkileşim kurmanıza ve sonuçta dönüşüm oranınızı artırmanıza yardımcı olacak ürün sayfanızı tasarlamak için en iyi ve en kötü uygulamaları özetleyen bir kılavuz hazırladık.

Ürün Sayfası En İyi Uygulamaları

Harika ürün sayfaları oluşturmak için harcanan çok şey var, bu nedenle, zevkli bir şekilde kullanıldığında ziyaretçinizin deneyimini geliştirmek için en önemli bulduğumuz ürün sayfası özellikleri ve konseptlerinin bir listesini oluşturduk.

URL'yi temizle
büyüleyici isim
Şeffaf ve önceden fiyat bilgisi
Yüksek görünürlüklü Harekete Geçirici Mesajlar (CTA'lar)
Öğe kullanılabilirliği
Farklı ürün seçenekleri
Çoklu kamera açıları, durumları ve modelleri ile net ürün resimleri
Benzer ürünleri karşılaştırma imkanı
"Favorilere/istek listesine ekle" düğmesi
Yüksek kaliteli, web için optimize edilmiş resimler, videolar ve gifler
SSS bölümü
Yakınlaştırma işlevi
Arttırılmış gerçeklik
360 ° görünüm
Canlı ürün açıklamaları
Canlı sohbet özelliği
Hikaye anlatımı için ürün ve yaşam tarzı medyasının bir karışımı

Sorumlu tasarım
İlgili "ilgili ürünler" bölümü
"Üst satış" bölümü
Ürün miktarını artırma yeteneği
Beden/sığdır kılavuzu (varsa)
Sorunsuz gezinme
Sezgisel filtre seçenekleri
Yapışkan "Başa Dön" düğmesi
Farklı özelliklere sahip kullanıcılar için son derece erişilebilir
Peşin gönderim ve iade politikaları
Yapışkan "Sepete Ekle" veya "Şimdi Satın Al" düğmeleri
Sosyal kanıt
Genişletilmiş ayrıntılar (malzemeler, teknik özellikler, boyutlar, ağırlık, özel özellikler, vb.)
fazlalık yok
Geniş ve ilginç yazı tipi
Hızlı yükleme süreleri
Çapraz tarayıcı işlevi
Karanlık mod dostu

Bir uyarı - özellik kaymasına karşı dikkatli olun. Bu, bir sayfanın çok fazla gereksiz özelliği üstlendiği ve genel kullanıcı deneyimine zarar verdiği zamandır. Artırılmış gerçeklik özelliği, kürdan satan bir şirkete yardımcı olmayabilir, ancak büyük mobilya satan bir şirkete yardımcı olabilir. Sayfanıza güneşin altındaki her şeyi eklemeden hangi özelliklerin ürününüzü daha iyi sergilemenize yardımcı olabileceğini değerlendirmek için zaman ayırdığınızdan emin olun.

Ürün Sayfası En Kötü Uygulamaları

En iyi uygulamaları sitenize uygulamaya başladığınızda, aşağıda listelenen en kötü uygulamalardan bazılarına dikkat etmelisiniz. Bu kavramların ciddiyeti, normal metin için köprü mavi yazı tipi rengini kullanan kullanıcıların kafasını karıştırmaktan, istenmeyen öğeleri bir kişinin alışveriş sepetine gizlice sokmak gibi daha kötü niyetli bir şeye kadar değişebilir.

çok fazla renk
katlanmış fiyat
tutarsız tasarım
Yem ve geçiş taktikleri
Ek ücretleri gizle
Çok uzun/çok kısa veya kopyalanmış açıklama
Tutarsız ürün adları
yanlış garantiler
Alakalı olmayan ürünleri tavsiye edin
Eylem çağrısını gömmek

Küçük ve düşük kaliteli resimler, videolar, gifler
Olumsuz konuşma/sosyal kanıt
Yinelenen pop-up'lar
onaylıyor
Ürünleri sepetinize gizlice sokmak
net olmayan gezinme
Kompakt yazı tipi
Meşgul negatif alan
SSS yok
Sosyal kanıt yok

En İyi 25 Ürün Sayfası

Oluk Ömrü

Sevdiklerimiz

Yüzük ölçünüzü öğrenmek için çok bilgilendirici ve kolay bir çözüm.
Büyük sosyal baskı (Instragram beslemesi, incelemeler)
Açıklama kolayca sindirilebilir.

Neyi Sevmedik

Fiyat belli değil
Masaüstünde yapışkan bir "Şimdi Satın Al" düğmesi kullanılabilir
Herhangi bir yukarı satış tekniği kullanmaz

Yeti

Sevdiklerimiz

Size satın alabileceğiniz en yakın konumu göstereceği temiz özellik
Benzersiz tipografi
tutarlı markalaşma

Neyi Sevmedik

Fotoğraf galerisi altında büyük yararsız boşluk
İğrenç derecede büyük, yapışkan "şimdi satın al" bölümü
Video veya gif kullanımı yok

basit insan

Sevdiklerimiz

Ekranın sol tarafında harika gezinme aracı
İnceleme bölümü, daha az gayrimenkul kullanarak yukarı ve aşağı genişlemek yerine sola ve sağa gider
Özellikleri ve hikayeyi satmak için görüntülerin harika kullanımı

Neyi Sevmedik

Yapışkan "şimdi satın al" düğmesi yok
Bir çöp sistemi/ekosistemde uzmanlaştıklarında ek satış bölümü yok
CTA, başlıklar, incelemeler ve resimler/rozetler için renkler karışmadı.

güverteli

Sevdiklerimiz

Sayfa, büyük sosyal kanıtlarla alıcılar arasında bir topluluk duygusunu kolaylaştırır
Çok sayıda CTA
Tipografi, markanın sesine uygun simgelerle uyum sağlar

Neyi Sevmedik

Ürün resimleri ekranın üst kısmına daha iyi entegre edilebilirdi
SSS tarafından büyük beyaz boşluk
Herhangi bir yapışkan başlık, "Şimdi Satın Al" düğmesi veya en üste atlamanın bir yolu yok

nanoyaprak

Sevdiklerimiz

Yapışkan başlık, gezinmeyi ve aşağı kaydırdığınızda da gizlenen "Mağaza" düğmesini içerir.
Ekranın üst kısmında harika kaydırma animasyonu
Görüntüler aracılığıyla mükemmel hikaye oluşturma
Sekmeleri değiştirdiğinizde sayfa başlığı değişir

Neyi Sevmedik

Dinamik Parlayan Efekt bölümünde bir video eksik
Video, pencere açılmadan oynatılabilirdi
Katlamanın altında büyük, kullanılmayan boşluk

Espri

Sevdiklerimiz

Satış, satış ve hatta daha fazla satış!!
Renklerin harika kullanımı
Hareketsiz görüntüler yerine giflerin iyi kullanımı

Neyi Sevmedik

tutarsız fiyat
İnceleme bölümü sizi ürün sayfasından uzaklaştırır ve sosyal kanıttan yoksundur
Gizli garanti/iade/nakliye politikası, daha fazla okumak için bağlantıları kullanabilir

DBMarka

Sevdiklerimiz

Ürün resimlerine yansıyan harika özelleştirme seçenekleri.
Markanın özür dilemeyen aşındırıcı sesiyle anlatılan fantastik hikaye anlatımı.
Yüksek çözünürlüklü fotoğraflarla kaydırma animasyonu, kullanıcıyı meşgul eder

Sevmediklerimiz1200

Çok sınırlı harekete geçirici mesaj
Artan satış veya çapraz satış yok, yalnızca bir adet düşündürücü satış
Yapışkan başlık veya yapışkan "Sepete Ekle" düğmesi yok

Vessi

Sevdiklerimiz

Mükemmel animasyonlar, özellikle patlayan ayakkabı animasyonu
"Sepete Ekle" düğmesi ile güzel yapışkan başlık
Genişletebileceğiniz harika inceleme bölümü

Neyi Sevmedik

Instagram beslemesi etkileşimli olabilirdi
Resimler, tıklama yerine fareyle üzerine gelindiğinde yakınlaştırılabilirdi
Yapışkan başlık, rengi değiştirmenize izin verebilirdi

Marucci

Sevdiklerimiz

Seçtiğiniz varyanta göre ürün resmini güncelleyen kapsamlı özelleştirme
Ürün resmi ekranın üst kısmına yapışıyor
Minimalist tasarım, yalnızca ihtiyacınız olanı sunar

Neyi Sevmedik

Yapışkan "Şimdi Satın Al" düğmesi yok
Güven simgeleri ve daha fazla sosyal kanıt kullanabilirdi
Renk ve genel yaratıcılıktan yoksundur

balık avı

Sevdiklerimiz

Etkileşimli ve bilgilendirici “Özel Özellikler” bölümü
Yukarı satış ve çapraz satış bölümü oluşturun
Navigasyon ve "Şimdi Satın Al" düğmesi ile mükemmel yapışkan başlık

Neyi Sevmedik

Ekstra uzun inceleme bölümü
Ürün resimleri, çeşitler arasında daha benzersiz olabilirdi
Sayfanın eksik olduğu markanın hikayesini genişletmek için kullanılabilecek büyük boş yan sütunlar

Bant Olufsen

Sevdiklerimiz

Uzmanlardan sosyal kanıt
Yapışkan düğmelerin ve başlıkların harika kullanımı, sayfa boyunca ilgili bölümlerde harika satışların kullanımı
Harika ürün fotoğrafları ve videoları

Neyi Sevmedik

H etiketlerini daha iyi biçimlendirebilir
"Sayfada" SSS yok
Müşteri yorumu yok

derici

Sevdiklerimiz

Mükemmel ürün resimleri
"Araçlar", "Özellikler" ve "Özellikler" bölümü etkileşimli, sezgisel ve bilgilendiricidir.
Instagram akışlarında @leathermantools ile topluluk etkileşimi

Neyi Sevmedik

İnceleme bölümü büyük, ayrıca öne çıkan inceleme bölümü gereksiz
Hikaye anlatılmıyor
Yapışkan hiçbir şey yok (sohbet dışında)

soda akışı

Sevdiklerimiz

Show'un perakende ortakları
Ürün açıklaması sadece bir metin paragrafı değil, kolayca sindirilebilir noktalara bölünmüştür.
karşılaştırma bölümü güzel

Neyi Sevmedik

Aşırı beyaz boşluk
Kullanıcı itirazı yok (hikaye yok, fayda yok
Organize olmayan / buna akış yok

Herman Miller

Sevdiklerimiz

Tipografinin kullanıma hazır kullanımı
Videonun harika kullanımı
Harika resimlerle birlikte çok sayıda ayrıntılı bilgi

Neyi Sevmedik

Ürün ayrıntıları açılır menüsü otomatik olarak açılır ve büyük bir düz metin duvarı oluşturur
Tutarsız metin hizalaması
Ürün Soru-Cevap bölümü ve inceleme bölümü bir açılır menü olmalıdır

HURU

Sevdiklerimiz

İyi satış kullanımı
Ürünü bilgilendirici görseller ve açıklamalarla iyi bir şekilde açıklayın
Güzel sepet işlevi, alt kısımdaki yapışkan sepete ekle, sayfada kalırken sepete eklemenizi sağlar

Neyi Sevmedik

İnceleme bölümü daha düşük olmalı, müşteriler daha düşük olmaya alışkın
CTA'nın rengi yok ama harika bir animasyonları var
İnceleme bölümü küçültülebilirdi

JBL

Sevdiklerimiz

Şimdiye kadar gördüğümüz en iyi yapışkan ödeme
Marka renklerinin harika kullanımı
Harika karşılaştırma bölümü

Neyi Sevmedik

Özellik kaydırıcısı harika değil, renk tutarsız, sonraki düğme zayıf
Sayfadaki düğmeler sizi ayrı bir sayfaya götürür
Yedekli destek bölümleri

korsan

Sevdiklerimiz

Yapışkan düğmeler, ancak ürün sayfasının geri kalanı için maksimum gayrimenkul sağlamak üzere aşağı kaydırdığınızda yapışkan başlık kayboluyor. Yukarı kaydırdığınızda yeniden görünür
Sayfa boyunca mükemmel video kullanımı
Yüksek çözünürlüklü fotoğraflar ve CTA'lar içeren kaydırma animasyonu, kullanıcının etkileşimde kalmasını sağlar

Neyi Sevmedik

Sayfanın geri kalanına kıyasla katlama alanının üzerinde sıkıcı
Yukarı satış veya çapraz satış bölümü yok
Fotoğraf galerisinde yavaş gezinme

UgMonk

Sevdiklerimiz

Hareketsiz görüntüler yerine giflerin iyi kullanımı
Yukarı satışların ve çapraz satışların iyi kullanımı
Sosyal Kanıtın iyi kullanımı

Neyi Sevmedik

Görüntüler gereksiz
Ürünü incelemek daha iyi olabilir (hızlı bir şekilde geri dönmeden sizi dibe götürür)
Ürünü hızlı bir şekilde veya sayfanın herhangi bir noktasında satın almanın yolu yok

kademe

Sevdiklerimiz

Instagram üzerinden büyük topluluk duygusu
Çok az boşa harcanan beyaz alan
Yapışkan başlıkta bir "Şimdi Satın Al" düğmesi bulunur

Neyi Sevmedik

Pitbull bölümü polarize oluyor
Üyelik bölümü bazı etkileşimli bölümler kullanabilirdi
Safari'de, bir fotoğraf galerisini kaydırmaya çalışırken bir kaydırma sorunu oluşuyor

DJI

Sevdiklerimiz

Teslimat tahmini entegrasyonuna sahip çekici bir "Şimdi Satın Al" düğmesiyle harika satışlar
Güzel "kutuda" bölümü
“Yakından Bakın” bölümü için mükemmel görüntü kullanımı

Neyi Sevmedik

Çok az sosyal kanıt içeren inceleme bölümü yok
"Sizin için en iyisi" bölümünde, başvurulan ürünlere bağlantılar bulunmalıdır.
Ürün sayfasında çok fazla hikaye yok

Demleme Dr (20)

Sevdiklerimiz

İnceleme bölümündeki yıldızlar da dahil olmak üzere sayfa boyunca renk düzenini korur. Her ürün sayfası, sanat stiline dayalı benzersiz bir renk şemasına sahiptir.
Diğer ürünlerin iyi çapraz satışı
Sayfa boyunca harika sosyal kanıt

Neyi Sevmedik

Ek satış yok (ürün satabilir)
Ekstra uzun inceleme bölümü
Yapışkan başlık veya "Başa Dön" düğmesi yok

kesimler

Sevdiklerimiz

Ürün seçimi bölümü çeşitlidir
Büyük sosyal baskı, kendi hashtag'leri bile var
Videoları sayfaya sorunsuz bir şekilde uyum sağlar

Neyi Sevmedik

Gereksiz yere büyük inceleme bölümü
Ürünle hikaye/duygusal bağ yok
Yapışkan "Şimdi Satın Al" düğmesi veya en üste atlama özelliği yok

alloi

Sevdiklerimiz

Düzgün animasyonlu sosyal kanıt istatistikleri
İnceleme bölümünü küçültebilir
SSS bölümünün okunması kolaydır ve güzelce gizlenir

Neyi Sevmedik

Mükemmellik için tasarlandı bölümü etkileşimli olabilir
Ürün görseli “sonraki” ve “önceki” düğmeleri görsele göre konum değiştiriyor, farklı renkler seçildiğinde görseller doğru renge oturmuyor
Hiçbir şeye bağlantı vermeyen içeriğin/metnin altını çizmenin yanlış kullanımı

Arsa Cihazları

Sevdiklerimiz

Hoş sayfa tasarımı
Kopyanın tonu rahat
Güzel bir şekilde entegre edilmiş videolar ve resimler

Neyi Sevmedik

Sosyal kanıt yok
Daha fazla animasyon olabileceği ve kullanılabileceği zaman etkileşimli değil
ek satış yok

lanet olsun zor

Sevdiklerimiz

Özelleştirme seçenekleri ürün görsellerine yansıtılmıştır.
Markanın tavizsizce aşındırıcı sesiyle anlatılan fantastik hikaye anlatımı.
instagram sosyal kanıtının harika kullanımı

Neyi Sevmedik

Yapışkan "Şimdi Satın Al" düğmesi yok
yukarı satış yok
Büyük inceleme bölümü

Çözüm

Artık tüm favori ürün sayfası örneklerimizi gözden geçirmeyi bitirdiğinize göre, iyi bir kullanıcı deneyimini kötü olandan neyin ayırt ettiği daha açık olabilir. Artık harika ürün sayfaları oluşturmak için gerekli bilgilerle donatılmış olsanız da, Kaptan Ahab'a kapılmayın ve tüm hayatınızı mükemmel ürün sayfasını arayarak geçirmeyin. Sizi bu zahmetten kurtaracağız, öyle bir şey yok. Beklentilerini aşabilmeniz için ziyaretçinizin zamanına ve internet uzmanlığına dikkat edin.

Fazladan rehberliğe ihtiyacınız olduğunu düşünüyorsanız veya bu çok bunaltıcıysa, hayalleriniz konusunda tereddüt etmeyi bırakın ve WebCitz'deki ürün sayfası uzmanlarından oluşan ekibimizle bugün iletişime geçin!