fetch[`/api/products/${productId}`]
.then[response => response.json[]]
.then[product => {
  if[product.exists] {
    showProductDetails[product]; // shows the product information on the page
  } else {
    // this product does not exist, so this is an error page.
    // Note: This example assumes there is no other meta robots tag present in the HTML.
    const metaRobots = document.createElement['meta'];
    metaRobots.name = 'robots';
    metaRobots.content = 'noindex';
    document.head.appendChild[metaRobots];
  }
}]

Lịch sử API sử dụng thay vì các mảnh

Khi tìm kiếm các đường liên kết trong các trang của bạn, Googlebot chỉ xem xét các URL thuộc tính

fetch[`/api/products/${productId}`]
.then[response => response.json[]]
.then[product => {
  if[product.exists] {
    showProductDetails[product]; // shows the product information on the page
  } else {
    // this product does not exist, so this is an error page.
    // Note: This example assumes there is no other meta robots tag present in the HTML.
    const metaRobots = document.createElement['meta'];
    metaRobots.name = 'robots';
    metaRobots.content = 'noindex';
    document.head.appendChild[metaRobots];
  }
}]

Đối với các ứng dụng trang đơn tuyến đường phía máy khách, hãy sử dụng Lịch sử API để phát triển tuyến đường giữa các chế độ xem của ứng dụng web. Để đảm bảo Googlebot có thể tìm thấy các đường liên kết, hãy tránh sử dụng các mảnh để tải các nội dung trang khác nhau. Ví dụ sau đây là một cách không làm hay vì Googlebot sẽ không thu thập dữ liệu các đường liên kết này

fetch[`/api/products/${productId}`]
.then[response => response.json[]]
.then[product => {
  if[product.exists] {
    showProductDetails[product]; // shows the product information on the page
  } else {
    // this product does not exist, so this is an error page.
    // Note: This example assumes there is no other meta robots tag present in the HTML.
    const metaRobots = document.createElement['meta'];
    metaRobots.name = 'robots';
    metaRobots.content = 'noindex';
    document.head.appendChild[metaRobots];
  }
}]

Cẩn thận khi sử dụng thẻ meta robot

Thông qua thẻ meta robot, bạn có thể ngăn Google lập chỉ mục một trang hoặc đi theo các đường liên kết. Ví dụ. việc thêm thẻ meta sau đây vào đầu trang sẽ chặn Google thiết lập chỉ mục trang đó

fetch[`/api/products/${productId}`]
.then[response => response.json[]]
.then[product => {
  if[product.exists] {
    showProductDetails[product]; // shows the product information on the page
  } else {
    // this product does not exist, so this is an error page.
    // Note: This example assumes there is no other meta robots tag present in the HTML.
    const metaRobots = document.createElement['meta'];
    metaRobots.name = 'robots';
    metaRobots.content = 'noindex';
    document.head.appendChild[metaRobots];
  }
}]

Bạn có thể sử dụng JavaScript để thêm thẻ meta robot vào một trang hoặc thay đổi nội dung thẻ. Mã minh họa sau đây cho thấy cách thay đổi thẻ meta robot bằng JavaScript để ngăn Google thiết lập chỉ mục trang hiện tại nếu lệnh gọi API không trả về nội dung

fetch[`/api/products/${productId}`]
.then[response => response.json[]]
.then[product => {
  if[product.exists] {
    showProductDetails[product]; // shows the product information on the page
  } else {
    // this product does not exist, so this is an error page.
    // Note: This example assumes there is no other meta robots tag present in the HTML.
    const metaRobots = document.createElement['meta'];
    metaRobots.name = 'robots';
    metaRobots.content = 'noindex';
    document.head.appendChild[metaRobots];
  }
}]

Khi gặp

Sử dụng phương pháp lưu vào bộ nhớ đệm trong thời gian dài

Googlebot thường xuyên lưu nội dung vào bộ nhớ đệm để giảm số lượng yêu cầu gửi đến các mạng cũng như giảm mức sử dụng tài nguyên. Web service output [WRS] can't remove a buffer memory. This is could make WRS using old JavaScript resource or CSS resource. Tính năng tạo vân tay số cho nội dung có thể giúp bạn tránh được vấn đề này thông qua việc tạo vân tay số cho phần nội dung trong tên tệp, ví dụ như

