Mỗi website giống như một kho tài liệu với rất nhiều lối đi, vị trí đặt văn bản, nội dung khác nhau. Dẫn đến đôi khi bạn không biết mình đang ở đâu trên website. Cách giải quyết là cần mũi tên chỉ hướng và đánh dấu vị trí để bạn không “lạc” trong mê cung này. Và Schema Breadcrumbs được tạo ra như là giải pháp của vấn đề này.

1. Breadcrumbs là gì? Ví dụ

1.1. Breadcrumbs là gì?

Schema Breadcrumbs là thanh điều hướng thứ cấp (phụ) cho phép người dùng hình dung vị trí của mình trên trang web. Nó thường được hiển thị dưới dạng liên kết văn bản (anchor text) và được phân tách bởi các ký hiệu như gạch chéo (/) hay lớn hơn (>).

Schema Breadcrumbs có nhiều tên gọi khác nhau như breadcrumbs trail hay breadcrumbs navigation. Tựu chung lại, nó thường được sử dụng trong các website có số lượng trang lớn, và có sự phân cấp về nội dung, chẳng hạn như các website hướng dẫn, tra cứu…

1.2. Ví dụ cơ bản về Schema Breadcrumbs

• Schema Breadcrumbs trên một website thông thường

Schema Breadcrumbs trên báo điện tử Vnexpress

• Breadcrumblist trên website thương mại điện tử

Schema Breadcrumbs trên website ecommerce Shopee

• Schema Breadcrumbs xuất hiện trên SERP

Schema Breadcrumbs hiển thị trên công cụ tìm kiếm

• Google hiển thị Breadcrumbs khi tìm kiếm một số từ khoá nhất định

Google hiển thị Breadcrumbs khi search những từ khoá

1.3. Tại sao Breadcrumbs lại quan trọng?

1.3.1. Google yêu thích

Schema Breadcrumbs cung cấp cho Google một cách khái quát để nhanh chóng hiểu cấu trúc tổng thể của website

Có thể nói bất cứ những gì Google thích đều có thể là yếu tố xếp hạng SEO rất tốt và Schema Breadcrumbs cũng vậy. Nó cung cấp cho Google một cách khái quát để nhanh chóng hiểu cấu trúc tổng thể của website.

Với Schema Breadcrumbs, Googlebot dễ dàng nhận diện chuyên mục và trang web đó đang nói về chủ đề gì. Và Google sử dụng breadcrumbs để hiển thị chúng trong kết quả tìm kiếm trông đẹp mắt và chuyên nghiệp, tin cậy hơn.

Bằng cách này, kết quả tìm kiếm của bạn sẽ trở nên hấp dẫn hơn nhiều đối với người tìm kiếm. Điều này góp phần tăng CTR, tăng khả năng người dùng click vào kết quả.

Nếu website của bạn có Schema Breadcrumbs thì Google sẽ lấy nó thay thế cho permalink của bài viết và hiển thị trên SERPs. Điều đó không chỉ là tốt cho SEO mà còn “làm đẹp” kết quả của bạn trong mắt Google và người dùng.

Google cũng ưu ái dành hẳn mục Báo cáo đường dẫn trong Search Console. Nó sẽ hiển thị tất cả các vấn đề liên quan hiển thị Schema Breadcrumbs dưới dạng Rich search results.

1.3.2. Tăng trải nghiệm UX và tối ưu hoá người dùng

Schema Breadcrumbs sẽ giúp bạn điều hướng người dùng

Người dùng muốn xem thêm các thông tin xung quanh chủ đề đó thì sẽ trực tiếp truy cập thông qua Schema Breadcrumbs.

Điều này đáp ứng được nhu cầu tìm kiếm thông tin của người dùng ở cùng 1 chủ đề. Họ dễ dàng xem được mình đang đọc thông tin phần nào, dễ dàng chọn về danh mục cha hoặc trang chủ chỉ nhờ 1 nhấp chuột

Ví dụ: Một khách hàng nào đó vào website và chọn được một sản phẩm ưng ý. Họ sẽ thêm vào giỏ hàng và tiếp tục tìm kiếm một vài sản phẩm khác cùng loại để so sánh trước khi mua. Sẽ thật tuyệt nếu như họ biết mình đang ở đâu trên sơ đồ của website. Sản phẩm mà họ đang quan tâm đang nằm trong chuyên mục hay chuyên mục con nào.

Biết được điều đó họ chỉ cần nhấn vào thanh breadcrumbs để điều hướng đến chuyên mục, sản phẩm mà họ thích. Từ đó tiết kiệm thời gian cho khách hàng và tăng doanh số bán hàng của bạn.

1.3.3. Giảm tỷ lệ thoát trang bound rate, tăng time on site

Schema Breadcrumbs có xu hướng tạo ra trải nghiệm tích cực đầu tiên của người dùng và thúc đẩy họ khám phá thêm website

