Ekipten

E-ticaret Sitelerinde Dikkat Edilmesi Gerekenler: Etkileşim ve Navigasyon

Bir e-ticaret sitesi kullanıcısıyla nasıl ve hangi yollarla etkileşim kurmalı, siteyi kullanıcı dostu yapan navigasyon tasarımı nasıl olmalı? sorularını yanıtladık.
USERSPOTS BÜLTEN
Her ay tasarım ve teknoloji üzerine yeni stiller, dijital ürünler, projeleriniz için kaynaklar, tasarım ilhamları ve daha fazlasına sahip bülten.
Aramıza hoş geldin! Yeni bültenlerimiz de görüşmek üzere...
Oops! Something went wrong while submitting the form.

E-ticaret Sitelerinde Dikkat Edilmesi Gerekenler: Etkileşim ve Navigasyon

E-ticaretin tarihi 1960’lara kadar uzansa da bildiğimiz haline gelme sürecinin, teknolojik gelişmelerin hızlanması sayesinde esas etkilerini gördüğümüz 90’lı yılların ortalarında gerçekleştiğini söyleyebiliriz.

Bilinen ilk internet üzerinden satışı, 1970’li yıllarda, yapay zeka ve arpanet hesapları üzerinden, Stanford Üniversitesi’nde eğitim gören bazı öğrenciler gerçekleştirdi ama günümüzdeki anlamı ile baktığımızda ilk e-ticaret 1994 yılında gerçekleşti. Pizza Hut, internet üzerinden ilk pizzasını satarak dünyanın ilk e-ticaret yapan firması oldu.

pizzahut-banner-detail

90’ların ortalarında kurulan Amazon ve Ebay’in de bu sektöre adım atması, e-ticaretin gelişimine hız kazandıran en önemli etkenlerdendir. İlk yıllarında bir kitap satış sitesi olarak kurulan Amazon ve bir açık arttırma sitesi olarak kurulan Ebay bugünün devleri arasında yer alıyor.

2000’li yıllarda gelişimi daha da hızlanan internetin daha farklı bir boyuta geçmesi ile birlikte tüketicilerin buraya yönelmesi hızlandı ve satıcılar e-ticaret sitelerinde daha çok satış yapmaya başladı. Bunların ardından gelen Aliexpress, ETSY, Alibaba ile bu sektör daha da büyüdü. Tabii ki 2019’da hayatımıza giren COVID-19 ile muazzam bir sıçrama yaşandı.

Tarihsel açıdan bu şekilde bir ilerleme söz konusu. Peki yapısal anlamda ve tasarım odaklı baktığımızda e-ticaret sitelerinde nelere dikkat etmek gerekiyor? Dikkat etmemiz gereken noktaları buradaki başlık altında yer alan içeriklerimizde derliyoruz, bu yazımızdaki yanıtımız ise etkileşim ve navigasyon.

E-ticaret Sitelerinde Etkileşim

Web sitenizi de tıpkı bir mağaza gibi müşterilerinizin hareketlerine bağlı çalışan bir işletme olarak algılayabilirsiniz. Aradıkları ürünü veya hizmeti, hem hızlı hem de kolay bulabilmeleri için fiziksel ortamda nasıl bir yapı oluşturmanız gerekiyorsa e-ticaret platformunuza da o gözle bakmalısınız. Web sitenizi ziyaret ettiklerinde kullanıcı rolüne geçen müşterilerinizin site ile kuracağı iletişimi doğru etkileşimler sunarak güçlendirmek mümkün. Peki etkileşimi nasıl doğru kılarız? Bunun yollarından biri başarılı modal dialogue ve reklam kullanımlarından geçiyor. Modal dialogue ve reklam kullanımında kullanıcıların site içerisinde yanlış yönlendirilmelerini engellerken bir yandan da reklamın -kullanıcıların ilgisini çekerek- görevini yerine getirmesi sağlanmalı. 

• Modal Dialogue/Lightbox

Modal ya da diğer adıyla Lightbox, bir internet sitesinde gezinirken herhangi bir uyarı durumunda, herhangi bir hesap giriş işlemi olması gerektiğinde ya da mevcut indirimleri göstermek için karşımıza çıkan overlay kutulardır. Çoğumuzun aniden karşımıza çıkan bu kutulara karşı tepkisi ise genellikle onları incelemeden direkt kapatmak oluyor.

magnolia

Örneğin magnolia.com bir e-ticaret sitesi. Sitede gezinmek için birkaç dakika harcadıktan sonra, Home Decor listeleme sayfasına ulaşıldığında kalıcı bir overlay ekrana geldi. Bu açılır pencere, e-ticaret sitelerinde kullanılan overlay’lerin tipik bir örneğidir ve kullanıcıları bülten promosyonlarına kaydolmaya ikna etmeyi amaçlar. 