fetch[`/api/products/${productId}`]
.then[response => response.json[]]
.then[product => {
  if[product.exists] {
    showProductDetails[product]; // shows the product information on the page
  } else {
    // this product does not exist, so this is an error page.
    // Note: This example assumes there is no other meta robots tag present in the HTML.
    const metaRobots = document.createElement['meta'];
    metaRobots.name = 'robots';
    metaRobots.content = 'noindex';
    document.head.appendChild[metaRobots];
  }
}]

Sử dụng dữ liệu có cấu trúc

Khi sử dụng dữ liệu có cấu trúc trên các trang của mình, bạn có thể sử dụng. Hãy nhớ kiểm tra kết quả khai thác để tránh các sự cố

Làm theo các phương pháp hay nhất đối với thành phần web

Google support the web section. Khi xuất ra một trang, Google sẽ. Tức là Google chỉ nhìn thấy phần nội dung xuất hiện trong HTML đã xuất. Để đảm bảo rằng Googlebot vẫn có thể nhìn thấy nội dung của bạn sau khi xuất ra, hãy sử dụng công cụ Kiểm tra tính thân thiện với thiết bị di động hoặc Công cụ kiểm tra URL rồi xem HTML đã xuất

Nếu nội dung không xuất hiện trong HTML đã xuất, Google sẽ không thiết lập chỉ mục được nội dung đó

Trong ví dụ sau đây, một phần web thành phần được tạo ra và cho thấy nội dung DOM sáng bên trong DOM tương ứng tối đa. Một cách để đảm bảo tất cả nội dung DOM sáng và DOM tối đều xuất hiện trong HTML xuất ra là sử dụng phần tử

fetch[`/api/products/${productId}`]
.then[response => response.json[]]
.then[product => {
  if[product.exists] {
    showProductDetails[product]; // shows the product information on the page
  } else {
    // this product does not exist, so this is an error page.
    // Note: This example assumes there is no other meta robots tag present in the HTML.
    const metaRobots = document.createElement['meta'];
    metaRobots.name = 'robots';
    metaRobots.content = 'noindex';
    document.head.appendChild[metaRobots];
  }
}]

Sau khi xuất ra, Google có thể thiết lập chỉ mục nội dung này

fetch[`/api/products/${productId}`]
.then[response => response.json[]]
.then[product => {
  if[product.exists] {
    showProductDetails[product]; // shows the product information on the page
  } else {
    // this product does not exist, so this is an error page.
    // Note: This example assumes there is no other meta robots tag present in the HTML.
    const metaRobots = document.createElement['meta'];
    metaRobots.name = 'robots';
    metaRobots.content = 'noindex';
    document.head.appendChild[metaRobots];
  }
}]

Khắc phục hình ảnh và nội dung tải xuống từng phần

Hình ảnh có thể sử dụng nhiều băng thông và giảm đáng kể hiệu suất. Một chiến lược hay là sử dụng phương pháp tải từng phần để chỉ tải hình ảnh khi người dùng sắp nhìn thấy hình ảnh đó. Để chắc chắn rằng bạn đang triển khai tải xuống từng phần theo cách phù hợp để tìm kiếm hoạt động, hãy làm theo nguyên tắc tải từng phần của chúng tôi

Thiết kế hỗ trợ khả năng tiếp cận hỗ trợ

Hãy tạo trang không chỉ cho các công cụ tìm kiếm mà còn cho người dùng. Khi bạn thiết kế trang web kế tiếp, hãy xem xét nhu cầu của người dùng, bao gồm cả những người không sử dụng trình duyệt hỗ trợ JavaScript [ví dụ:. những người sử dụng trình đọc màn hình hoặc thiết bị di động chưa đủ tiên tiến]. Một trong những cách dễ dàng nhất để kiểm tra khả năng hỗ trợ cận kề của trang web là xem trước trang web đó bằng trình duyệt đã tắt JavaScript hoặc xem bằng trình duyệt chỉ hỗ trợ văn bản như Lynx. Bằng cách xem một trang web dưới dạng văn bản đơn thuần, bạn có thể xác định được những nội dung khác mà Googlebot có thể khó nhận thấy, chẳng hạn như văn bản được nhúng trong hình ảnh