Utility Navigation: Sınırlı Alanda Hangi Araç Menüye Girer
Utility navigation tartışması çoğu yerde "hangi araçlar olmalı" listesiyle başlar. Asıl karar bunun tersidir: hangisi elenecek. Üst sağ köşede ya da mobil alt barda elinizdeki alan piksel cinsinden sabittir ve o sayı, ders kitabındaki yedi kalemlik listeden çok daha azını alır.
Önce yer hesabı
360 piksel genişliğinde bir telefon ekranı alın, iki yandan 16 pikselden toplam 32 piksel kenar boşluğunu çıkarın: geriye 328 piksel kalır. Dokunma hedefi için alt sınır 48 piksel (Material) ya da 44 nokta (Apple HIG). Aralara 8 piksel boşluk koyduğunuzda satıra tam altı ikon sığar, bir fazlası girmez. Üstelik o altının içinde logo ve menü düğmesi de var, yani gerçekte üç dört yer kalıyor.
İkonun altına etiket yazacaksanız hesap daha da daralır. "Favorilere Ekle" gibi bir metni kırpmadan göstermek için kaleme 64-72 piksel gerekir, o zaman satıra dört beş öğe girer. Bu yüzden "mobilde ikonun yanına açıklama koyun" tavsiyesiyle "mobilde yer dar" tespiti aynı sayfada yan yana duramaz. Biri diğerini eler. Etiket kalsın, kalem sayısı düşsün.
Sabit bir alt bar kuruyorsanız body'ye barın yüksekliği kadar padding-bottom verin ve buna env(safe-area-inset-bottom) ekleyin. Yoksa iPhone'da sayfanın son satırı barın altında kalır, kimse oradaki bağlantıya ulaşamaz. İki satır CSS, hazır bir menü eklentisine gerek yok.
İkon tek başına konuşmaz
Büyüteç, sepet ve üç çizgi yıllar içinde öğrenildi; bunları etiketsiz bırakabilirsiniz. Gerisi öğrenilmedi. Paylaşma ikonu iOS'ta yukarı oklu kare, Android'de üç düğümlü grafik, yani aynı kullanıcı iki cihazda iki ayrı şey öğrenmiş durumda. Yer imi ile favori, profil dairesi ile giriş yap arasındaki farkı ikon taşıyamaz. Kural basit: etiketi sığmayan kalem, barda durmayı hak edecek kadar önemli değil.
Dil seçimini bayrakla yapmayın. Bayrak ülkeyi gösterir, dili değil. Arapça yirmiden fazla ülkenin dili, İsviçre bayrağının arkasında dört resmî dil var. Dilin adını kendi yazımıyla yazın: Deutsch, Türkçe, العربية. Kullanıcı kendi dilini listede çeviriye ihtiyaç duymadan tanır.
Sepet utility navigation değil
Tanım şöyle kurulur: utility navigation, içerikle doğrudan ilgisi olmayan ikincil işlemleri barındırır. Sonra aynı listeye alışveriş sepeti eklenir. İkisi bir arada duramaz. Sepet, sitenin para kazandığı yolun tam üstünde; e-ticarette giriş düğmesi de öyle. Bir öğe dönüşümü taşıyorsa ikincil değildir, yalnızca ikincil bir bölgeye yerleşmiştir.
Bu ayrımın sonucu tasarım toplantısında görülür. "Utility" etiketi yapışan her şey artan yerle idare etmek zorunda kalır ve kırpma sırası önce oradan başlar. Sepeti ve hesap girişini bu kümeden çıkarın, onlara birincil navigasyon kuralları uygulansın: her sayfada aynı konumda, durum bilgisiyle (üç ürün, iki bildirim) ve tek dokunuşla.
Ölçerken A/B testine sarılmayın
Utility navigation kalemlerinin çoğu az tıklanır. Az tıklanan bir öğede iki varyantı ayırt etmek için gereken örneklem, çoğu sitenin aylık trafiğini aşar. Yazdır bağlantısının konumunu A/B ile test etmeye kalkarsanız testi sonuca ulaşmadan kapatırsınız. Buna karşılık sıralama bilgisi bedava: bir aylık tıklama sayılarını büyükten küçüğe dizin. Listenin dibindeki iki kalemi bardan alıp alt menüye taşımak için anlamlılık testi gerekmez, sıra yeter.
Bardaki arama kutusu ayrı bir ölçüm kaynağı. Sonuç döndürmeyen sorguların dökümü, ana menüde eksik olan şeyin listesidir. Aynı sorgu ayda onlarca kez gelip boş dönüyorsa mesele arama değil, bilgi mimarisi.