Breadcrumb: Apa Itu dan Cara Mengimplementasikannya

Breadcrumb: Apa Itu dan Cara Mengimplementasikannya
David Kaufmann
Tutorial SEO
5 min read

Meskipun Google secara unik menyebutnya "Jalur Navigasi/Penjelajahan", kita yang berada di dunia SEO secara resmi mengenal fitur ini sebagai Breadcrumb. Belakangan ini, telah ada banyak perkembangan baru tentang topik ini, itulah sebabnya kami memutuskan untuk menyusun panduan di mana kami menunjukkan apa itu, cara mengimplementasikannya langkah demi langkah, cara memvalidasi implementasi, dan akhirnya, cara memantau perkembangannya di Search Console.

Mari kita mulai!

Apa itu Breadcrumb?

Breadcrumb adalah fitur yang tujuannya adalah meningkatkan navigasi pengguna dan dengan jelas menunjukkan, baik kepada mesin pencari maupun pengguna, hierarki halaman. Dengan cara ini, pengguna dapat dengan cepat mengunjungi baik halaman akhir maupun kategori-kategori tempat halaman ini berada.

Cara mengimplementasikan breadcrumb

Dalam hal implementasi, saat ini kita memiliki dua opsi: opsi yang terlihat oleh pengguna dan opsi kode. Pada kenyataannya, keduanya harus selalu diimplementasikan bersama dan bukan secara terpisah.

Terlihat

Pada opsi yang terlihat, website mengimplementasikan breadcrumb di bagian atas setiap halaman sehingga pengguna yang mengunjungi halaman tahu persis di mana mereka berada. Misalnya, jika kita melihat halaman produk dari sebuah situs ecommerce (komputer HP Envy), pada breadcrumb kita akan melihat hal berikut:

Beranda > Komputer > HP > Envy Dengan cara ini, kita memberi tahu pengguna bahwa produk yang mereka lihat termasuk dalam kategori komputer dan juga termasuk dalam keluarga komputer HP. Dalam hal navigasi, fitur ini sangat penting karena jika pengguna ingin melihat lebih banyak model HP atau melanjutkan menjelajahi komputer, hanya satu klik saja.

Tanpa fitur ini, navigasi menjadi jauh lebih sulit dan kemungkinan pengguna meninggalkan website jauh lebih tinggi.

Kode

Sementara opsi sebelumnya memungkinkan kita menambahkan breadcrumb untuk pengguna, opsi ini akan memberi tahu mesin pencari bagaimana konten kita dikategorikan. Sangat penting bahwa implementasi ini dilakukan dengan benar karena Google tidak memahami breadcrumb yang hanya terlihat.

Di bawah ini, Anda dapat melihat contoh implementasi Breadcrumb menggunakan fragmen skrip JSON-LD.

<script type="application/ld+json"> { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [{ "@type": "ListItem", "position": 1, "name": "Books", "item": "https://example.com/books" },{ "@type": "ListItem", "position": 2, "name": "Authors", "item": "https://example.com/books/authors" },{ "@type": "ListItem", "position": 3, "name": "Ann Leckie", "item": "https://example.com/books/authors/annleckie" },{ "@type": "ListItem", "position": 4, "name": "Ancillary Justice", "item": "https://example.com/books/authors/ancillaryjustice" }] } </script> Kode di atas memberi tahu kita bahwa buku "Ancillary Justice" ditulis oleh penulis Ann Leckie dan merupakan sebuah buku.

Books > Authors > Ann Leckie > Ancillary Justice

Jika kita telah membangun website dengan pengembangan kustom atau beberapa bahasa utama, kita perlu melakukan implementasi secara manual. Namun, jika kita menggunakan Wordpress, kita memiliki beberapa plugin yang tersedia yang akan membantu kita dengan implementasi ini:

Memvalidasi implementasi

Setelah implementasi selesai, hal yang paling penting adalah memverifikasi bahwa implementasi telah dilakukan dengan benar. Sementara memverifikasi implementasi "yang terlihat" akan sangat sederhana karena kita hanya perlu memeriksa bahwa semua elemen tertaut dengan benar dan berfungsi dengan baik, untuk memverifikasi implementasi kode kita memerlukan sedikit lebih banyak upaya.

Meski begitu, kita memiliki tool Google dan ekstensi Chrome yang akan membuat hidup kita jauh lebih mudah.

