Breadcrumb Türleri Nelerdir? #

Hiyerarşik Breadcrumb: #

• Tanım: Site yapısını ve kullanıcıların mevcut konumlarını gösterir.
• Örnek:

Anasayfa > Kategoriler > Ürünler > Ürün Adı

Nitelik Tabanlı (Attribute-Based) Breadcrumb: #

• Tanım: E-ticaret sitelerinde ürün filtrelemelerini göstermek için kullanılır.
• Örnek:

Anasayfa > Kadın Giyim > Elbiseler > Renk: Kırmızı

Geçmişe Dayalı (History-Based) Breadcrumb: #

• Tanım: Kullanıcının site içinde izlediği yolun geçmişine göre sıralama yapar.
• Örnek:

Anasayfa > Önceki Sayfa > Şu Anki Sayfa

Breadcrumb’lerin SEO’ya Etkileri Nelerdir? #

Breadcrumb navigasyonları, SEO açısından şu faydaları sağlar:

1. Kullanıcı Deneyimini İyileştirir:
   • Sayfa içi gezinmeyi kolaylaştırarak kullanıcıların daha fazla sayfa görüntülemesini sağlar.
2. Daha İyi Arama Motoru Tarama ve İndeksleme:
   • Arama motorları sayfa ilişkilerini daha iyi anlar ve içerik yapısını doğru bir şekilde dizine ekler.
3. Rich Snippets (Zengin Sonuçlar):
   • Yapısal veri işaretlemesi sayesinde arama sonuçlarında daha çekici görünür.
4. SEO İçin Daha Fazla Bağlantı:
   • Breadcrumb bağlantıları dahili bağlantıları artırarak site yapısını güçlendirir.

Breadcrumb Nasıl Eklenir? #

HTML Örneği: #

<nav aria-label="breadcrumb">
  <ol class="breadcrumb">
    <li class="breadcrumb-item"><a href="/">Anasayfa</a></li>
    <li class="breadcrumb-item"><a href="/kategori/">Kategori</a></li>
    <li class="breadcrumb-item active" aria-current="page">Ürün</li>
  </ol>
</nav>

CSS Stili: #

.breadcrumb {
  list-style: none;
  display: flex;
}
.breadcrumb-item + .breadcrumb-item::before {
  content: ">";
  padding: 0 5px;
}

Breadcrumb Optimizasyonu İçin En İyi SEO Uygulamaları #

1. Zengin Sonuçlar İçin Schema.org İşaretlemesi Kullanın:
   • Yapılandırılmış veri ekleyerek Google Rich Snippets desteği sağlayın.
2. Anlamlı ve Kısa Başlıklar Kullanın:
   • Karmaşık kelimelerden kaçının ve kullanıcı dostu metinler oluşturun.
3. Dahili Bağlantılarla Güçlendirin:
   • Breadcrumb bağlantıları, site içi bağlantı ağı oluşturmak için kullanılır.
4. Mobil Uyumluluk Sağlayın:
   • Responsive tasarımlarla mobil cihazlarda sorunsuz çalışmasını sağlayın.

Breadcrumb Yapısal Veri İşaretlemesi Nasıl Yapılır? #

JSON-LD Örneği: #

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    {
      "@type": "ListItem",
      "position": 1,
      "name": "Anasayfa",
      "item": "https://www.example.com/"
    },
    {
      "@type": "ListItem",
      "position": 2,
      "name": "Kategori",
      "item": "https://www.example.com/kategori/"
    },
    {
      "@type": "ListItem",
      "position": 3,
      "name": "Ürün",
      "item": "https://www.example.com/kategori/urun"
    }
  ]
}
</script>

Breadcrumb Uygulamasında Yaygın Hatalar ve Çözüm Yolları #

Breadcrumb’ler İçin Test ve Doğrulama Araçları #

• Google Rich Results Test: Breadcrumb işaretlemesini doğrulamak için kullanılır.
• Screaming Frog SEO Spider: Site taramaları ile breadcrumb yapılandırmalarını kontrol eder.
• Schema Markup Validator: Yapısal veri doğrulaması sağlar.

Breadcrumb’ler WordPress, Shopify ve Diğer CMS Platformlarında Nasıl Eklenir? #

WordPress Breadcrumb Ekleme: #

• Yoast SEO Eklentisi: Breadcrumb işaretlemesi otomatik olarak eklenir.
• Örnek Kod:

<?php if ( function_exists('yoast_breadcrumb') ) {
  yoast_breadcrumb( '<p id="breadcrumbs">','</p>' );
} ?>

Shopify Breadcrumb Ekleme: #

• Liquid Template Kullanımı:

<nav aria-label="breadcrumb">
  <ul>
    <li><a href="/">Anasayfa</a></li>
    <li><a href="/kategori">Kategori</a></li>
    <li>Ürün</li>
  </ul>
</nav>

Breadcrumb Kullanımı ile İlgili Sık Sorulan Sorular (FAQ) #

Breadcrumb SEO için zorunlu mu?
Hayır, ancak hem kullanıcı deneyimi hem de SEO optimizasyonu için şiddetle tavsiye edilir.

Mobil cihazlarda Breadcrumb nasıl optimize edilir?
Responsive tasarım kullanarak breadcrumb yapısının mobil cihazlara uyumlu olduğundan emin olun.

Breadcrumb işaretlemesi Rich Snippets sonuçlarını etkiler mi?
Evet, doğru yapılandırılmış breadcrumb işaretlemesi, zengin sonuçlarda daha görünür hale gelmenizi sağlar.