Một khi người dùng tìm thấy thông tin hữu ích trên website của bạn, họ sẽ có xu hướng tìm đọc thêm những bài viết khác. Schema Breadcrumbs sẽ giúp họ tìm đến đúng thứ mà họ quan tâm thay vì nhấn nút back như một thói quen.

Khi đang ở trong một bài viết thì người truy cập thường sẽ cố gắng tìm thì ngoài những anchor text có gắn link trong bài viết, hay những bài viết liên quan thì người truy cập cũng có xu hướng click vào các anchor text của breadcrumbs, điều này giúp giữ chân người truy cập website được lâu hơn.

Hành vi của người truy cập vào website thường hầu hết sẽ không click để quay về trang chủ, thay vào đó sẽ tìm kiếm những yếu tố tự nhiên và kích thích để click vào. Điều chứng tỏ ở bất kỳ vị trí nào trên website thì chúng ta cần phải biết điều hướng người đọc.

Và Schema Breadcrumbs có thể làm giảm tỷ lệ thoát vì cung cấp cho người truy cập một phương thức để chuyển đổi các danh mục.

Nhờ đó bạn sẽ giảm được tỉ lệ thoát trang (bounce rate) và tăng thời gian trên trang (time onsite). Đây là những yếu tố rất được Google đánh giá cao.

1.3.4. Tăng cường liên kết nội bộ

Sử dụng Schema Breadcrumbs hợp lý để internal link đến bài viết liên quan

Liên kết nội bộ (internal link) và backlink là 2 yếu tố rất quan trọng trong SEO. Và Schema Breadcrumbs sẽ giúp bạn 1 tay trong việc tạo ra các liên kết nội bộ ấy. Nó sẽ 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 breadcrumbs và dễ dàng di chuyển đến các category hoặc tổ chức cao hơn trong website.

Xem thêm: 4 bước xây dựng mô hình internal link giúp đẩy Top SEO từ khóa hiệu quả

1.3.5. Cải thiện SEO

Từ khóa được sử dụng trong Schema breadcrumbs là một dạng Anchor Text

Ngoài yếu tố tăng CTR, tăng traffic, Schema Breadcrumbs còn giúp tối ưu từ khóa đến các trang nhất định. Các từ khóa được sử dụng trong breadcrumbs là một dạng Anchor Text.

Khi sử dụng breadcrumbs trong một hệ thống phân cấp bậc, sẽ cải thiện SEO cho cả trang danh mục và các trang bên trong.

2. 3 loại Breadcrumbs phổ biến

2.1. Theo hệ thống phân cấp bậc

Hệ thống phân cấp trên website Apple

Schema Breadcrumbs phân cấp (Hierarchy based breadcrumbs hoặc Location-based breadcrumbs):

• Cho người dùng biết đang ở tầng nào trong hệ thống phân cấp của website. Nó sẽ đi từ danh mục có cấp bậc cao hơn cho đến thấp hơn (danh mục mẹ và con).
• Biết được có bao nhiêu bước để quay lại trang chủ.
• Có mặt ở hầu hết các loại website và là loại phổ biến nhất. Dùng tốt nhất cho những website mà nội dung được chia thành nhiều tầng.

2.2. Theo thuộc tính

Breadcrumblist phân theo thuộc tính trên website Điện máy xanh

Schema Breadcrums (Attribute-based breadcrumbs) theo thuộc tính:

Thường thấy ở các trang bán hàng, thương mại điện tử như: Amazon, Tiki, Thegioididong,… và các phần chính là thuộc tính của sản phẩm. Loại này sẽ cho biết người dùng đang tìm kiếm sản phẩm đúng tiêu chí hay chưa, từ đó tiết kiệm thời gian tham khảo và rút ngắn quy trình chốt đơn hàng của khách trên website.

Ví dụ: Breadcrumbs của một sản phẩm trên một website bán hàng có thể là

Trang chủ> Danh mục sản phẩm> Sản phẩm> Kích thước> Màu sắc

2.3. Theo lịch sử đường dẫn

Breadcrumblist sắp xếp theo lịch sử đường dẫn

Schema Breadcrumbs theo lịch sử đường dẫn (History-based breadcrumbs/ Path breadcrumbs):

Sắp xếp dựa trên những hành động của người truy cập đã đi qua trên website, các trang mà họ đã lướt qua.

Ví dụ: Trang chủ> Trang trước> Trang trước> Trang trước> Trang hiện tại.

Hiện nay ít còn được sử dụng rộng rãi bởi bản chất tương tự nút Back của trình duyệt. Hơn nữa, người dùng khó có thể biết vị trí hiện tại trong website.

3. Hướng dẫn cách làm Breadcrumbs cho website

3.1. Cài đặt Schema Breadcrumbs WordPress

Tuỳ chọn chỉnh sửa breadcrumblist wordpress với Yoast SEO