Tool Data Terstruktur Google:

Menggunakan tool Google, kita dapat memvalidasi data terstruktur kita baik melalui URL atau pada tingkat kode jika kita memasukkan fragmen secara langsung.

Data Terstruktur Google
Data Terstruktur Google

Tool Data Terstruktur Google

Jika kita memasukkan URL, Google akan mengembalikan analisis dengan semua data terstruktur yang telah dideteksi.

Pengujian Data Terstruktur
Pengujian Data Terstruktur

Contoh analisis URL pada tool data terstruktur Google.

Jika, di sisi lain, kita ingin terlebih dahulu menguji kode JSON-LD Breadcrumb sebelum mengimplementasikannya, kita dapat menggunakan tool "fragmen kode", yang akan memberi kita hasil berikut:

Fragmen Kode Data Terstruktur
Fragmen Kode Data Terstruktur

Tool validasi fragmen kode untuk data terstruktur.

Structured Data Testing Tool (ekstensi Google Chrome)

Jika alih-alih mengunjungi tool Google, kita ingin memvalidasi data terstruktur Breadcrumb (dan lainnya) langsung dari browser, kita dapat menggunakan ekstensi "Structured Data Testing Tool", yang akan menunjukkan kepada kita semua data terstruktur yang terdeteksi serta error yang ada.

Structured Data Chrome
Structured Data Chrome

Ekstensi Chrome untuk memvalidasi Data Terstruktur dengan contoh artikel SEO Alive.

Memantau breadcrumb di Google Search Console

Akhirnya, setelah kita melakukan implementasi dan validasi, yang tersisa adalah memantau aktivitas di Google Search Console, yang akan memungkinkan kita melacaknya setiap hari dan mendeteksi anomali apa pun.

BreadCrumb Search Console
BreadCrumb Search Console

Visualisasi laporan breadcrumb di Search Console (diluncurkan pada September 2019).

Untuk menutup, kami ingin bertanya kepada Anda: apa kesalahan paling umum yang telah Anda temui saat mengimplementasikannya?

Kami ingin menyusun koleksi dan mempublikasikannya di artikel ini untuk membantu profesional SEO lainnya.

Terima kasih banyak dan jangan lupa untuk berbagi komentar Anda!

Referensi

Penulis: David Kaufmann

David Kaufmann

Saya telah menghabiskan lebih dari 10 tahun terakhir benar-benar terobsesi dengan SEO โ€” dan jujur saja, saya tidak mau menukarnya dengan apa pun.

Karier saya mencapai level baru ketika saya bekerja sebagai senior SEO specialist untuk Chess.com โ€” salah satu dari 100 website paling banyak dikunjungi di seluruh internet. Bekerja di skala seperti itu, di jutaan halaman, puluhan bahasa, dan di salah satu SERPs paling kompetitif yang ada, mengajari saya hal-hal yang tidak akan pernah bisa diberikan oleh kursus atau sertifikasi mana pun. Pengalaman itu mengubah cara pandang saya tentang seperti apa SEO yang benar-benar hebat โ€” dan menjadi fondasi bagi semua yang saya bangun setelahnya.

Dari pengalaman itu, saya mendirikan SEO Alive โ€” sebuah agency untuk brand yang serius menggarap pertumbuhan organik. Kami tidak di sini untuk menjual dashboards dan laporan bulanan. Kami di sini untuk membangun strategi yang benar-benar menggerakkan hasil, menggabungkan yang terbaik dari SEO klasik dengan dunia baru yang menarik dari Generative Engine Optimization (GEO) โ€” memastikan brand Anda tidak hanya muncul di tautan biru Google, tetapi juga di dalam jawaban yang dihasilkan AI yang dikirimkan ChatGPT, Perplexity, dan Google AI Overviews kepada jutaan orang setiap harinya.

Dan karena saya tidak bisa menemukan tool yang menangani kedua dunia itu dengan benar, saya membangunnya sendiri โ€” SEOcrawl, sebuah platform enterprise SEO intelligence yang menyatukan rankings, audit teknis, pemantauan backlinks, kesehatan crawl, dan pelacakan visibilitas brand di AI dalam satu tempat. Inilah platform yang selalu saya harap pernah ada.

โ†’ Baca semua artikel oleh David
Artikel lainnya dari David Kaufmann

Temukan lebih banyak konten dari penulis ini