Türkiye’deki kullanıcı deneyimi yüksek mobil websiteleri

Mobil uyum temelde içerik sitelerinde reklam geliri artışı, e-ticaret sitelerinde ürün satışı ve marka/banka gibi sitelerde kullanıcıya verilen değeri diğer bir manada “marka değerini” oluşturur. Bir websitesinin mobil kullanıcı deneyiminin yüksek olması ise genel olarak şu parametrelere bağlıdır.

www.isbank.com.tr en fazla dikkat çekeceği ve özellikle vurgulanması gereken web siteleri kullanıcının hata yapma payının azaltılması veya daha fazla satış yapan web siteleridir. Satış yapan web sitelerinde birbirinden farklı sayfa sayısının fazla olması her sayfa için titiz bir çalışma gerektirir.

Türkiye’de de kullanıcıya oldukça basit, herkesin kullanabileceği mobil versiyon / responsive web sitelerini sizler için derledik. İşte en beğendiklerimiz;

hepsiburada.com.tr


n11.com


netinternet.com.tr


www.isbank.com.tr


sm724.com

Responsive mobil web sitelerin küçük püf noktaları

Bu resim ironegg.com adresinden alınmıştır.
Bu resim ironegg.com adresinden alınmıştır.

Normal web sitesine geri dön

Backto website

Bazı web sitelerinde kullanılan Iframeler nedeniyle bunu mutlaka koymalıyız. Öyle ki bağlanılan başka bir web sitesi eğer mobil uyumlu değilse ve responsive yapıdan kurtulamıyorsak web sitesinin işlevini tamamen yitirmiş oluyoruz. Ayrıca güncelleştirmeler çoğu zaman her haliyle test edilmez veya buglar keşfedilebilir. Bu nedenle bir takım sayfalarda sorun yaşandığında geçiçi çözüm yolu olarak kullanılabilir. Bunu da Cookie ile sağlayabiliriz.

Menülerin animasyonu pozisyonlara göre konumlanmalı

İnsanlar aslında teknik insanlardan ziyade buttonun aslında <button> olduğunu bilmezler. Kullanıcı için button’un anlamı başka bir hissiyat taşır. Tıklandığında fiziksel bir takım etkileşim yaşar ve buna göre pozisyon almasını ister.

true-mobile-experince

Üst bölümde olan menülere tıklandığında menünün animasyonu yandan değil üstten gelmelidir. Çünkü bizler bugüne kadar bu tür evrimsel süreçten geçtik ve bir anda bıraktığımız şeyler aşağıya düştüler. Hatta zamanınız varsa button gerçekten button gibi davranarak menün altından animasyon ile çıkmalı.

Yan menüler ancak aşağıdaki gibi kullanmalı. (Yan menü butonu varsa)

SideMenü
SideMenu

Mobil uyumlu <table>

Table mobil uyum süreci için her zaman sıkıntılıdır.  Çünkü table gösterimler mobil için tasarlanmamışlardır. Bu durumun en kötü tarafıysa şu anda maalesef alternatif gösteriş şeklimizin olmayışı (En azından bilindik yok). Bu durumun nedeni table gösterimin gerek iş dünyasında gerekse karşılaştırmalı ifadelerde uzunca bir süredir kullanılıyor olması olarak düşünüyorum. Bu nedenle bu probleme çözüm bulmalıyız.

Düşündüğümüz ve kullanılan çözüm önerileri;

Mobil telefonlarda en fazla 3 adet kolon gösterilmelidir.
Google’ın bulduğu çözüm de 3’lü olmasını öneriyor. Ayrıca Google son kolonu kaydırır bir şekilde kullanıyor. İnsanlar şu anda kayan bir deneyime alışkın değiller ve menüyü kaydırmak psikolojik olarak insanlara zor geliyor. Bu nedenle önerimiz tam olarak son iki veya son kolonu açılır menü ile kullanıcıya sunmak yani şöyle bir şey;

Filament Responsive Table
Filament Responsive Table

LIVE DEMO