Nếu bạn sử dụng plugin Yoast SEO thì có thể bật và tùy chỉnh như sau:

• Bước 1: Hãy copy đoạn code này đặt vào trong <single.php> hoặc <page.php>

<?php
if ( function_exists(‘yoast_breadcrumb’) ) {
yoast_breadcrumb( ‘<p id=”breadcrumbs”>’,'</p>’ );
}
?>

• Bước 2: Dashboard => SEO => Search Appearance => Breadcrumbs => Enabled. Trong đó:

• • Dấu ngăn cách giữa các breadcrumbs: Thường sẽ là “»” hoặc “/”.
  • Anchor text cho trang chủ: Điền Home hoặc Trang chủ.

Hoặc có thể cài các plugin tạo Schema Breadcrumbs như: NavXT plugin, Breadcrumbs

Bạn có thể thay đổi domain website thành sitename giúp kết quả tìm kiếm đường dẫn Breadcrumbs trên Google trông đẹp hơn và dễ dàng truyền tải thương hiệu.

Thêm code này:

<head itemscope itemtype=”https://schema.org/WebSite”>
<meta itemprop=’name’ content=”Your WebSite Name”/>
<link rel=”canonical” href=”https://example.com/” itemprop=”url”>

3.2. Cài đặt breaadcrumb với Website sử dụng mã nguồn khác

Đối với website sử dụng mã nguồn khác, bạn có thể tham khảo, sử dụng những đoạn code có sẵn trên các trang web hỗ trợ tạo Breadcrumbs. Ví dụ:

https://varvy.com/tools/richsnippets/breadcrumb/
https://technicalseo.com/tools/schema-markup-generator/

Lưu ý: Nếu không dành về code, bạn nên nhờ tới thiết kế hay quản trị web để tránh xảy ra tình trạng đáng tiếc khi thêm mới đoạn code breadcrumbs.

4. Kiểm tra Schema Breadcrumbs khi check onpage

4.1. Công cụ kiểm tra Schema Breadcrumbs

Công cụ kiểm tra dữ liệu có cấu trúc của Google

4.2. Kiểm tra Schema Breadcrumbs có mặt tại 6 loại page

Schema Breadcrumbs cho bài viết

Nguyên tắc khi kiểm tra Schema Breadcrumbs trên các loại page:

• Trang chủ: Không cần thiết phải có
• Trang danh mục: Bắt buộc có
• Trang tĩnh: Bắt buộc có
• Trang Tag: Bắt buộc có
• Trang Filter: bắt buộc có
• Trang bài viết/ sản phẩm: Bắt buộc có

4.3. Tạo và kiểm tra Breadcrumbs

Google Search sử dụng Schema Breadcrumbs trong phần nội dung của trang web để phân loại thông tin trên trang trong SERPs.

Tuy nhiên, website phải tuân theo các nguyên tắc sau để đủ điều kiện hiển thị Schema Breadcrumbs trong Google Search:

• Nguyên tắc quản trị trang web
• Nguyên tắc chung về dữ liệu có cấu trúc

Để cài dữ liệu cấu trúc Schema Breadcrumbs có thể qua 03 cách chèn code:

1. Thêm một đoạn code JSON-LD

2. Chuyển đổi HTML breadcrumbs theo cấu trúc RDFa

3. Chuyển đổi HTML breadcrumbs theo cấu trúc Microdata

Cách kiểm tra Schema Breadcrumbs:

• Kiểm tra theo lệnh “site:url cần kiểm tra”

Vào Google -> Gõ lệnh “site:url cần kiểm tra” -> Kết quả Breadcrumbs

Kiểm tra source code

• Sử dụng công cụ kiểm tra dữ liệu có cấu trúc

Kiểm tra dữ liệu cấu trúc của Website

4.4. Kiểm tra báo cáo đường dẫn trong Search Console để xử lý

Website đang thiếu một số trường item của breadcrumbs

5. Những kiểu hiển thị Schema Breadcrumbs được sử dụng hiện nay

Website càng có nhiều ứng dụng kèm theo đó giao diện hiển thị của Schema Breadcrumb cũng được thay đổi tuỳ theo mục đích sử dụng:

• Dựa trên văn bản cổ điển

• Thay thế dấu phân cách bằng các biểu tượng khác

• Sử dụng các hình khối

• Quy trình hướng dẫn nhiều bước

Tóm lại, Schema Breadcrumbs thực sự cần thiết trên một website. Google cũng ngày càng chú trọng hiển thị Breadcrumbs trên SERP sau các đợt cập nhật thuật toán gần đây.

Breadcrumbs hiển thị trên title

Hãy tối ưu Breadcrumbs để thực sự hữu ích cho người dùng và điều hướng nội dung trên website của bạn một cách tốt nhất!

Xem thêm một số bài viết giúp bạn tối ưu on-page SEO hiệu quả hơn: