فتات الخبز ومسار المستخدم

1) الدور والقيمة

• إظهار مكاني في التسلسل الهرمي ؛
• وإعطاء طريق العودة السريع إلى المستوى أعلاه ؛
• تقليل «الارتداد» (النقرات المتكررة «العودة») ؛
• زيادة إمكانية الكشف عن الطبقات المجاورة وتحسين تحسين محركات البحث لصفحات المحتوى.

المبادئ: البساطة> التفاصيل، التسلسل الهرمي> تاريخ النقرات، الهيكل المستمر> الضوضاء الديناميكية.

2) متى تستخدم

كتالوجات عميقة ومحتوى (مزود → فئة → لعبة/مقالة).
B2B المسؤولين والتقارير مع 2-3 + مستويات التعشيش.
الركوب الطويل/الأرصفة مع الأقسام وقائمة المحتويات (الفتات + TOC).
غير مطلوب على الشاشات عالية المستوى (لوبي/ديشبورد)، حيث لا يوجد عمق.

3) أنواع الفتات

1. هرمي (هيكلي) - يعكس IA، وليس مسار المستخدم:

«مزودو › المنزلية › يلعبون» n GO › Book of Dead'

2. على طول الطريق (قائم على التاريخ) - عرض المسار الفعلي (نادرًا ما يكون مناسبًا على الويب ؛ أقرب إلى «العودة»).
3. هجين - التسلسل الهرمي + الخطوة الأخيرة مع المرشحات/السياق المحفوظ.

التوصية: بشكل افتراضي - هرمي لتجنب «الضوضاء» من التحولات العشوائية.

4) التكوين والشكل

Delimiter: '›' أو '/' (بما يتفق مع التصميم والموقع).
نقطة البداية: «المنزل «/الشعار قابل للنقر.
القطع: في العمق> 4 مستويات، إخفاء الروابط الوسطى في... «» مع الكشف.
العنصر الأخير: الصفحة الحالية، غير قابلة للنقر ولهجة بصرية.
أطوال العنوان: مقطوعة مع القطع الناقص ولكن «العنوان» الكامل/تلميح الأدوات عند التحليق/التركيز.

5) جيل الفتات (منطق)

قم بالبناء وفقًا للتسلسل الهرمي لعنوان URL/IA القانوني، وليس عن طريق الإحالة.
بالنسبة للكيانات (لعبة/مقالة)، خذ الفئة الرئيسية (أو فئة «الخبز»)، وليس العلامات العشوائية.
بالنسبة للصفحات الديناميكية (المرشحات، الفرز) - تشير الفتات إلى المسار إلى القسم الأساسي، ويظهر السياق بشكل منفصل (رقائق المرشح).
مع تعدد الإيجارات، أضف سياق العلامة التجارية/المشغل في البداية أو في المحدد جنبًا إلى جنب، ولكن لا تفرط في تحميل الفتات.

6) المرشحات والفرز والتجميع

يجب ألا «تطيل» المرشحات الفتات. عرضها أدناه في رقائق ("› Live Providers' + chips: Geo = CA، Device = Mobile).
لا يتم تضمين التثبيت في الفتات ؛ وترد الصفحة الحالية في قائمة التحكم.
إعادة تعيين المرشحات عن طريق النقر على مستوى الأم: العودة إلى فئة «نظيف».

7) Mobile UX

وضع الفتات تحت H1 في سطر واحد ؛ في حالة عدم وجود مساحة - التمرير الأفقي أو اقتطاع الروابط الوسطى.
أهداف النقر ≥ 44px، تركيز ملحوظ للملاحة على لوحة المفاتيح (لـ PWA).
لا تكرر نظام «العودة» - الفتات للبنية، الزر - للتاريخ.

8) التوافر (A11y)

استخدم الدلالات 'nav [aria-label = «breadcrump»] و' ol> li '.
حدد "aria-current =" page "على العنصر الأخير.
ويتطابق التباين بين الإشارات و WCAG AA ؛ التركيز - مرئي.
الرمز/الفاصل ليس الإشارة الوحيدة (هناك ملصقات نصية).
الترتيب في DOM يتوافق مع الترتيب البصري.

9) SEO والبيانات

