Türkçe adı ile “sayfa işaretleri yolu” olan Breadcrumb, kullanıcı ve arama motoru botlarının site hiyerarşisini anlamasına yardımcı olan bağlantılardır. Sitenin alt kategorilerden de oluştuğu düşünülecek olursa breadcrumb sayesinde site içerisinde daha hızlı gezinilmesi sağlanmaktadır. Breadcrumb sadece kullanıcıların işini kolaylaştırmak ile sınırlı kalmaz aynı zamanda arama motoru botlarının da tarama esnasında kolaylıkla ilerlemesine yardımcı olur.
Breadcrumb, pek çok sayfaya sahip internet sitelerinde bir önceki kategoriye dönmek, site hiyerarşisini anlamak ya da baktığınız sayfa ile ilgili başka sayfaları görmek isteyen kullanıcılar ve arama motoru botları için vazgeçilmezdir. Breadcrumb, sitenin kullanılabilirliğini artırmak ile sınırlı kalmaz aynı zamanda arama motorları tarafından da sevilen siteler arasında yer almasını sağlar.
Kullanıcı deneyimini iyileştirmek için yapılan her hareket Google tarafından sitenizin daha üst kademelere taşınmasını sağlamaktadır. Sitenizde Breadcrumb kullanmaya başlamadan önce dikkat etmeniz gereken 3 husus bulunmaktadır.
Breadcrumb ayracı seçimi, tire, nokta, eğik çizgi ve büyüktür işaretleridir. Genellikle sayfalar arasındaki hiyerarşiyi bitirmek için büyüktür işareti kullanılmaktadır. Ayraç seçiminden sonra breadcrumb büyüklüğü gelmektedir ve bu büyüklüğün kullanıcılarınızın gözüne batmayacak şekilde boyutlandırılmalısı gerekir. Breadcrumb boyutları genellikle menü ile aynı boyutta ya da onlardan biraz daha küçük olarak tasarlanmalıdır. Dikkat etmeniz gereken bir diğer nokta ise breadcrumb konumudur. Breadcrumb etiketlerinin sayfanızdaki konumu, menünün hemen alt kısmında sola yaslı ya da menünün hemen altında orta da yer almalıdır. Sağ kısımda kullanmak çok önerilmemekle birlikte site tasarımınız sizi bu şekilde kullanmaya mecbur bırakmadığı taktirde diğer iki kullanımdan birini seçmelisiniz.
Breadcrumb etiketi, Google’ın pek çok arama motorunda standart olarak kabul ettiği Schema.org etiketleri ile yapılır. Eğer wordpress benzeri hazır bir sistem kullanmayı tercih ediyor iseniz Yoast SEO eklentisine benzer eklentiler yardımı ile breadcrumb etiketini etkinleştirebilirsiniz. Fakat kendinize ait bir yazılımınız var ve bu yapıyı sonradan eklemeye karar verdiyseniz ya da düzenliyorsanız schema.org’da yer almakta olan breadcrumb özelliklerine bakarak düzenleme esnasında yardım alabilirsiniz.
Örnek Schema.org Kodlaması
<ol itemscope itemtype=”http://schema.org/BreadcrumbList”>
<li itemprop=”itemListElement” itemscope
itemtype=”http://schema.org/ListItem”>
<a itemprop=”item” href=”http://siteadi.com“>
<span itemprop=”name”>Ana Sayfa</span></a>
<meta itemprop=”position” content=”1” />
</li>
<li itemprop=”itemListElement” itemscope
itemtype=”http://schema.org/ListItem”>
<a itemprop=”item” href=” http://siteadi.com/pasta-kaliplari“>
<span itemprop=”name”>Pasta Kalıpları</span></a>
<meta itemprop=”position” content=”2” />
</li>
<li itemprop=”itemListElement” itemscope
itemtype=”http://schema.org/ListItem”>
<a itemprop=”item” href=” http://siteadi.com/kalpli-pasta-kalibi“>
<span itemprop=”name”>Kalpli Pasta Kalıbı</span></a>
<meta itemprop=”position” content=”3” />
</li>
</ol>