Buradaki asıl önemli konu kullanıcının karşısına çıkan bir modal dialogue’un kullanıcıyla ne kadar alakalı olduğudur. Kullanıcının karşısına çıkan kutucuğun içinde yazan bilgi onunla çok alakalı olsa bile çoğu kullanıcı bu kutucuğu hiç okumadan direkt kapatacaktır. Peki ya kullanıcı ile hiç alakası yoksa ne olacak? O zaman da bu kutucuğun gösterilmesinin ne kadar gerekli olduğu sorgulanmalıdır.

Modal dialogue kullanımının en uygun yolu, kullanıcının kendi isteği üzerine tıkladığı bir buton sonrasında onunla karşılaşmasıdır. Bir sayfa yüklenirken kullanıcının böyle bir kutucuğa tıklamaya zorunlu kalmaması, tecrübesini olumlu etkiler. Özetle, bir aksiyon sonucu alakalı bir modal dialogue kullanımı doğru bir hareket şekliyken bunun aksi bir kullanımı uygulamamak daha sağlıklıdır. Kullanıcının aksiyonlarına doğru bir cevap vermek ve değişen istekleri karşılamak için sayfa içindeki kullanıcı işlemleri ve bunların dataları büyük önem kazanmaktadır.

Etsy

Yukarıdaki örnekte Etsy, bir kullanıcının başka adımlar da gerektiren bir işlemde devam etmeden önce zorunlu olarak üye girişi yapma ekranını kullanıcının karşısına çıkarmıştır. Örneğin, bir kullanıcı bir öğeyi sepetine eklemeye çalıştığında ve kullanıcı oturum açmadığında, istenen eylemi gerçekleştirmek için gerekli bilgileri almak için bunun gibi bir iletişim kutusu görüntülenir. 

Tasarlamak istediğiniz web sitelerinde Modal kullanacaksınız dikkat etmeniz gerekenleri ise şöyle sıralayabiliriz:

Kullanıcının karşısına çıkardığınız modalları kapatabilme seçeneğini onlara sunun

Kullandığınız modalları web sitesinden farklı bir şey olduğunu kullanıcınıza gösterin, ve lazım olmadıkça bunu yapmaktan kaçının (overlay)

Kullandığınız Modal’ın boyutlarını kullanıcının ekranını tamamen kaplayacak bir şekilde tasarlamayın, kullacının farklı bir sayfaya geçtiğini düşündürebilirsiniz

Eğer yapabiliyorsanız, Modallarınızı kullanıcının kendi isteği ile açabileceği seçenekler sunun

Tasarladığınız modallardaki yazıların, butonların ve diğer elemanların kullanıcılar tarafından rahat bir şekilde algılanacak biçimde tasarlayın

Etkileşim konusu dahilinde değinilmesi gereken bir diğer konu da reklamlardır. Dahili reklamlar ve banner'lar, kullanıcılar tarafından genellikle olumsuz algılanmaya çok müsait yapıdadırlar. Özellikle ana sayfadaki reklamlar için kullanıcı tarafında belirgin bir hoşnutsuzluk kanısı hakimdir. Aniden çıkan ek sayfa reklamlar (pop-up), sayfanın ortasında birden belirenler ve asla kapanmayan o reklamlarda olduğu gibi…

Doğru reklamların doğru alanlarda yerini alması kullanıcı algısı açısından oldukça kritiktir. Yanlış bir stratejik harekette, doğru gözükmeyen bir reklamda, kullanıcının gözünde o sitenin ilk izlemi zayıf kalabilir ve potansiyel müşteriye dönüşme ihtimali ortadan kalkabilir.

ikea frame

IKEA’nın banner yaklaşımı bize iyi örneklerden birini sunuyor. Öne çıkarmak istediği ürünlerini ve bunlarla birlikte yaptığı çeşitli indirim ve kampanyaları olabilecek en yalın haliyle kullanıcılarıyla buluşturan ve bunu oldukça başarılı görsellerle bütünleştiren bir yaklaşıma sahip.

E-ticaret Sitelerinde Navigasyon

Özellikle navigasyon konusu e-ticaret sitelerinin kullanıcı dostu olması açısından oldukça önemlidir. Kullanıcıların site içerisinde varmak istedikleri yerlere rahatça ulaşabilmesi için bu sitelerin dikkate alması gereken belli başlı site düzeni tasarım yönergeleri vardır.

Header, bu konunun baş kahramanıdır ama ziyaretçilerin %99,99'u tarafından görülse de, güvenlerini pekiştirmek ve onları kalmaya ikna etmek için gereken çok kısa bir süre vardır. Burada ise sadelik, renkler ve belirgin başlıklar ayrı bir önem taşır. 

Genelde header bölümü, ana navigasyon, bir arama çubuğu, bir sepet düğmesi ve müşteri hizmetleri, mağaza bulucu, en çok satan ürünler vb. gibi ek bilgileri içerir. Bu ekstra öğeler, ziyaretçilerin sitede gerçekleştirdikleri davranışlar tarafından belirlenir. 