لصفحات المحتوى، استخدم البيانات المنظمة BreadcrumbList (JSON-LD).
تساعد عناوين URL الكنسية والفتات المستقرة في البحث على فهم التسلسل الهرمي.
لا تفهرس العقد المتوسطة «الفارغة» بدون محتوى (تجنب الصفحات الرقيقة).

10) أنماط العرض

المسلسل الكلاسيكي: «Home › Section › Submission › Page».
مبتورة: «› المنزلي... بطاقة › من الفئة ›».
مع سياق العلامة التجارية (B2B): «العلامة التجارية A › Reports › Revenue › NGR».
مع المراسي في الأرصفة: "التوثيق › KYC › # Levels-checks' (المرساة - في TOC، الفتات - قبل القسم).

11) السلوك والتدخلات الدقيقة

يسلط التحليق/التركيز الضوء على منطقة الارتباط والنقر («الفتات» بأكملها، وليس النص فقط).
يمكن أن تحتوي «الفتات» الأخيرة على قائمة إضافية مع الكيانات المجاورة (على سبيل المثال، ألعاب أخرى لهذا المزود) - بدقة، دون تحميل زائد.
الارتفاع يحافظ على موضع/صفحة القائمة ما لم يكسر القانون (على سبيل المثال إلى '؟ الصفحة = 2 ').

12) المقاييس والقياس عن بعد

• 'breadcrumb _ click (المستوى، الملصق، url)'
• «فتات الخبز _ التوسع _ المزيد» (للمقتطع)
• "back _ to _ parent _ reduced _ context' (إذا تم الاحتفاظ بالموقع/الصفحة)

• معدل الاستخدام: نسبة المستخدمين الذين نقروا على الفتات بعمق ≥2.
• ↓ الارتداد الخلفي: تقليل كمية «العودة» مباشرة بعد تسجيل الدخول إلى الصفحة العميقة.
• الوقت إلى الوالدين: حان الوقت للعودة إلى مستوى أعلى.
• SEO CTR: تغيير CTR للصفحات ذات الفتات.

13) أمثلة على iGaming

B2C (كازينو): "Home › Providers › Pragmatic Play › Gates of Olympus'. على صفحة المزود - رقائق التصفية (Live/Slots/Megaways) ؛ الفتات - الهيكل فقط.
البطولات: «البطولات › الرئيسية › قواعد › كأس الخريف».
B2B (المزود): 'لوحة › المحتوى › الإصدارات › كتاب Ra (ID 12345)' - العنصر الأخير غير قابل للنقر ؛ بجانب الفتح في زر البيان.

14) أنتيباترن

الفتات التي تكرر H1 كلمة لكلمة دون فائدة.
الطرق التاريخية بدلاً من البنية («سلسلة» فوضوية).
إدراج المرشحات والوثب في الفتات («Games › Slots › page = 5»).
الفتات الأخيرة هي إشارة إلى نفسها.
عمق مفرط، حجم صغير، تباين منخفض - «فتات غير مرئية».
أسماء الربط غير المتسقة مع القائمة/عنوان URL.

15) قائمة التنفيذ المرجعية

1. خريطة IA: حدد المسارات القانونية للكيانات.
2. المولد: وظيفة تبني الفتات من IA/URL (لا تعتمد على المرجع).
3. القطع: القواعد في العمق> 4، البوبور مع المسار الكامل.
4. A11y/SEO: 'nav [aria-label]', 'ol/li', 'aria-current', JSON-LD.
5. الأسلوب: تباين AA، † على الهاتف المحمول، والفواصل، والأبعاد.
6. السياق: المرشحات/الفرز - الرقائق أدناه، وليس في الفتات.
7. القياس عن بعد: انقر فوق الأحداث/التوسع، الوقت إلى الوالدين، الارتداد.
8. الوثائق: أمثلة، حالات مضادة، دليل تسمية الروابط.

16) خلاصة القول

1. استنادا إلى التسلسل الهرمي القانوني،

2. مقروءة ويمكن الوصول إليها،

3. مقاومة للفلاتر/الصفحات،

4. ذات فائدة قابلة للقياس (القياس عن بُعد/التحليل الخاص).

لذا فهي تساعد حقًا في التنقل وتقصير مسار المستخدم إلى الهدف.