MenusLesson 51Preview gratis
Breadcrumbs
Lesson ini bagian dari How To · Semua level
Ringkasan
Breadcrumbs adalah jejak navigasi yang menunjukkan posisi pengguna dalam hierarki situs, misalnya Beranda > Produk > Sepatu. Komponen ini membantu pengunjung kembali ke level sebelumnya tanpa menekan tombol back. Struktur yang baik menggunakan daftar berurutan, pemisah visual, dan penanda halaman terakhir.
Poin kunci
- Gunakan <nav aria-label="Breadcrumb"> dan daftar <ol> untuk struktur hierarki.
- Pemisah seperti garis miring dapat dibuat dengan pseudo-element ::before.
- Item terakhir menandai halaman saat ini dan sebaiknya tidak berupa tautan.
- aria-current="page" memperjelas item yang sedang dibuka.
- list-style: none menghilangkan bullet bawaan daftar.
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.