Galeta unu nedir? Ekmek kırıntısı nasıl yapılır
Breadcrumb Sayfa işaretleyicileri veya ekmek kırıntısı olarak da bilinir. Ekmek kırıntıları web sitesi tasarımında önemlidir. Ekmek kırıntısı yapılarını kullanarak gezinme, kullanıcının gezinme deneyimini geliştirebilir.
Arama sıralaması için rekabet arttıkça ekmek kırıntısı daha önemli hale geliyor. Ekmek kırıntısının gerçekte ne olduğunu ve nasıl yapılabileceğini açıklamak için bir kılavuz oluşturduk.
Breadcrumbnedir ?
Breadcrumb, ekmek kırıntısı anlamına gelir. Web siteleri, arama motoru optimizasyonu ve kullanıcı deneyimi gibi faktörleri göz önünde bulundurmalıdır. Ziyaretçilerin sitenizdeki kategoriler veya sayfalar arasında gezinirken hangi sayfadan hareket ettiklerini bilmek önemlidir.
Jakob Nielsen, breadcrumb yapısını ilk kez 1995 yılında kendi web sitesine uyguladığını belirtmektedir. Ekmek kırıntısı sistemi kullanıcı için kafa karıştırıcı değildir ve web sitesinde gezinirken herhangi bir soruna neden olmaz.
Breadcrumb sistemlerinin site trafiğini %30 oranında artırdığı gösterilmiştir. Ekmek kırıntısı sistemi SEO için çok önemlidir ve sitede çok az yer kaplar.
Breadcrumbs Googlebot’lara rehberlik eder ve kullanıcı deneyimini iyileştirir. Breadcrumbs, googlebotların sitede gezinmesine yardımcı olarak onları doğru hiyerarşiye yönlendirir.
Ekmek kırıntıları, kullanıcılara hangi kategoride veya sayfada olduklarını bildirerek web sitesinde gezinmelerini sağlar.
Ekmek KırıntısıNasıl Yapılır
Birçok yalan ve yanlış bilgi yayılmaktadır. Buraya tıklayarak bu konuda daha fazla bilgi edinebilirsiniz. breadcrumb. Birkaç eklenti yükleyerek bir WordPress sitesine breadcrumb navigasyonunu yükleyebilirsiniz.
Ekmek kırıntılarını uygulamak için Yoast, rankmatrix ve Schema.org gibi popüler WordPress eklentilerini yüklemeniz gerekecektir.
Breadcrumb parantezleri birçok farklı şekilde kullanılabilir. En yaygın kullanılan ekmek kırıntısı parantezi “>” dir.
- Kısa Hat
- Nokta
- Saç Kesimi
- Boyut İşareti
E-Ticaret Web Siteleri için Breadcrumb kodu
Breadcrumb Kodu
<ol itemscope itemtype="https://schema.org/BreadcrumbList"> <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemprop="item" href="https://orneksite.com"> <span itemprop="name">Ana Sayfa</span></a> <meta itemprop="position" content="1" /> </li> <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemprop="item" href=" https://orneksite.com/yemek-tarifleri"> <span itemprop="name">Yemek Tarifleri</span></a> <meta itemprop="position" content="2" /> </li> <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemprop="item" href=" https://orneksite.com/sağlikli-yemek-tarifleri"> <span itemprop="name">Sağlıklı Yemek Tarifleri</span></a> <meta itemprop="position" content="3" /> </li> </ol>
Ekmek kırıntısı en üstte doğru şekilde uygulanırsa Google sitenizi doğru biçimde görüntüleyecektir.
Ekmek kırıntısı yapısı birçok yönden faydalıdır
- Kullanıcılarınızın önceki sayfalara geri dönmesini sağlar.
- Web sitenizde sayfa ve kategoriye göre gezinmek daha kolaydır.
- Breadcrumb, kullanıcının deneyimi için faydalı olabilir, ancak yalnızca iyi tasarlanmışsa.
- Ekmek kırıntısı yapısı dahili bağlantılar için önemlidir.
- Dahili bağlantılar, ziyaretçilerin doğru dahili bağlantıyı kullanarak web sitesinde gezinmesine olanak tanır.
- Googlebot’ların sitenizin yapısını anlamasına yardımcı olur.
- Chema entegrasyonu, arama botlarını bağlantı yapısı hakkında bilgilendirebilir.
- Bu, arama motoru optimizasyonu için mükemmel bir araçtır.
Ne tür ekmek kırıntıları vardır?
Ekmek kırıntısı ve nasıl yapılacağını araştırırken bir şeyi gözden kaçırmış olabilirsiniz. Ekmek kırıntısı stili web sitenizin yapısını belirler.
1. Ekmek Kırıntısı Konumu: Konumsal Kırıntı
Ekmek kırıntıları en yaygın yapılardan biridir. Konum ekmek kırıntıları, ziyaretçilerin web sitenizdeki sayfalar ve kategoriler arasında gezinmesine olanak tanır. Ziyaretçiler sitenizde gezinebilir ve önceki sayfalara kolayca erişebilir. Ziyaretçiler her sayfa veya kategori için hiyerarşiyi daha iyi anlayacaktır.
Örnek: Ana Sayfa>Telefon ve Aksesuarlar>Cep Telefonu Aksesuarları>Kılıf
2. Niteliklerin kırıntısı
Bu yapı sayfa adlarına değil, özniteliklere dayanır. Bu yapı sayfaların konumunu değil, öznitelikleri kullanır. Öznitelik ekmek kırıntısı en çok e-ticaret web sitelerinin arama alanında görünür.
3. Yama Breadcrumb Dinamik Yapısal
Ekmek kırıntısı, tanımı gereği, ekmek kırıntılarından oluşan bir yamadır. Kullanıcı, bir sayfadan diğerine geçmek için tıkladığı bağlantıları bulmak için bunu kullanabilir. Ekmek kırıntısı navigasyonu, kullanıcının ziyaret ettiği sayfaları bir harita şeklinde görmesini sağlar.
Ekmek kırıntısını kullanırken yinelenen sayfa sorunu yaşayabilirsiniz. Bir web sayfasına birden fazla kişi tarafından kolayca erişilebilir. Kanonik veya url yapılarını kullanarak bundan kaçının.
Breadcrumb Yapısı: Dikkat Edilmesi Gerekenler
Galeta unu kullanmadan önce birkaç faktörü göz önünde bulundurmalısınız. Ekmek kırıntıları birçok şekilde bulunabilir ve farklı amaçlar için kullanılabilir. Bunları web sitenizde kullanmak isteyip istemediğinize karar vermelisiniz.
Breadcrumb Parantez Seçimi
Breadcrumb parantezleri genellikle “>” olarak kullanılır. Diğer sınırlayıcılar da kullanılabilir.
- Kısa Hat
- Nokta
- Saç kesimi
- Boyut İşareti
Breadcrumb Konumu
Ekmek kırıntısı, kullanıcının web sitesini ziyaret ederken veya gezinirken dikkatini dağıtmayacak şekilde yerleştirilmelidir.
Ekmek kırıntısı genellikle kategori başlığının altında yer alır ve soldan sağa doğru ilerler. Kullanıcı hangi sayfanın görüntülendiğini ve hangi sayfaları ziyaret ettiğini kolayca belirleyebilir.
Breadcrumb WordPress Eklentileri
Ekmek kırıntıları oluşturabilecek eklentiler arayan WordPress site sahipleri birçok karmaşık eklenti bulacaklardır.
Ekmek kırıntısı oluşturma sorununuzu çözmek için aşağıda verdiğimiz ekmek kırıntısı WordPress eklentilerini kullanın.
- Rankh Math Seo
- Yoast Seo
- Schema.Org
- Ekmek Kırıntıları
Breadcrumb HTML kodu, Bootstrap Breadcrumb Kodları ve Breadcrumb Css
Breadcrumb, WordPress eklentileri ile sitenize kolayca uygulanabilir. Breadcrumb kodu, özel tasarlanmış bir düzene sahip siteler için kullanılır. Breadcrumb için html ve CSS kodu aşağıda listelenmiştir.
HTML Breadcrumb Kodları
Web sitenizin HTML dosyasına breadcrumb HTML’sini ekleyin.
<ul class="breadcrumb"> <li><a href="#">Ürünler</a></li> <li><a href="#">Teknoloji</a></li> <li><a href="#">Bilgisayar</a></li> <li>Acer</li> </ul>
Breadcrumb CSS kodları
Bu yapıdan faydalanmak için breadcrumb kodlarını web sitenizin css’ine ekleyebilirsiniz.
ul.breadcrumb { раним: 10px 16px; list-style: No, you can't.; background-color: #eee; } ul.breadcrumb { This is also available on your screen: Online; font-size: 20px; Color: CurrentColor; } ul.breadcrumb li + li:before { раним: 8px; Color: Cornflowerblue; The following content is available:: "/0a0"; } ul.breadcrumb li a { Color: Cornflowerblue; text-decoration: No, you can't.; } ul.breadcrumb li a:hover { Color: #01447e; text-decoration: Underline; }
Breadcrumb Bootstrap Kodları
Aşağıda verilen kodu kullanarak web sitenizde bir breadcrumb oluşturun. Boottarp breadcrumb kodlarını kullanarak sitenizde breadcrumb tarzı yapılar oluşturun.
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item active" aria-current="page">Home</li>
</ol>
</nav>
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item active" aria-current="page">Library</li>
</ol>
</nav>
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item"><a href="#">Library</a></li>
<li class="breadcrumb-item active" aria-current="page">Learn more about Data</li>
</ol>
</nav>
YoAST SEO’ya breadcrumb bonuslarını nasıl ekleyebilirim?
Breadcrumb nasıl yapılır öğrenmek için aşağıdaki videoyu izleyin. Yoast SEo tarafından hazırlanan video breadcrumb nedir sorunuza cevap verecektir.