İçerik haritası (breadcrumb), kullanıcının seviyeler arasındaki hiyerarşiyi anlamasına ve seviyeler arasında geri gitmesine yardımcı olan ikincil bir gezinme modelidir.
Breadcrumb, kullanıcılara bilgi mimarisine göre mevcut konumlarını gösterir ve hızlı bir şekilde bir üst düzeye veya önceki adıma geçmelerini sağlar.
Breadcrumb’ın Türkçe karşılığı “ekmek kırıntısı”. Bu ikincil navigasyon türü adını çocukların ormanda yollarını hatırlamak için ekmek kırıntılarını kullandıkları ünlü Hansel ve Gretel masalından alıyor. Modern zamanlarda, bu kırıntılar kullanıcılar için aynı şeyi yapıyor.
Nerelerde Kullanılır;?
Breadcrumb, ikiden fazla düzeyden oluşan bir hiyerarşi içinde organize edilmiş büyük miktarda içeriğe sahip ürün ve deneyimlerde etkilidir. Çok az yer kaplarlar ancak yine de kullanıcının gezinme hiyerarşisindeki yeri için bağlam sağlarlar.
Nerelerde Kullanılmaz?
Breadcrumb her zaman ikincil navigasyon olarak kabul edilir ve hiçbir zaman birincil navigasyonun tamamen yerini almamalıdır. Gereksiz dağınıklık yarattıkları için tek seviyeli navigasyona sahip ürünler için kullanılmamalıdırlar.
En az 3 linkli sayfalarda breadcrumb kullanılmalıdır.
Ayrıca, kullanıcıları çok adımlı bir süreçten geçiriyorsanız bunun yerine bir progress indicator(ilerleme göstergesi) kullanılmalıdır.
Breadcrumb Çeşitleri
Temel olarak 3 tip breadcrumb örneği sık kullanılır.
- Location-based Breadcrumb: Konuma dayalı breadcrumb, kullanıcıya web sitesinin hiyerarşisinde nerede olduklarını gösterir. Genellikle birden fazla seviyeye (genellikle ikiden fazla seviyeye) sahip navigasyon şemaları için kullanılırlar.
- Attribute-based Breadcrumb: Kullanıcıya konumu belirtmek yerine, sayfaların “niteliklerini” belirtir. E-ticaret sitelerinde en sık bu tür kullanılır. Kullanıcının kullandığı filtrelere göre bir içerik haritası oluşur.
- Path-based Breadcrumb: İze dayalı içerik haritaları, adımları veya yolu belirtir. Bu türü “geçmiş izi” olarak da tanımlayabiliriz. Geçmişe dayalı içerik haritalarının en yaygın uygulaması “Sonuçlara Dön” bağlantısının kullanılmasıdır.
İyi Bir Breadcrumb Tasarımı Nasıl Olmalıdır?
Birincil Navigasyonun Yerine Breadcrumb Kullanılmamalı
Breadcrumb ek bir özellik olarak görülmeli ve etkili birincil navigasyon menülerinin yerini almamalıdır. Bunun kullanışlı bir özellik olduğunu unutulmamalı; ikincil bir navigasyon şeması web sitenizde gezinmenin alternatif bir yoludur.
Breadcrumb Sayfanın Üstünde Yer Almalı
Görüntülenen yeri gösteren bağlantılar için en yaygın ve içgüdüsel yerleşim, sayfanın üst kısmındadır. Bu, kullanıcıların “breadcrumb”ı karmaşık olmayan bir şekilde bulmalarına ve bunlardan uygun şekilde yararlanmalarına olanak tanır.
Tutarlılık Ve Hiyerarşi Önemli
Eğer breadcrumb kullanmaya karar verdiyseniz, web sitesinin tamamında kullanın. Tamamında kullanılmama durumunda kullanıcının kafasının karışması mümkün. Ayrıca hiyerarşi de önemlidir. Breadcrumbs her zaman ana sayfadan başlamalı ve mevcut sayfaya indirgenmelidir.
Mevcut Sayfanın Bağlantısını Gezinmeye Dahil Etmeme
Breadcrumb içindeki son öğe’yi yani içinde bulunulan sayfayı görüntülemek istiyorsanız tıklanabilir veya dokunulur olmadığından emin olunmalı. Kullanıcılar zaten o sayfanın içerisinde olduğundan tıklanabilir bir bağlantı vermenin bir anlamı yoktur.
Bağlantılara Ayırıcı Eklemek
“Breadcrumb”da yer alan bağlantılar arasına ayırıcılar konulmalı. Genellikle /, > gibi sembollerle ayırma işlemi yapılabilir. Elbette ki tasarım stiline göre farklı unsurlar da kullanılabilir. Ancak yine de tasarımın odak noktası haline getirilmemelidir. Aşırı süslü ve dikkat çekici breadcrumb, ziyaretçileri birincil navigasyon ve ana içerikten uzaklaştırabilir.
Bir “breadcrumb”ın son öğesinde, bunun görüntülenen geçerli sayfa olduğunu belirlemek için farklı bir stil kullanın. Bunu, öğeyi kalın yaparak, rengini değiştirerek veya vurgulayarak yapabilirsiniz.
Breadcrumb Faydaları
- Breadcrumb, kullanıcıların bir web sitesinde kolayca gezinebilmeleri için ek bir yol sağlar. Bir kullanıcı başka bir kaynaktan web sitenizdeki dahili bir sayfaya gelirse, içerik haritaları kullanıcının site hiyerarşisi içinde tam olarak nerede durduğunu görmesine olanak tanır. Kullanılabilirlik açısından faydalıdır.
- Breadcrumb, kullanıcıların tarayıcıdaki “ileri” veya “geri” düğmelerini kullanmak zorunda kalmadan bir web sitesinin bir düzeyinden diğerine atlamasına olanak tanır. Ayrıca, kullanıcıların sürekli olarak ana navigasyona başvurma ihtiyacını ortadan kaldırır.
- Breadcrumb, birincil gezinmeden daha ayrıntılı gezinme sağlar. Bunu yaparken, kullanıcılara bir web sitesinde nasıl gezinileceği konusunda daha fazla seçenek sunulabilir. Sitede birkaç seviyeyi hızlı bir şekilde gezinmelerine izin vermek, hemen çıkma oranını düşürecektir.
