Breadcrumb là gì? Cách phân loại và vai trò của Breadcrumb

Ngày đăng: 08/06/2022
Tác giả: Vũ Việt Hoàng
Breadcrumb là gì? Cách phân loại và vai trò của Breadcrumb
Breadcrumb là thành phần phụ nhưng đóng vai trò quan trọng giúp cải thiện trải nghiệm người dùng. Thành phần này được sử dụng nhiều tại các website uy tín và có khối lượng thông tin khổng lồ. Breadcrumb có nhiều loại để phù hợp với nhiều dạng website khác nhau. Nhờ đó, hỗ trợ doanh nghiệp tối ưu hóa từng trang web tốt hơn. Vậy Breadcrumb là gì lại mang đến nhiều lợi ích như thế?

I. Breadcrumb là gì?

Breadcrumb còn được biết đến với tên gọi Breadcrumbs trail. Breadcrumb là tập hợp các liên kết giúp người dùng có thể xác định được vị trí của mình trên website. Hiện nay, hầu hết các website đều sử dụng Breadcrumb để giúp người xem có thể dễ dàng thao tác hơn.
Thành phần này của web được đặt tên là “Mẩu bánh mì” vì nó có giống một chi tiết trong chuyện cổ Grimm. Câu chuyện đằng sau cái tên Breadcrumb là gì? Cái tên Breadcrumb được lấy cảm hứng từ câu chuyện Hänsel và Gretel của anh em nhà Grimm. 
Trong truyện, hai chị em Hänsel và Gretel rắc các mẫu bánh mì để đánh dấu đường về nhà. Đây là chi tiết được các nhà phát triển sử dụng để thiết lập và đặt tên cho công cụ Breadcrumb. 
Trong các website hiện nay, người ta thường thể hiện Breadcrumb ở dạng liên kết văn bản và được phân cách bởi ký hiệu “/” hoặc “>”. Người dùng có thể tìm thấy các Breadcrumb ở đầu và dưới tên của mỗi trang. Dạng của Breadcrumb là Trang chủ / Mục 1 / Mục nhỏ 1. Dưới đây là một ví dụ về Breadcrumb trong website.
breadcrumb-la-gi
 

II. Phân loại Breadcrumbs là gì?

Người ta sẽ phân loại Breadcrumb dựa trên nhiều tiêu chí khác nhau bao gồm vị trí, thuộc tính, đường dẫn,... Hiện nay, các website sử dụng một trong ba loại Breadcrumb chính như sau.

1. Location Breadcrumbs là gì?

Loại Breadcrumb theo vị trí có tên là Location Breadcrumbs. Breadcrumb này sẽ giúp người dùng nhận biết được vị trí hiện tại của mình trên website. Thông qua Breadcrumb theo vị trí, khách truy cập có thể hình dung được khái quát cấu trúc phân cấp của website. Người dùng sẽ nhận thấy rằng mỗi mục ở giữa dấu phân cách sẽ là một cấp trong cấu trúc web phân tầng.

breadcrumb-la-gi
 
Ví dụ, giả sử, hai trang của một website có Breadcrumb site là Trang chủ / Tivi / Smart Tivi / 50W660G và Trang chủ / Micro / Micro Shure / SH 300G. Từ hai Breadcrumb trên, người dùng có thể đoán được rằng Tivi và Micro sẽ là tầng dưới của Trang chủ. Bên cạnh đó, có thể dự đoán hai mục này cùng cấp với nhau. Nếu áp dụng với các trang khác, người dùng có khả năng đưa ra được sơ đồ cấu trúc tương đố chính xác của website đó.

2. Attribute Breadcrumbs là gì?

Breadcrumb theo thuộc tính được gọi là Attribute Breadcrumbs. Để sử dụng loại Breadcrumb này, mỗi mục của website nên có lượng sản phẩm tương đối lớn. Ngoài ra trong cấu trúc silo của web, số lượng các tầng không nên có quá nhiều (thông thường là 3 đến 4 tầng).
Để hiểu hơn về Attribute breacrumb, hãy cùng Ori tìm hiểu cấu trúc Silo là gì, và cách xây dựng cấu trúc Silo.

breadcrumb-la-gi
 
Vì lý do trên mà Attribute Breadcrumbs thường được sử dụng nhiều trong các trang thương mại điện tử hiện nay. Loại Breadcrumb này được đánh giá có độ linh hoạt tốt nếu biết cách sắp xếp các category hợp lý. 
Ví dụ, một trang A có Breadcrumbs site là Trang chủ > Giày > Da > Nam > Lớn. Breadcrumb này thể hiện thứ tự truy cập của người dùng để đến được trang A. Tuy nhiên, nếu người dùng truy cập theo thứ tự như sau Trang chủ > Giày > Nam > Lớn > Da thì trang kết quả trả về sẽ là trang A. 
Ví dụ trên cho thấy việc Attribute Breadcrumbs không phụ thuộc vào cấu trúc của website. Nhờ đó, người dùng có thể linh hoạt chuyển trang và tìm đến sản phẩm mình mong muốn khi đã tìm đủ các thuộc tính của mặt hàng.

