Mobil Navigasyon Desenleri: Hangisi Nerede Çalışır
Mobilde navigasyon seçimi pratikte üç desen arasında geçiyor: sekme çubuğu, gizli menü ve navigasyon merkezi. Hangisinin doğru olduğunu ekran estetiği değil, kullanıcının tek oturumda kaç kez bölüm değiştirdiği belirliyor. İkinci sınırı da etiketler koyuyor; Türkçe menü adları çoğu tasarımın hesaba katmadığı kadar geniş.
Sekme çubuğu: sık bölüm değiştiren kullanıcı için
Sekme çubuğunun tek avantajı görünür olması. Bölümler ekranda durduğu sürece kullanıcı keşfetmek zorunda kalmaz, doğrudan dokunur. Oturum başına üç dört kez bölüm değiştiren bir arayüzde başka desen tercih etmeyin.
Sınırı genelde dokunma alanı sanılıyor, oysa önce etiket taşıyor. 360dp genişliğinde bir ekranda beş sekme her birine 72dp bırakır; bu genişliğe 12sp bir etiketten yaklaşık dokuz on karakter sığar. "Bildirimler" zaten sınırda duruyor, altıncı sekmeyi eklediğinizde pay 60dp'ye iner ve "Kategoriler" kırpılır. Bu noktada çoğu ekip etiketi atıp yalnız ikon bırakıyor, yani keşfedilebilirliği kurtarmak için seçtiği deseni kendi eliyle bozuyor. Etiket sığmıyorsa çözüm sekme eklemeyi bırakmak, yazıyı silmek değil.
Gizli menü: çok bölümlü, seyrek gezinilen siteler
Hamburger ikonu bir yer kazanma pazarlığıdır: ekranı içeriğe bırakırsınız, karşılığında bölümlerin bir kısmının hiç görülmemesini kabul edersiniz. İçerik ağırlıklı, kullanıcının bir oturumda tek bir yazı okuyup çıktığı sitelerde bu pazarlık kârlıdır.
İkonun yanına "Menü" yazın. Üç çizgi tek başına tanınıyor sayılıyor, ama ölçtüğünüzde yazılı etiketle açılma oranının arttığını görürsünüz ve maliyeti otuz piksellik bir alandır. Menünün içindeki sıralamayı da trafiğe göre kurun; en çok tıklanan üç bağlantı en üstte olsun, alfabetik sıralama kimsenin işine yaramıyor.
Navigasyon merkezi: tek görevlik oturumlar
Kullanıcı her oturumda tek bir iş yapıp çıkıyorsa (bilet alma, fatura ödeme, ayar değiştirme) ana sayfayı merkez yapmak en temiz çözüm. Ekran tek işe odaklanır, menü yükü ortadan kalkar.
Ama iki bölüm arasında gidip gelen kullanıcı için her geçiş fazladan bir adım demek. İçerik gezilen bir sitede bu deseni kullanmayın; kullanıcı ikinci geri dönüşte sekmeyi kapatıyor.
Sabitlemenin uygulama maliyeti
Alt barı position: fixed ile sabitliyorsan alt iç boşluğa env(safe-area-inset-bottom) ekle, yoksa iOS'ta ana ekran çizgisinin altında kalan sekme dokunmayı yutar. Aynı şekilde sayfanın en altına barın yüksekliği kadar boşluk bırak; sabit bar son satırı örttüğünde kullanıcı sayfanın bittiğini anlamaz. Bunu on beş satır CSS ile çözersin, hazır menü kütüphanesi kurmaya gerek yok.
Sabit menünün gerçek maliyeti piksel: 56dp'lik bir bar, 640dp yüksekliğindeki bir ekranın yüzde dokuzunu kalıcı olarak alır. Kullanıcı o alanı oturumda birkaç kez kullanmıyorsa bar hak etmiyor demektir.
Karar tablosu
| Durum | Desen |
|---|---|
| 5 veya daha az bölüm, sık geçiş | Sekme çubuğu, etiketli |
| Çok bölüm, oturum başına tek okuma | Gizli menü, "Menü" etiketiyle |
| Tek görev, geçiş yok | Navigasyon merkezi |
| Bölüm sayısı belirsiz, büyüyor | Sekme çubuğu + son sekmede "Diğer" |
Son satır çoğu ekibin geç fark ettiği çıkış yolu: sekme sayısını sabit tutup taşan her şeyi tek bir bölüme atmak, sekmeleri küçültmekten de etiketleri silmekten de iyi sonuç veriyor.