Tài liệu không có hreflang hợp lệ

Nhiều trang web cung cấp nhiều phiên bản của một trang dựa trên ngôn ngữ hoặc khu vực của người dùng. Đường liên kết hreflang cho công cụ tìm kiếm biết URL của tất cả phiên bản trang để có thể hiển thị phiên bản chính xác cho từng ngôn ngữ hoặc khu vực.

Cách kiểm tra hreflang của Lighthouse không thành công

Lighthouse gắn cờ các đường liên kết hreflang không chính xác:

Kết quả kiểm tra Lighthouse cho thấy các đường liên kết hreflang không chính xác

Lighthouse kiểm tra các đường liên kết hreflang trong head của trang và trong tiêu đề phản hồi của trang.

Sau đó, Lighthouse sẽ kiểm tra các mã ngôn ngữ hợp lệ trong các đường liên kết hreflang. Lighthouse báo cáo mọi đường liên kết hreflang có mã ngôn ngữ không hợp lệ.

Lighthouse không kiểm tra mã vùng hoặc sơ đồ trang web.

Cách xác định đường liên kết hreflang cho mỗi phiên bản của một trang

Giả sử bạn có 3 phiên bản của một trang:

  • Phiên bản tiếng Anh tại https://example.com
  • Phiên bản tiếng Tây Ban Nha tại https://es.example.com
  • Phiên bản tiếng Đức tại https://de.example.com

Có ba cách để cho các công cụ tìm kiếm biết rằng những trang này tương đương nhau. Chọn phương thức nào dễ dàng nhất cho trường hợp của bạn.

Cách 1: Thêm đường liên kết hreflang vào <head> của mỗi trang:

<link rel="alternate" hreflang="en" href="https://example.com" />
<link rel="alternate" hreflang="es" href="https://es.example.com" />
<link rel="alternate" hreflang="de" href="https://de.example.com" />

Mỗi phiên bản của một trang phải liên kết đến tất cả các phiên bản khác, kể cả chính phiên bản đó. Nếu không, các công cụ tìm kiếm có thể bỏ qua các đường liên kết hreflang hoặc diễn giải không chính xác các đường liên kết đó.

Đối với những trang cho phép người dùng chọn ngôn ngữ, hãy sử dụng từ khoá x-default:

<link rel="alternate" href="https://example.com" hreflang="x-default" />

Cách 2: Thêm tiêu đề Link vào phản hồi HTTP:

Link: <https://example.com>; rel="alternate"; hreflang="en", <https://es.example.com>;
rel="alternate"; hreflang="es", <https://de.example.com>; rel="alternate"; hreflang="de"

Cách 3: Thêm thông tin về phiên bản ngôn ngữ vào sơ đồ trang web.

<url>
<loc>https://example.com</loc>

<xhtml:link rel="alternate" hreflang="es"
href="https://es.example.com"/>

<xhtml:link rel="alternate" hreflang="de"
href="https://es.example.com"/>

</url>

Nguyên tắc về giá trị hreflang

  • Giá trị hreflang phải luôn chỉ định mã ngôn ngữ.
  • Mã ngôn ngữ phải tuân theo định dạng ISO 639-1.
  • Giá trị hreflang cũng có thể bao gồm một mã khu vực không bắt buộc. Ví dụ: es-mx dành cho người nói tiếng Tây Ban Nha ở Mexico, còn es-cl dành cho người nói tiếng Tây Ban Nha ở Chile.
  • Mã vùng phải tuân theo định dạng ISO 3166-1 alpha-2.

Tài nguyên