3. Path Breadcrumb là gì?

Breadcrumb theo đường dẫn còn được biết đến với cái tên Path Breadcrumbs. Đây là loại Breadcrumb hiển thị cho người dùng các mục mà họ đã xem qua một cách chi tiết. Tính năng của loại Breadcrumb này tương tự như nút Back. Tuy nhiên, nó lại thể hiện được đường đi của người dùng ngay tại website. 

breadcrumb-la-gi
 
Loại Breadcrumb này tương đối đơn giản trong thao tác thiết kế nhưng lại không được nhiều người sử dụng. Đó là vì nó không giúp người dùng định vị được vị trí của bản thân trong website. Bên cạnh đó, vì nó tương tự nút Back nên nhiều người xem Path Breadcrumbs là không cần thiết trong thiết lập website. Ngoài ra, việc sử dụng loại Breadcrumb này có thể gây rối mắt cho người dùng khi sử dụng. 
Ví dụ, người dùng vào Trang chủ rồi chọn mục Tivi sau đó vào Smart Tivi. Sau đó họ lại thoát ra về trang chủ và chọn mục Điện thoại và chọn tiếp Iphone. Cuối dùng, người dùng chọn vào mục Iphone 7. Khi đó, Breadcrumbs site của trang Iphone 7 là Trang chủ > Tivi > Smart Tivi > Tivi > Trang chủ > Điện thoại > Iphone > Iphone 7. 
Trong các trang thương mại điện tử, người dùng có xu hướng lựa chọn các sản phẩm bằng cách thoát trang liên tục. Điều này làm Breadcrumb có thể bị quá dài. Do đó, hiện nay Breadcrumb theo đường dẫn ít được mọi người sử dụng.

III. Vai trò của Breadcrumb là gì?

Breadcrumb hỗ trợ tăng trải nghiệm người dùng khi truy cập website trong chiến dịch SEO Onpage. Những website truyền thống thường không có các tính năng như Breadcrumb để giúp người dùng cải thiện trải nghiệm. Tuy nhiên, hiện nay, đặc biệt là các trang web lớn, có độ uy tín cao. Vậy vai trò của Breadcrumb là gì lại cần thiết cho những website này đến vậy?

1. Tương quan giữa trải nghiệm người dùng và Breadcrumb là gì?

Breadcrumb cung cấp cho người dùng một số thông tin về website. Từ Breadcrumb, khách truy cập sẽ biết được vị trí của mình trong website hay lịch sử truy cập cá nhân. Nhờ vậy, họ có thể dễ dàng điều hướng trang trở về các mục mình cần một cách dễ dàng. Bên cạnh đó, Breadcrumb còn khuyến khích người dùng di chuyển vào các phần sâu hơn trong cấu trúc website.
Ví dụ, một trang có Breadcrumb là Trang chủ / Tivi / Smart Tivi / 50W660G. Người dùng có thể trỏ về trang Tivi chỉ với một cái click chuột. Ngoài ra, việc loại bỏ hoặc thêm các thuộc tính trong Attribute Breadcrumbs sẽ giúp người dùng chuyển về các trang khác để lựa chọn sản phẩm. Hơn nữa, với Breadcrumb theo đường dẫn, người dùng có thể trỏ về bất cứ lịch sử truy cập nào của bản thân.

breadcrumb-la-gi
 
Breadcrumb là phương pháp hữu hiệu giúp người dùng có thể chủ động tìm kiếm thông tin hơn. Breadcrumb còn đóng vai trò hỗ trợ người dùng tập hợp các đặc điểm để tìm được sản phẩm phù hợp. Vai trò này sẽ được thể hiện rõ trong các website có khối lượng nội dung lớn hoặc có cấu trúc phức tạp.

2. Cải thiện xếp hạng trang web

Breadcrumb còn giúp cải thiện xếp hạng cho trang web. Một trong những tiêu chí giúp thăng hạng cho website là hỗ trợ bot Google thu thập dữ liệu dễ dàng hơn. Đối với Breadcrumb, bot Google có thể nhận biết được cấu trúc website dễ dàng hơn. Con bot có thể sắp xếp để truy vấn dữ liệu theo thứ tự các mục trong Breadcrumb. Vai trò này thể hiện rõ ở Breadcrumb theo vị trí
Năm 2018, Google đã thêm Breadcrumb vào danh sách các tiêu chí để đánh giá chất lượng của website. Trong SERPs, các kết quả top đều có Breadcrumb được hiển thị màu xanh. Tuy nhiên, đến năm 2022, Google đã đưa hẳn đường lên kết của website thay thế cho Breadcrumb. 

3. Giảm tỷ lệ thoát, tăng tỷ lệ giữ chân người dùng