Ebay

Ebay’in header tasarımındaki kategorizasyon oldukça kolay algılanabilirdir. Alışık olunan diğer kategori sıralamasına göre bazı farklılıklar göze çarpıyor. Örneğin, kaydedilen ürünlerin kategori sıralamasında ana sayfadan hemen sonra yer alması; belli verilerin analizi sonucunda alınan bir karardır. Burada da devreye CRO (dönüşüm oranı optimizasyonu) giriyor, kullanıcılarınızın site içerisindeki hareketlerinden de tasarımlarımızı bu verilere uygun bir şekilde gerçekleştirilir.

Kullanıcıların bir e-ticaret sitesinde ana navigasyon bölümünün dışında olmasını bekledikleri, yardım bölümü, iade politikası, nakliye bilgileri gibi kısımları footer kısmında vermek ise ayrı bir önem taşıyor. Site alt bilgisi ve başlığı, bu sayfaların en önemlilerine doğrudan bağlantılar eklenerek bu ihtiyaçları karşılayacak şekilde tasarlanmış olmalıdır.

Amazon footer

Amazon’un footer kısmında bir kullanıcı hem siparişlerini takip edebileceği sayfaya yönelebiliyor hem de yardım sayfasına gidebiliyor. Aynı zamanda Amazon’un bünyesindeki affiliate ve dükkan açma gibi ekstra özellikleri de görebiliyor.

Kullanıcılar yardım almak istedikleri anda onlara bunu sağlamak önemlidir. Örneğin, ödeme sürecinde zorlanan bir müşteri varsa veya bir ürünle ilgili soruları varsa, canlı yardım, satışı yapan belirleyici unsur olabilir. Tüketicilere, ekranın diğer tarafında gerçek insanlar olduğuna dair güvence verir.  Bu süreçte canlı yardımın kullandığı üslup ve verdiği cevaplar, kullanıcının sorunlarına yardımcı olmalıdır. 

SSS yani sıkça sorulan sorular kısmı, e-ticaret sitelerinde önemli bir yere sahiptir. Kullanıcılarla ilk temas noktasıdır ve olabilecek tüm soruları hızlı ve verimli şekilde yanıtlama amacındadır. Doğru hazırlandığında kullanıcılara, satın alma yolculuklarının herhangi bir aşamasında hizmet verebilir.

İade politikalarına ve gönderim bilgilerine hızlı erişime ihtiyaç duyulması da bir diğer durumdur. Kullanıcılar, sayfalar arasında gezinirken, üründen ürüne geçiş yaparken, gözü bu etkileşimleri aradığında onlara bunu sağlıyor olmak önemli bir durumdur.

Amazon iade/teslimat

Amazon, iade/teslimat ücret ve politikaları olarak iki kategoride ele almış bu durumu. Footer kısmına yerleştirdiği bu başlıklardan bu kısımlara ulaşmak ve iadeler kısmından bunların detaylarına ulaşmak mümkün. Aynı zamanda header kısmında yer alan iadeler ve siparişler kısmından da zaten tüm siparişlerinizi görebildiğiniz gibi o sayfadaki footer kısmından da yine aynı bölümlere ulaşmak mümkün.

Bu içeriğimizde, e-ticaret sitelerindeki önemli alanlardan olan etkileşim ve navigasyon özelliklerinden bahsettik. Siz de bu serimizin devam etmesini istiyorsanız puanlamalarınızı bize iletebilirsiniz. E-ticaret sitelerinde dikkat edilmesi gerekenler serimiz ve diğer e-ticaret üzerine yazdığımız içerikler için buraya tıklayabilirsiniz.

Sizler de e-ticaret siteleri için önemli olan, kullanıcı verilerinin analizi ve bu analizler sonucu yapılan optimizasyonlar nasıl olmalı konusunda daha fazla bilgi sahibi olmak istiyorsanız, Userspots Akademi olarak sizlere sunduğumuz, online’da gerçekleşen CRO ve UX Eğitimimize katılabilirsiniz.

E-ticarette Etkileşim ve Navigasyon
E-ticaret Sitelerinde Etkileşim ve Navigasyon

Hazırlayan;

UX Okulu Katılımcısı

Emre Şimşekli

Oluşturulma Tarihi
03/2022
Güncellenme Tarihi
03/2022
Önceki İçerik
Sonraki İçerik
Userspots Bülten
Her ay tasarım ve teknoloji üzerine yeni stiller, dijital ürünler, projeleriniz için kaynaklar, tasarım ilhamları ve daha fazlasına sahip bülten.
2300’den fazla kişinin kayıtlı olduğu kulübümüze katıl !
Başvuru için teşekkürler. En kısa sürede sizinle iletişime geçeceğiz.
Lütfen eksik bilgileri tamamlayıp, tekrar deneyin.