Định nghĩa Breadcrumbs là gì? Ưu điểm của việc sử dụng breadcrumbs – Breadcrumb là 1 tập hợp những liên kết giúp người dùng xác định vị trí hiện tại của mình trong cấu trúc site. Thuật ngữ này gắn với câu chuyện cổ Grimm: Hansel và Gretel, trong đó 2 đứa trẻ đã rải những mẩu bánh mỳ vụn (breadcrumb) dọc đường để tìm về nhà. Trong một website có cấu tạo phức tạp hoặc chứa nhiều nội dung, breadcrumb navigation là một cách hiệu quả để giúp người dùng định vị vị trí trong website và giúp việc di chuyển giữa các trang thuận tiện hơn.
Định nghĩa Breadcrumbs là gì?
Breadcrumbs hay Breadcrumbs trail là một loại thẻ điều hướng với nhiều đường link phân cấp khác nhau thường được đặt ở đầu trang. Dễ hiểu hơn, Breadcrumbs là một đường dẫn Anchor text được phân cấp thường nằm ở đầu trang. Vậy công dụng của Breadcrumbs là gì? Cùng Mắt Bão tìm hiểu nhé!
Breadcrumbs giúp người dùng biết được họ đang ở đâu trên website. Breadcrumbs cũng cho biết mức độ phân cấp của nội dung đang xem. Ngoài vị trí thường gặp ở đầu trang, Breadcrumbs có thể nằm dưới banner chính, thanh menu hoặc top headers.
Cấu trúc điển hình của Breadcrumbs có thể được viết theo dạng như sau:
- Trang chủ (Home) > Chuyên Mục chính > Trang con > Bài post>…
- Trang chủ (Home) > Trang đã xem thứ nhất > Trang đã xem thứ hai > …
Các loại Breadcrumbs điển hình
breadcrumbs là gì? Location Breadcrumbs và Attribute Breadcrumbs là 2 loại Breadcrumbs được dùng phổ biến hiện nay
Location Breadcrumbs và Attribute Breadcrumbs là 2 loại Breadcrumbs được dùng phổ biến hiện nay
Hiện nay, trên website xuất hiện rất nhiều loại Breadcrumbs khác nhau. Dưới đây là một số loại điển hình nhất:
- Attribute Breadcrumbs
- Location Breadcrumbs
- Path Breadcrumbs
Breadcrumb có vai trò gì trong SEO?
Breadcrumb tiện dụng với người dùng
– Tiện dụng cho người dùng: Breadcrumb là công cụ 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
– Giảm số click và thao tác để quay trở lại các trang cấp cao: Thay vì sử dụng nút “Back” hoặc top menu của website để quay trở lại trang cấp cao hơn, người dùng có thể sử dụng breadcrumb và dễ dàng di chuyển đến các category hoặc tổ chức cao hơn trong website
– Giảm bounce rate: Các điều hướng của breadcrumb là một phương pháp hữu hiệu để khuyến khích người truy cập kiểm tra nội dung của một website sau khi đã xem trang đích. Các liên kết của breadcrumb sẽ dẫn người dùng đến các phân trang khác và cung cấp những thông tin liên quan. Điều này giúp làm giảm tỷ lệ thoát trang nói chung.
Breadcrumb có tác dụng đặc biệt với SEO
Rất nhiều người làm SEO dùng breadcrumb như một cách tăng lượng anchor text có gắn keyword trên website; tuy nhiên nếu bị lạm dụng, kĩ thuật này có thể làm giảm UX (trải nghiệm người dùng), và việc này thì không bao giờ là tốt.
Quan trọng hơn, trong một vài trường hợp, breadcrumb của bạn có thể hiện lên trên kết quả tìm kiếm (SERPs), tăng khả năng người dùng click vào kết quả của bạn giữa những kết quả tìm kiếm khác
Tại sao Breadcrumbs lại quan trọng với SEO?
Breadcrumbs là một yếu tố cần thiết của một trang web thân thiện với SEO vì:
- Chúng giúp điều hướng dễ dàng hơn – đó là vai trò chính của breadcrumbs và đây là lý do tại sao người dùng yêu thích chúng.
- Họ khuyến khích mọi người truy cập nhiều trang hơn của trang web trước khi họ thoát và do đó họ giảm tỷ lệ thoát .
- Chúng tốt cho SEO.
- Có hai lý do chính tại sao breadcrumbs lại tốt cho SEO.
- Đầu tiên, chúng giúp các bot của công cụ tìm kiếm trong giai đoạn thu thập thông tin và lập chỉ mục. Trình thu thập thông tin có thể xác định đường dẫn và có thể sử dụng cấu trúc đường dẫn để thu thập thêm thông tin về trang và trang web.
- Thứ hai, Google hiển thị thông tin breadcrumb trong SERPS, thay vì hiển thị liên kết cố định của một trang.
Các loại Breadcrumbs khác nhau
Breadcrumbs có thể có nhiều dạng khác nhau nhưng tất cả các dạng đều có chung một mục tiêu là giúp người dùng hiểu được mối quan hệ giữa trang hiện tại với phần còn lại của trang.
Breadcrumbs dựa trên phân cấp
Ví dụ trên là một menu breadcrumb phân cấp (hoặc dựa trên vị trí) điển hình. Đó là breadcrumb điển hình mà bạn có thể tìm thấy trên các blog hoặc trang web có cấu trúc phân cấp đơn giản.
Breadcrumbs động
Đường dẫn động hoặc dựa trên thuộc tính được sử dụng trong trường hợp một sản phẩm có nhiều thuộc tính và đường dẫn đường dẫn phản ánh điều đó để giúp điều hướng dễ dàng hơn.
Lưu ý cách breadcrumb giúp người dùng chọn các thuộc tính sản phẩm khác nhau mà không cần rời khỏi trang hiện tại.
Breadcrumbs dựa trên lịch sử
Đường dẫn đường dẫn breadcrumb được xây dựng dựa trên các trang mà người dùng đã truy cập. Đây không phải là một thực hành thiết kế web chuẩn SEO và nó không được sử dụng thường xuyên.
Ưu điểm của việc sử dụng breadcrumbs
Có một số lợi ích khi sử dụng những gợi ý nhỏ hữu ích này trên trang web của bạn. Hãy xem nhanh chúng:
1. Google yêu thích chúng
Khách truy cập của bạn thích breadcrumbs, nhưng Google cũng vậy. Chúng cung cấp cho Google một cách khác để tìm ra cách trang web của bạn được cấu trúc, nhưng, như đã đề cập ở trên, Google cũng có thể sử dụng chúng trong các kết quả tìm kiếm thực tế, điều này làm cho kết quả của bạn hấp dẫn hơn nhiều đối với người dùng. Để tăng cơ hội đường dẫn của bạn xuất hiện trên Google, bạn cần thêm dữ liệu có cấu trúc giống như Yoast SEO.
2. Chúng nâng cao trải nghiệm người dùng
Mọi người ghét bị lạc. Khi gặp một địa điểm mới, mọi người thường nhìn xung quanh để tìm kiếm các vật thể hoặc địa danh dễ nhận biết – và điều này cũng đúng với các trang web. Bạn cần phải giữ cho khách truy cập vui vẻ và giảm thiểu xích mích càng nhiều càng tốt.
Breadcrumbs có thể giúp ích cho trải nghiệm người dùng của bạn vì chúng là một phần tử giao diện chung giúp hiển thị ngay cho mọi người một lối thoát. Không cần phải bấm vào nút quay lại!
3. Họ giảm tỷ lệ thoát
Hầu như không có ai truy cập vào một trang web qua trang chủ – Đó là tất cả về tìm kiếm không phải trả tiền. Điều đó có nghĩa là bất kỳ phần nào trên trang web của bạn đều có thể là một điểm vào. Bạn cần nghĩ ra một cách để hướng dẫn những khách truy cập này đến các phần khác của trang web của bạn nếu trang đã chọn không đáp ứng được nhu cầu của họ.
Breadcrumbs có thể giảm tỷ lệ thoát vì bạn đang cung cấp cho khách truy cập một cách thay thế để duyệt trang web của bạn. Bạn có nghĩ rằng việc đưa khách truy cập vào trang chủ của bạn tốt hơn là quay lại Google?
Các phương pháp hay nhất về SEO Breadcrumbs
Để Tối ưu hóa SEO đường dẫn của bạn, bạn cần tuân theo các quy tắc đơn giản sau:
Đảm bảo rằng đường dẫn được bật và hiển thị cho người dùng
Điều này nghe có vẻ hiển nhiên nhưng nhiều nhà thiết kế web có xu hướng giấu đường mòn breadcrumb vì họ cảm thấy nó không phù hợp với thiết kế.
Đây không phải là sự thật. Hãy xem ví dụ đầu tiên ở trên và nhận thấy mức độ hữu ích của đường mòn breadcrumb trên trang web của Rolex (và nó trông cũng rất tuyệt).
Đảm bảo rằng breadcrumbs thân thiện với thiết bị di động
Nếu bạn quyết định giữ cho breadcrumbs hiển thị trên thiết bị di động, hãy đảm bảo rằng kích thước phông chữ đủ lớn để có thể nhấp vào các liên kết một cách dễ dàng. Một thực tế phổ biến là ẩn breadcrumbs trên điện thoại di động hoặc làm cho chúng trông giống như các nút.
Thêm giản đồ Breadcrumb
Lý do đường dẫn của tôi được hiển thị thay cho URL trong kết quả tìm kiếm của Google là vì tôi đã bật đánh dấu lược đồ đường dẫn trên trang web của mình.
Đánh dấu lược đồ là gì? Là một cách để làm nổi bật các khu vực nhất định trên trang web của bạn với trình thu thập thông tin của công cụ tìm kiếm để họ có thể hiểu rõ hơn về cách cấu trúc một trang.
Bằng cách thêm các đoạn mã vào HTML của bạn (đây được gọi là dữ liệu có cấu trúc), bạn có thể cung cấp cho các công cụ tìm kiếm thêm thông tin về trang và nội dung của bạn.
Điều này có thể làm tăng thay đổi của bạn trong việc nhận các đoạn mã chi tiết trong kết quả tìm kiếm và cũng như các đường dẫn được định dạng tốt.
Đây là cách thêm lược đồ breadcrumb trên trang web của bạn:
Đối với breadcrumbs, lược đồ có liên quan là breadcrumblist . Nó có các thuộc tính bắt buộc sau:
– Mặt hàng – URL của trang cho mặt hàng cụ thể
– Tên – Tiêu đề của breadcrumb
– Vị trí – vị trí của mục này trong đường dẫn breadcrumb.
Nếu bạn bối rối, đừng lo lắng trong phần lớn các trường hợp, bạn không phải viết mã theo cách thủ công.
Có những công cụ có thể làm điều này cho bạn một cách tự động.
Yoast SEO Plugin (WordPress)
Chủ đề Genesis (WordPress)
Các chủ đề dựa trên Genesis (giống như chủ đề tôi đang sử dụng trên trang web của mình, đã được xây dựng hỗ trợ cho các lược đồ).
Nếu bạn không sử dụng WordPress hoặc sử dụng một chủ đề khác, cách tốt nhất là trước tiên hãy kiểm tra xem lược đồ breadcrumb đã được kích hoạt trên trang web của bạn chưa.
Chuyển đến công cụ kiểm tra dữ liệu có cấu trúc và nhập URL của một trong các trang của bạn đã bật breadcrumbs.
Nếu mọi thứ đều ổn với việc triển khai dữ liệu có cấu trúc, bạn sẽ thấy ở bên phải kết quả với 0 Lỗi và 0 Cảnh báo. Điều này có nghĩa là cách triển khai của bạn là chính xác.
Nếu bạn gặp lỗi, cảnh báo hoặc không nhìn thấy mục breadcrumblist, thì điều đó có nghĩa là dữ liệu có cấu trúc breadcrumb không được triển khai trên trang web của bạn.
Cách tốt nhất để khắc phục điều này là thuê một nhà phát triển để thêm mã cần thiết vào tất cả các trang hợp lệ.
Đừng quên rằng, để đạt được kết quả tuyệt vời, bạn nên làm việc với những người có chuyên môn. Vì vậy, bây giờ, lần tới khi ai đó hỏi bạn, “breadcrumbs là gì?” hoặc “Điều hướng breadcrumb là gì?” Bạn sẽ không chỉ biết breadcrumbs là gì mà còn tại sao chúng lại quan trọng đối với cả người dùng và đối với SEO vào năm 2021. Chúng tôi tưởng tượng điều này cũng sẽ xảy ra trong nhiều năm tới.
Sử dụng breadcrumb trong thực tế
Sử dụng breadcrumb không khó, nhưng để dùng breadcrumb tốt nhất, có một vài nguyên tắc cơ bản cần tuân thủ:
Breadcrumb là hệ thống navigation phụ và không thể thay thế main navigation/ top menu.
Website cũ của video sharing website mefeedia mắc phải sai lầm sử dụng breadcrumb là navigation duy nhất trong các trang video chi tiết. Người dùng muốn vào các phần khác của site ngoài các link trên breadcrumb cần back lại trang video category trước khi đi tiếp
Breadcrumb phải mang lại lợi ích cho người dùng
Một lỗi phổ biến khi thực hiện breadcrumb là sử dụng khi chúng chẳng mang lại lợi ích nào cho website, như ví dụ dưới, người dùng có top menu, breadcrumb và navigation bằng tab, trong đó tab navigation và breadcrumb không thống nhất về mặt nội dung
Cách tốt nhất để xác định xem breadcrumb có mang lại lợi ích cho một website hay không là xây dựng một site map hoặc visitor flow để xác định breadcrumb sẽ cải thiện khả năng của người sử dụng như thế nào để điều hướng thông tin trong website
Tiêu chuẩn tạo breadcrumb:
– Breadcrumb thường xuất hiện phía trên nửa đầu của trang, ngay dưới top navigation bar (nếu có) và ở trên page title
– Breadcrumb giảm cấp theo thứ bậc: bắt đầu từ trang chủ và đi theo từng cấp từ cao nhất đến thấp nhất theo từng bước.
– Breadcrumb cần có kích cỡ hợp lý, không chiếm quá nhiều diện tích, và không nên lấy sự chú ý khỏi top menu và title của page.
– Dấu hiệu tách hyperlink cho breadcrumb cần thống nhất
- Phổ biến nhất là biểu tượng > theo mẫu: Parent category > Child category .
- Overstock.com sử dụng dấu “>” và sử dụng checkbox cho các thuộc tính sản phẩm để người dùng có thể filter sản phẩm
Thiết kế breadcrumb đẹp mắt và hài hòa với thiết kế tổng quan của site.
Breadcrumb tương tác của Delicious cho phép người dùng loại bỏ các mục trong breadcrumb để giúp tìm thấy các bookmarks nhanh hơn.
Thiết kế breadcrumb theo một phong cách phù hợp với thiết kế chung của website.
Những công dụng khác của breadcrumb
– Hỗ trợ các quy trình có nhiều bước
- Statement Tracker sử dụng breadcrumb để chỉ ra các bước liên quan khi đăng kí một tài khoản.
- Flickr sử dụng breadcrumb để chỉ ra các phần giới thiệu trong Flickr tour.
– Đóng vai navigation bar bổ sung: dropdown xuống navigation phụ (Sub-Navigation)
– Sáng tạo với breadcrumb
- Booreiland sử dụng một điều hướng breadcrumb cho menu chính cho phép khách truy cập hiểu nhanh những gì mà họ đang xem.
CÔNG TY TNHH THƯƠNG MẠI & DỊCH VỤ GIẢI PHÁP SEO VIỆT
Mã số thuế: 0314269562
Địa chỉ: 270 – 272 Cộng Hòa, P.13, Quận Tân Bình, Tphcm
Hotline: 0932 6789 46
Email: info.vinaseoviet@gmail.com
Website: https://vinaseoviet.com/ – https://vinaseoviet.vn/
MXH: Facebook
