ব্রেডক্রাম্ব
একটি নেভিগেশনাল হায়ারার্কির মধ্যে বর্তমান পৃষ্ঠার অবস্থান নির্দেশ করুন যা স্বয়ংক্রিয়ভাবে CSS এর মাধ্যমে বিভাজক যোগ করে।
বিভাজক স্বয়ংক্রিয়ভাবে CSS-এ ::before
এবং এর মাধ্যমে যুক্ত হয় content
।
<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">Data</li>
</ol>
</nav>
যেহেতু ব্রেডক্রাম্বগুলি একটি নেভিগেশন প্রদান করে, তাই একটি অর্থপূর্ণ লেবেল যোগ করা একটি ভাল ধারণা যেমন উপাদানটিতে aria-label="breadcrumb"
দেওয়া নেভিগেশনের ধরন বর্ণনা করার পাশাপাশি সেটের শেষ আইটেমটিতে একটি প্রয়োগ করা যাতে বোঝা যায় যে এটি বর্তমান পৃষ্ঠার প্রতিনিধিত্ব করে।<nav>
aria-current="page"
আরও তথ্যের জন্য, ব্রেডক্রাম্ব প্যাটার্নের জন্য WAI-ARIA অথরিং প্র্যাকটিস দেখুন ।