School of Information Systems

Jenis-Jenis Sistem Navigasi Breadcrumbs

Breadcrumbs merupakan sebuah istilah yang merujuk pada desain sistem navigasi sekunder untuk menunjukkan lokasi halaman situs pengguna berada tanpa memeriksa struktur URL. Breadcrumbs pada umumnya diletakkan pada posisi halaman atas situs dan bsering digunakan pada e-commerce yang memiliki banyak kategori. Kehadiran breadcrumbs diharapkan mampu untuk meningkatkan kegunaan dari produk.

Ada beberapa jenis breadcrumbs yang dapat ditemukan: 

  • Breadcrumbs Berbasis Hierarki 

Breadcrumbs yang berbasis hierarki adalah navigasi yang berfungsi untuk memberi tahu lokasi pengguna berdasarkan struktur website dan alur untuk kembali ke halaman beranda. Breadcrumbs yang berbasis hierarki merupakan pilihan yang tepat jika terdapat produk dengan dua tingkat lebih, sehingga mampu mendukung pengguna yang membuka situs pada halaman tingkat lebih rendah.  

Contoh: Beranda > Layanan > Jasa Pembuatan Website  

 

  • Breadcrumbs Berbasis Atribut 

Breadcrumbs yang berbasis atribut adalah navigasi yang berfungsi untuk memberi tahu lokasi pengguna berdasarkan halaman yang sudah dikunjunginya. Breadcrumbs berbasis atribut biasanya sering digunakan oleh e-commerce. Hal ini dikarenakan breadcrumbs berbasis atribut menampilkan kategori yang semakin luas, sehingga pengguna dapat melakukan pencarian produk dengan jauh lebih mudah. 

Contoh: Beranda > Pakaian Pria > Outerwear > Sweater & Cardigan 

 

  • Breadcrumbs Berbasis Riwayat Browser 

Breadcrumbs yang berbasis riwayat browser adalah navigasi yang berfungsi untuk memberi tahu lokasi pengguna berdasarkan apa yang sudah pengguna lakukan di dalam situs. Hal ini memiliki makna bahwa skema navigasi dapat berubah-ubah dan berpotensi untuk membuat pengguna menjadi bingung karena terdapat dua skema navigasi yang berbeda dalam mencapai tujuan halaman situs yang sama. 

Contoh: Beranda > Artikel 1 > Artikel 2 > Artikel 1 > Halaman saat yang sedang dibuka saat ini 

 

Referensi 

  • https://www.logique.co.id/blog/2021/03/15/breadcrumbs-website/ 
  • https://www.eannovate.com/blog/2775_breadcrumb-navigation-design—-what-you-need-to-know.html 
  • https://www.republika.co.id/berita/qizjy34817000/apa-itu-breadcrumbs 
  • https://www.affde.com/id/breadcrumbs-seo.html 
Laksamana Kusuma