Küresel Navigasyon: Menüyü Gizlemenin Maliyeti

Masaüstünde ana menüyü hamburger simgesinin arkasına almak tasarımı sadeleştirmez, sitenin ne kadar geniş olduğunu ziyaretçiden gizler. Arama motorundan gelip bir alt sayfaya düşen kullanıcı için ana menü sitenin tek haritasıdır; harita kapalıysa ziyaretçi geldiği sayfayla sınırlı kalır. Görünür menü varsayılan, gizleme ise gerekçesi olması gereken bir istisnadır.

Gizlemek sadeleştirmek değildir

Hamburger simgesi mobilde bir kısıt çözümüdür. 390 piksel genişlikte sekiz kategori başlığı yan yana sığmaz, birini seçmek gerekir. Masaüstünde böyle bir kısıt yok; orada menüyü simgenin arkasına almak kısıtın değil, tercihin sonucudur ve bedelini ziyaretçi öder.

Görünür bir ana menü aynı anda iki iş yapar. Birincisi gezinmedir, herkesin gördüğü iş. İkincisi kapsam bildirimidir: ziyaretçi menüye bakar ve sitede hangi kategorilerin bulunduğunu daha ilk saniyede öğrenir. Menüyü kapattığınızda ikinci iş tamamen kaybolur, çünkü kimse açmadığı bir listenin içeriğini tahmin edemez.

Amazon gibi sitelerde bu düzenin yürümesinin sebebi menü tasarımı değil. Oraya gelen kullanıcı ne aradığını biliyor ve doğrudan arama kutusuna gidiyor, üstelik katalogun kapsamı kimse için sır değil. Orta ölçekli bir kurumsal sitede durum tersine döner: ziyaretçi sizin ne yaptığınızı bilmiyordur ve bunu öğrenebileceği tek yer menüdür.

Mega menü ne zaman işe yarar

Mega menü, kategori yapısı gerçekten genişse iyi çalışır: çok sayıda üst başlık, her birinin altında birkaç anlamlı alt başlık. İşi hiyerarşiyi tek bakışta açmaktır. Yapı darsa ve derinse, yani üç üst başlığın altında dörder seviye varsa, mega menü o derinliği düzleştirmez; sadece üstteki üç kutuyu büyütür.

Maliyeti de doğru yere koymak gerekir. Sekiz üst başlık ve başlık başına on iki alt bağlantı, her sayfada taşınan 96 bağlantı demektir. Bunun bayt tarafını dert etmeyin, tekrar eden işaretleme gzip altında neredeyse bedavadır. Asıl maliyet erişilebilirlikte: klavyeyle gezen ya da ekran okuyucu kullanan biri, içeriğe ulaşmak için o 96 bağlantının arasından geçer. Çaresi bilinen bir şey, menüyü <nav aria-label="Ana menü"> olarak işaretlemek ve sayfanın en başına içeriğe atlama bağlantısı koymak. Mega menünün var olduğu bir sitede bu iki satır isteğe bağlı değildir.

SEO tarafında sık duyulan "her sayfadan 96 bağlantı çıkıyor, link değeri dağılıyor" itirazına gelince, site genelindeki menü bağlantıları arama motorları için yeni bir durum değil ve bu kaygı yüzünden kategori gizleyen siteler görülüyor (bu kaygıyı fazla büyütülmüş buluyorum). Menüyü kısaltmak için geçerli tek sebep, ziyaretçinin seçim yapamamasıdır. Mega menünün içine arama kutusu koymanız gerekiyorsa taksonomi çoktan menünün taşıyabileceğinden büyümüştür, çözüm menüde değil kategori yapısındadır.

Menüyü iki kez yazmayın

Hazır temaların çoğunda aynı menü sayfaya iki kere basılır: biri masaüstü için yatay liste, diğeri mobil panel için. Hangisinin görüneceğine CSS karar verir. İlk gün çalışır, altı ay sonra bozulur. Birisi yeni kategoriyi yalnızca bir kopyaya ekler ve mobilde görünen başlık masaüstünde yoktur.

İki kopya erişilebilirlik ağacında da iki kez durur. Gizli olan kopya display:none ile kapatılmışsa sorun çıkmaz, ama sık yapılan hata paneli ekran dışına taşıyıp (klasik left:-9999px) görünmez saymaktır. Ekran okuyucu o bağlantıları okumaya devam eder, kullanıcı aynı menüyü iki kere dinler.

Sağlıklı kurulumda menü tek bir kaynaktan gelir, şablon tarafında tek parçadır, görünümü CSS ayırır. İkinci bir render gerçekten gerekiyorsa görünmeyeni hidden özniteliğiyle kapatın. Küçük bir sigorta da işe yarar: iki listedeki bağlantı sayısını karşılaştıran birkaç satırlık bir test, unutulan kopyayı yayına çıkmadan yakalar.

Menü tıklamasını nasıl sayarsınız

Gizli menü iki adımlı bir etkileşimdir, önce açılır sonra tıklanır. Bu yüzden "menü tıklama oranı" diye tek bir sayıya bakmak yanıltır: düşük çıkan oran, menünün işe yaramadığını değil, bulunamadığını gösteriyor olabilir. Ölçümü ikiye ayırın.

• Açılma oranı: kaç oturum menüyü hiç açtı. Düşükse sorun keşfedilebilirliktedir, yani simgenin kendisindedir.
• Açılma başına tıklama: menüyü açanların kaçı bir başlığa gitti. Düşükse sorun etiketlerde ve kategori isimlerinde aranır.

Bir de ortalama oturum süresi meselesi var. Menü değişikliğini bu sayıyla değerlendirmek iki yönden hatalıdır. Analitik araçları sayfada geçen süreyi ardışık iki isabetin farkından hesaplar, çıkış sayfasının ardından isabet gelmediği için o sayfa sıfır saniye sayılır; yani sürenin bir kısmı zaten ölçülmüyor. İkincisi, iyi bir menü ziyaretçiyi aradığına daha çabuk götürür ve süreyi kısaltır. Başarıyı düşüş olarak okursunuz.

Bakılacak sayı şu: oturumların yüzde kaçı ikinci bir kategoriye geçiyor ve bu geçişlerin ne kadarı menüden başlıyor. Menüyü gizleyip açtığınız bir testte bu oran değişmiyorsa menü zaten kimsenin yolunda değildir, tasarım tartışmasını kapatıp kategori yapısına bakmak gerekir.