Breadcrumb giúp giảm tỷ lệ thoát và giữ chân người dùng hiệu quả, đặc biệt là Breadcrumb theo thuộc tính và vị trí. Nhờ hai loại Breadcrumb này, người dùng có thể quay lại các trang trước đó dễ dàng thay vì thoát trang. 

breadcrumb-la-gi
 
Nhờ giữ chân khách hàng tốt, Breadcrumb còn hỗ trợ những website thương mại điện tử tăng doanh thu. Đó là vì người dùng sẽ tìm ra được sản phẩm mong muốn nhờ tập hợp các đặc điểm của sản phẩm. Vì thế, khả năng chốt đơn của khách hàng sẽ được nâng cao. Việc này dẫn đến tăng khả năng cạnh tranh của website so với các đối thủ.
Ví dụ, một người chọn sản phẩm Giày với các đặc điểm Lớn, Cổ cao, Vải và Giá dưới 1 triệu. Tuy nhiên trong quá trình tìm kiếm, khách hàng có thể muốn tìm sản phẩm Cổ thấp. Khi đó, họ chỉ cần thay đổi trên Breadcrumb theo thuộc tính để thay đổi đặc điểm. Vì vậy thời gian ở lại trang của khách hàng được nâng cao đáng kể. Đây là tiêu chí giúp Google đánh giá cao website bất kỳ.

4. Tăng cường liên kết nội bộ và hạn chế bấm nút Back

Nhờ Breadcrumb, các trang web có thêm nguồn để gắn các liên kết nội bộ. Tại mỗi mục trong Breadcrumb, người thiết kế web có thể đặt một Internal Link. Nhiều liên kết nội bộ cũng giúp website được SEO tốt hơn. Google sẽ đánh giá chất lượng website qua các liên kết nội bộ tại các vị trí hợp lý. 
Bên cạnh đó, Breadcrumb còn hạn chế việc nhấn Back nhiều lần. Điều này đặc biệt hữu ích đối với lịch sử truy cập dài như Trang chủ > Tivi > Smart Tivi > Samsung > 4K Ultra HD > 70 inch > 70RU7200. Việc giúp người dùng cảm thấy tiện lợi trong quá trình sử dụng cũng sẽ giúp cải thiện trải nghiệm và tỷ lệ thoát trang của khách truy cập.

IV. Quy tắc sử dụng Breadcrumb là gì?

Breadcrumb có một số đặc điểm riêng khác với các phần khác của website như thiết kế và vai trò. Dựa vào hai tiêu chí trên thì quy tắc sử dụng Breadcrumb là gì?

1. Breadcrumb không thể thay thế main navigation/ top menu

Breadcrumb là thành phần phụ nên có trong website để giúp người dùng truy cập và sử dụng web tiện lợi hơn. Do đó, nó không thể thay thế main navigation / top menu. Khả năng điều hướng của Breadcrumb không linh hoạt bằng top menu. 
Đó là vì Breadcrumb chỉ có thể điều hướng theo chiều dọc. Trong khi đó, top menu có thể điều hướng người dùng theo cả chiều dọc và chiều ngang. Do đó, người thiết kế website nên ưu tiên xây dựng top menu thu hút trước khi tiến hành thiết lập Breadcrumb.

breadcrumb-la-gi
 

2. Quy tắc trong thiết kế của Breadcrumb là gì?

Về định dạng, font chữ và cỡ chữ của Breadcrumb nên nhỏ hơn so với tiêu đề hay tên website. Đó là vì đây là thành phần phụ hỗ trợ người dùng sử dụng web tốt hơn chứ không phải tiêu điểm chính. Vì vậy, nhà thiết kế cần cân bằng màu chữ, cỡ chữ và font chữ để tránh việc người dùng quá chú ý vào Breadcrumb và bỏ qua các thông tin quan trọng khác.
Về vị trí, nhà thiết kế web nên đặt Breadcrumb ở đầu trang và bên dưới tiêu đề. Vì đây là vị trí dễ nhìn thấy nên giúp người dùng dễ dàng tìm ra và sử dụng. Bên cạnh đó, các từ đại điện cho từng trang cần hợp lý và ngắn gọn. Tránh sử dụng các cụm từ dài gây chiếm diện tích của giao diện.
Thông qua bài viết, chúng tôi đã giới thiệu cho người dùng các vấn đề xoay quanh từ khóa Breadcrumb là gì. Breadcrumb là công cụ hữu ích đối với những người làm SEO nói riêng và marketing nói chung. Nếu còn thắc mắc về Breadcrumb hay cần hỗ trợ dịch vụ marketing thì hãy lên hệ ORI để được tư vấn nhiệt tình. Nếu sử dụng các gói dịch vụ marketing, chúng tôi sẽ hỗ trợ cho bạn các chính sách mua hàng và nhiều ưu đãi hấp dẫn.

  • Tags
Thực hiện Bởi: ORI MARKETING AGENCY

Tác giả

Breadcrumb là gì? Cách phân loại và vai trò của Breadcrumb
Vũ Việt Hoàng
Về đầu trang
0962085490