Breadcrumb là một trong những thành phần quan trọng trên một website giúp mang lại trải nghiệm tốt cho người dùng cũng như được Google đánh giá rất cao. Vậy cụ thể Breadcrumb là gì? Nó mang lại những lợi ích cụ thể nào? Các cài ra sao? Cùm tìm hiểu ngay sau đây!!!
Nội dung chính
Breadcrumb là gì?
Breadcrumb là một tập hợp các liên kết giúp cho người dùng, người đọc xác định được vị trí hiện tại của mình trên website. Đối với một website có cấu trúc phức tạp hay có nhiều nội dung, nhiều trang, thì Breadcrumb chính là giải pháp hiệu quả để xác định được vị trí và thuận tiện hơn khi người dùng di chuyển giữa các trang.
Các loại Breadcrumb phổ biến
Breadcrumb có 3 loại phổ biến:
1- Breadcrumb theo vị trí trang
Loại này còn có tên Location-Based Breadcrumb. Và đây là loại phổ biến nhất và loại này dùng tốt nhất cho những website mà nội dung được chia nhiều tầng (>=2).
2- Breadcrumb theo thuộc tính
…Hay còn gọi là Attribute-based breadcrumb, thể hiện thuộc tính của một page trong website. Đây là loại thanh điều hướng gồm các đường link theo thuộc tính nào đó, chẳng hạn như thuộc tính của sản phẩm. Chính vì thế, loại này được ứng dụng nhiều trong các website thương mại điện tử để lọc sản phẩm theo các tiêu chí cụ thể. Tương ứng với mỗi tiêu chí là một đường link đến 1 nhóm sản phẩm có cùng tiêu chí đó
Thông thường, loại này kết hợp với loại breadcrumb theo cấu trúc phân tầng, để tăng hiệu quả tối ưu trải nghiệm với người dùng.
3- Breadcrumb theo đường dẫn
Path-Based Breadcrumb chỉ ra các bước, hoặc đường dẫn mà người dùng đã đi qua để truy cập đến một trang cụ thể. Về chức năng, loại này hoạt động tương tự như nút Back và Forward trên trình duyệt. Cũng vì vậy, trong 3 loại Breadcrumb thì loại này được sử dụng ít nhất.
Lợi ích khi sử dụng Breadcrumb trên website
Khi sử dụng Breadcrumb, chúng ta có thể được nhiều lợi ích, và sau đây chúng tôi sẽ liệt kê 3 lợi ích chính mà Breadcrumb mang lại.
1- Mang lại trải nghiệm tốt cho người dùng
Tiện lợi cho người dùng là một trong những công dụng chính của Breadcrumb. Nó hỗ trợ để người dùng điều hướng một trang web. Đối với một website lớn với nhiều nội dung, breadcrumb giúp người dùng định vị bản thân so với cấu trúc toàn site.
Ngoài ra, thay vì sử dụng nút “Back” hoặc top menu của website để quay trở lại thì người dùng có thể sử dụng Breadcrumb và dễ dàng di chuyển đến các category trong website một cách dễ dàng.
2- Giảm Bounce Rate và tăng Time On Site
Thông thường, người dùng sẽ truy cập trang web nằm top đầu trong kết quả tìm kiếm Google. Thanh Breadcrumbs sẽ xuất hiện “trước – trong – sau” sau tiêu đề trang. Điều này làm tăng khả năng quan tâm và tiếp tục nhấp vào đường link, Breadcrumbs giúp người dùng tìm đến danh mục ở cấp độ cao hơn, dễ dàng tìm đến nội dung tương tự trong trang.
Trong trường hợp người dùng rời đi nhưng họ tiếp tục xem nội dung tiếp theo của trang, điều này giúp giảm tỷ lệ thoát rất nhiều.
Xem thêm: Cách tối ưu tỷ lệ thoát – Bounce Rate đơn giản, hiệu quả
2- Giúp tối ưu SEO hiệu quả
Không chỉ nâng cao trải nghiệm người dùng, Breadcrumb còn có tác động tích cực đến SEO và công cụ tìm kiếm Google. Trên thực tế, Google đánh giá cao các website sử dụng Breadcrumbs một cách hợp lý, Google cho rằng những website này có thể giúp người dùng của họ có được trải nghiệm tốt khi sử dụng Google. Từ đó, sẽ mang đến những kết quả tích cực trong việc xếp hạng website trên công cụ tìm kiếm.
Khi khai báo dữ liệu cấu trúc này sẽ hiển thị dưới dạng Rich Snippet trên kết quả tìm kiếm Google. Và khi áp dụng Schema Markup cho Breadcrumbs cũng sẽ hiển thị cấu trúc này.
Trước kia là thay vì dấu gạch chéo “/’, còn hiện tại sẽ thay bằng mũi tên sang phải “>”. Ngày này, thay vì nội dung được hiển thị ngăn cách bằng dấu gạch ngang “-”, thì Google sẽ hiển thị text dạng khai báo Schema. Có nghĩa là Google đã rất quan trọng và chú ý đến yếu tố Breadcrumbs trong một website. Và điều đặt biệt là chính Google cũng sử dụng Breadcrumb khi hiển thị kết quả tìm kiếm.
Các tạo Breadcrumb website wordpress
Đối với các website WordPress, chúng ta sẽ sử dụng cách thuận tiện nhất để tạo Breadcrumbs đó là cài quan plugin. Sau đây chúng tôi sẽ hướng dẫn bạn với 2 plugin chuyên dụng để bạn có thêm lựa chọn.
1- WordPress Breadcrumb NavXT
Đây là plugin tạo thanh định hướng phổ biến nhất cho website. Còn cách cài plugin chắc cùng đã quá quen thuộc rồi phải không nào!? Chỉ cần tìm với từ khóa “NavXT” sau đó cài và kích hoạt thôi.
NavXT sẽ thêm Breadcrumbs dưới dạng widget. Để sử dụng, hãy chọn tab Appearance -> Widgets. Khi muốn thêm Breadcrumbs cho một trang web bất kỳ, ta chỉ cần vào trang đó và thả widget NavTX là được.
Còn nếu cần tạo Breadcrumbs trực tiếp trên theme, hãy gõ thêm đoạn snippet code sau vào file header.php:
<div class=”breadcrumbs” typeof=”BreadcrumbList” vocab=”https://schema.org/”>
<?php
if(function_exists(‘bcn_display’))
{
bcn_display();
}?>
</div>
Khi đã hoàn thành, ta có thể dùng NavXT plugin để hiển thị Breadcrumbs theo ý mình. Để cấu hình chi tiết, hãy đến page setting của plugin để cài đặt và thay đổi một số thuộc tính của Breadcrumbs nếu cần.
2- Yoast SEO
Hãy thêm snippet code vào file single.php, page.php, hoặc header.php như bên dưới:
<?php
if ( function_exists(‘yoast_breadcrumb’) ) {
yoast_breadcrumb( ‘<p id=”breadcrumbs”>’,'</p>’ );
}
?>
Tiếp theo, ta có thể kích hoạt Breadcrumbs bằng cách vào mục Yoast SEO -> Search Appearance -> Breadcrumbs và sau đó chọn Enable.
Và trên đây là một số thông tin về Breadcrumb và cách cài Breadcrumb cho website WordPress. Hy vọng bài viết này có thể giúp mọi người có thêm kiến thức cũng như tự thực hiện cho website của mình. Chúc thành công!!!