UX Site Haritası: Hiyerarşiyi Kurmak ve Sınamak
Site haritası, bir sitedeki sayfaların birbirine göre nerede durduğunu gösteren şemadır. Tasarım çıktısı değil karar aracıdır: neyin ana menüye çıkacağı, neyin bir alt seviyeye ineceği burada belli olur. Çoğu ekip bunu arama motorlarına verilen XML dosyasıyla karıştırıyor, oysa ikisi farklı sorulara cevap verir.
XML site haritası ile UX site haritası
XML site haritası arama motoru içindir. Taranmasını istediğiniz adreslerin listesidir, hiyerarşi bilgisi taşımaz, insan okumaz. Oraya yalnızca dizine girmesini istediğiniz sayfaları koyun; filtre kombinasyonlarıyla üreyen liste sayfaları, iç arama sonuçları ve yönlendirilmiş adresler orada yalnızca gürültü yapar.
UX site haritası ise ekibin kendi arasında konuştuğu şemadır. Sayfaların hangi başlık altında toplandığını, hangisinin menüde görüneceğini, kullanıcının bir noktadan diğerine kaç adımda gideceğini gösterir. Tasarımcı, içerik yazarı ve geliştirici aynı yapıyı kastettiklerinden bu şemaya bakarak emin olur.
İçerik envanteri olmadan hiyerarşi kurulmaz
Elinizde ne olduğunu görmeden neyi nereye koyacağınıza karar veremezsiniz. Mevcut ve planlanan bütün sayfaları adres, başlık ve tek cümlelik amaç notuyla bir tabloya dökün. Liste çıktığında iki şey kendiliğinden görünür hale gelir: birbirinin tekrarı olan sayfalar ve hiçbir kategoriye oturmayan yetim içerikler. İlkini birleştirin, ikincisi için ya yeni bir başlık açın ya da içeriği tamamen çıkarın.
Bir şeyi de baştan ayırın: hiyerarşi menüyü belirler, adres yapısını belirlemek zorunda değildir. Bir yeniden tasarımda menü düzeni değişti diye bütün adresler de değiştirilmişti, sonuç birkaç yüz satırlık bir yönlendirme tablosu oldu.
Düz mü derin mi sorusunun cevabı aritmetikte
Düz yapı ana sayfadan az adımda her yere ulaşılan yapıdır, derin yapı içeriği çok katmanlı kategorilere böler. Tercih zevk meselesi gibi anlatılır ama basit bir çarpma işlemi kararı sizin yerinize verebilir. Her seviyede ortalama b dal açtığınızı ve d seviye indiğinizi varsayın: en alt katmandaki sayfa sayısı b üzeri d kadardır.
Bin sayfalık bir siteyi üç seviyede kapsamak istiyorsanız her seviyede on dal yeter. On kategori, her birinde on alt kategori, her birinde on sayfa. Aynı bin sayfaya iki tıklamada ulaşılsın derseniz dal sayısı otuz ikiye çıkar, yani ana menüde otuz iki başlık taşımanız gerekir. Derinliği kısaltmanın bedeli menü genişliğidir ve bu bedeli seviye başına doğrusal değil, üstel biçimde ödersiniz.
Bu yüzden “her sayfaya dört tıklamada ulaşılsın” türü kurallar tek başına bir şey söylemez. Dört tıklama zaten derin bir yapının tarifidir; kuralı koyan kişi çoğunlukla sayfa sayısını hesaba katmamıştır.
Menünün taşıyamadığını iç bağlantılar taşır
Menü hiyerarşinin yalnızca bir kesitini gösterebilir. Geri kalan yükü gövde içindeki bağlantılar üstlenir: alt sayfadan kardeş sayfaya, örnekten kaynağa, ürün sayfasından ilgili rehbere. Kural sade tutulabilir. Her ana bölüm menüde görünsün, her alt sayfa kendi üst başlığına dönebilsin, sık aranan birkaç sayfa da alt bilgide dursun.
Haritayı kâğıt üstünde bırakmayın
Hiyerarşinin doğru olup olmadığı tasarım toplantısında anlaşılmaz, çünkü yapıyı kuran kişi kendi kurduğu yapıda kaybolmaz. Tree testing tam burada işe yarar: katılımcıya arayüz göstermeden yalnızca başlık ağacını verir, “şu bilgiyi nerede ararsınız” diye sorarsınız. Yanlış dala giden kullanıcı oranı, hangi etiketin anlaşılmadığını doğrudan söyler.
Bu testlerden çıkan en yaygın sonuç şu: sorun derinlikte değil isimlendirmede. “Çözümler” başlığı altına koyduğunuz sayfayı kullanıcı gidip “Ürünler” altında arar. Etiketi değiştirmek, yapıyı yeniden kurmaktan hem ucuz hem daha etkilidir.
Araçlar
- Lucidchart ve Miro: dallanan şemalar ve aynı anda birden fazla kişinin baktığı çalışmalar için rahat.
- Figma: harita ile ekran tasarımı yan yana duracaksa mantıklı, ayrı dosyada kalacaksa gereksiz.
- DYNO Mapper ve PowerMapper: mevcut siteyi tarayıp haritasını çıkarır, yeniden tasarım öncesi envanter için hızlı yol.
- Kâğıt: ilk taslak için hâlâ en hızlısı, silmek bedava.
Araç seçimi sonuca pek etki etmiyor. Haritayı kimin göreceği ve ne sıklıkla güncelleneceği, hangi programda çizildiğinden daha belirleyici.