Breadcrumb โ bu \"non ushlash\" navigatsiya. Sahifaning yuqori qismida \"Bosh sahifa โบ Hosting โบ WordPress hosting\" kabi yo'l ko'rsatadi. Bu foydalanuvchiga sayt strukturasini ko'rsatish va yuqori darajaga oson qaytish imkonini beradi. Breadcrumb kichik element, lekin UX'ga katta ta'sir qiladi โ ayniqsa katta saytlarda.
Nima uchun breadcrumb kerak
Birinchidan โ orientation. Foydalanuvchi qaerda ekanini biladi. Ayniqsa qidiruvdan to'g'ridan-to'g'ri chuqur sahifaga kelganda.
Ikkinchidan โ navigation. Yuqori darajaga oson qaytish. Browser back tugmasidan ko'ra aniqroq.
Uchinchidan โ SEO. BreadcrumbList Schema bilan Google qidiruv natijasida URL o'rniga breadcrumb ko'rinadi.
Breadcrumb turlari
Location-based โ sayt strukturasi bo'yicha. \"Bosh sahifa โบ Hosting โบ WordPress hosting\". Eng tarqalgan.
Attribute-based โ mahsulot atributlari bo'yicha. \"Erkaklar โบ Poyabzal โบ Sport โบ Adidas\". E-commerce uchun.
Path-based โ foydalanuvchi yo'li bo'yicha (qaysi sahifa orqali kelganini ko'rsatadi). Kam ishlatiladi, chunki chalkash.
Breadcrumb dizayn
Joylashish: sahifa yuqorisida, header'dan keyin, asosiy kontent boshida.
Vizual: oddiy, kichik, neutral rang. \"โบ \" yoki \"/\" yoki \"-\" ajratuvchi.
Oxirgi element โ joriy sahifa, klik bo'lmaydi, biroz to'qroq rang.
Boshqa elementlar โ link, hover'da underline yoki rang o'zgaradi.
HTML implementatsiya
Semantic HTML: <nav aria-label=\"breadcrumb\"> bilan o'rab oling. <ol> ichida <li> elementlar.
<nav aria-label=\"breadcrumb\">
<ol>
<li><a href=\"/\">Bosh</a></li>
<li><a href=\"/hosting\">Hosting</a></li>
<li aria-current=\"page\">WordPress</li>
</ol>
</nav>
BreadcrumbList Schema
SEO uchun JSON-LD schema. Google qidiruv natijasida URL o'rniga breadcrumb ko'rsatadi.
Bu CTR'ni 15-20% oshiradi va foydalanuvchi sahifa qaysi kategoriyaga tegishli ekanligini darrov tushunadi.
Mobile breadcrumb
Mobile'da breadcrumb kichik joy egallashi shart. Variantlar: 1. Faqat orqaga link \"โบ Hosting\" (oldingi sahifa). 2. To'liq breadcrumb (kichik shrift bilan). 3. Hide va menu icon bilan ochish.
Strategiya: e-commerce uchun to'liq, blog uchun minimal yetadi.
Breadcrumb va sayt strukturasi
Breadcrumb URL strukturasiga mos kelishi yaxshi. URL: sayt.uz/blog/seo/title-tag โ Breadcrumb: \"Bosh โบ Blog โบ SEO โบ Title tag\".
Bu Google va foydalanuvchiga sayt strukturasi haqida konsistent ma'lumot beradi.
Breadcrumb chuqurlik
Breadcrumb darajalar soni: optimal 3-5. 6+ chuqur sahifalar foydalanuvchi adashishi mumkin.
Agar sayt 6+ darajali bo'lsa โ sayt strukturasini qayta ko'rib chiqing. Yoki o'rta darajalarni \"...\" bilan qisqartiring (\"Bosh โบ ... โบ WordPress\").
Joriy sahifa ko'rsatish
Breadcrumb oxirgi elementi โ joriy sahifa. Klikable bo'lmaydi. Biroz to'qroq rang bilan ko'rsatish.
aria-current=\"page\" โ accessibility uchun, screen reader bilishi shart.
Breadcrumb va kategoriya sahifa
Kategoriya sahifa (Bosh โบ Blog โบ SEO) breadcrumb'i โ foydalanuvchi shu kategoriyaga tegishli boshqa post'larni ko'rishi mumkin.
SEO kategoriya bo'limini bossa โ barcha SEO postlar ro'yxati.
Breadcrumb font va o'lcham
Body matnidan kichik. Body 16px bo'lsa, breadcrumb 13-14px. Lekin o'qishga qulay bo'lishi shart.
Color: link uchun brand rangi yoki neutral kulrang. Hover'da to'qroq.
Breadcrumb va search
Foydalanuvchi Google qidiruvdan chuqur sahifaga kelsa โ breadcrumb darhol \"qaerda men\" deb javob beradi.
Yuqori sahifalarni o'rganishni xohlash holatida โ breadcrumb orqali oson navigation.
Breadcrumb va home link
Breadcrumb birinchi elementi โ \"Bosh sahifa\" yoki home icon. Foydalanuvchi har vaqt bosh sahifaga qaytish mumkin.
Common breadcrumb xato
1. Breadcrumb yo'q (katta sayt'da).
2. URL bilan mos kelmaydi.
3. Juda chuqur (8+ daraja).
4. BreadcrumbList Schema yo'q.
5. Mobile'da yashirish.
6. Joriy sahifa link bo'lib qoladi.
Breadcrumb tools
WordPress: Yoast SEO, Rank Math (Schema bilan), NavXT plugin.
Custom: HTML/CSS bilan oddiy implementatsiya. PHP/JS bilan dinamik.
Breadcrumb shart bo'lmagan saytlar
Kichik sayt (3-5 sahifa). Landing page (faqat bitta sahifa). Bosh sahifa (foydalanuvchi allaqachon yuqorida).
Sayt.uz breadcrumb amaliyot
Sayt.uz har sahifada breadcrumb mavjud (bosh sahifa bundan mustasno). PHP'da dinamik yaratiladi.
Misol: Bosh โบ Blog โบ SEO โบ Title tag SEO optimizatsiya. URL bilan to'liq mos.
BreadcrumbList Schema markup. Google qidiruv natijasida URL o'rniga \"sayt.uz โบ Blog โบ SEO\" ko'rinadi.
Mobile'da kichik shrift (12px) bilan to'liq breadcrumb. Hide qilmaymiz โ orientation muhim.
aria-label=\"breadcrumb\", aria-current=\"page\". Accessibility WCAG AA.
Natija: CTR Google qidiruv natijasida +15% (BreadcrumbList Schema ta'siri). Pages per session yaxshilangan.