Cách triển khai đánh dấu ngữ nghĩa bằng Trình quản lý thẻ của Google

Dữ liệu có cấu trúc là một chiến thuật SEO quan trọng tại thời điểm này.

Nó không chỉ loại bỏ mức độ mơ hồ cho các công cụ tìm kiếm (họ không cần phải suy ra mục dữ liệu là gì; bạn nói trực tiếp với họ), mà còn là công cụ tạo ra kết quả nhiều định dạng tiếp tục tăng số lượng bất động sản trong SERPs.

Sự ra đời của tìm kiếm bằng giọng nói làm cho dữ liệu có cấu trúc trở thành một phần quan trọng hơn của bộ công cụ tiếp thị công cụ tìm kiếm. Tương tự như cách dữ liệu có cấu trúc cho phép các công cụ tìm kiếm trích xuất và tái tạo dữ liệu phong phú trong SERP, việc trích xuất và tái tạo cùng một thực thể là cốt lõi của kết quả tìm kiếm bằng giọng nói.

Thật không may, việc triển khai dữ liệu có cấu trúc thông qua đánh dấu ngữ nghĩa có thể tốn thời gian và gây khó chịu. Cho đến gần đây, cách duy nhất để triển khai đánh dấu ngữ nghĩa là làm như vậy xếp hàngbằng cách thêm các thuộc tính HTML của Schema.org vào HTML hiện có của trang.

Trước đây, thực hiện việc này trên quy mô lớn liên quan đến việc thay đổi các chủ đề hoặc mẫu của trang, đây có thể là một nhiệm vụ phát triển chính tùy thuộc vào cách trang web được thiết lập.

Ngoài ra, đánh dấu nội tuyến vốn được gắn với lớp trình bày: bạn sẽ không thể đánh dấu các mục dữ liệu không có trên trang (ngoại trừ việc sử dụng cẩn thận các thẻ meta) và nếu hai phần thông tin không gần nhau trên trang, có thể khó, nếu không muốn nói là không thể, liên kết chúng với nhau trong một thẻ itemScope.

May mắn thay, thời kỳ mà chúng ta phải nén dữ liệu của mình thành các biểu mẫu dễ đánh dấu đã qua: với JSON-LD, giờ đây có thể thêm dữ liệu có cấu trúc trong vài phút. Đánh dấu này hiện được hỗ trợ đầy đủ bởi Google và Bing. thực ra, Google đề xuất Thêm dữ liệu có cấu trúc qua JSON-LD thay vì nội tuyến cho tài khoản Merchant Center.

Vì lợi ích của một minh họa rõ ràng và hiệu quả, chúng tôi sẽ sử dụng một trường hợp sử dụng tương đối đơn giản trong phần đầu tiên này, Static JSON-LD. Chúng ta sẽ tiến xa hơn khi chuyển sang “Dynamic JSON-LD”.

Biết rằng ngay cả ví dụ tiên tiến hơn cũng chỉ là phần nổi của tảng băng chìm; Hầu như không có gì là vượt quá giới hạn khi nói đến mức độ phức tạp mà dữ liệu có cấu trúc được đưa vào Trình quản lý thẻ của Google có thể hỗ trợ.

JSON-LD tĩnh

JSON-LD tĩnh có thể khớp với được thêm vào trang có liên quan hoặc được chèn bằng một plugin, nhưng cách dễ nhất (và linh hoạt nhất) để triển khai nó theo ý kiến ​​của tôi là Trình quản lý thẻ của Google (GTM).

Bước 1: viết JSON-LD

Nếu bạn không quen thuộc với JSON-LD, bạn có thể muốn đọc một cái gì đó hoặc làm một hướng dẫn nhanh để làm quen với các khái niệm cơ bản. Googles Giới thiệu về dữ liệu có cấu trúc là một khởi đầu tốt. Tùy thuộc vào loại lược đồ được sử dụng, schema.org cũng có thể bao gồm các ví dụ về đánh dấu JSON-LD cho loại phần tử đó.

Ví dụ về JSON-LD cho loại phần tử sự kiện trên schema.org

Sau thẻ tập lệnh ban đầu cho trình duyệt biết “Đây là tập lệnh JSON-LD”, bạn có thể thấy thứ bậc của tập lệnh của chúng tôi:

  • “@Context” cho biết từ vựng ngữ nghĩa nào (đây là từ điển phổ biến cho máy móc) mà chúng tôi liên kết dữ liệu của mình – trong trường hợp này là với từ vựng schema.org.
  • “@Type” là lược đồ hoặc loại thực thể cụ thể trong schema.org mà chúng tôi đang đề cập đến. Nó tương đương với “itemtype” trong đánh dấu nội tuyến.
  • Từ đó, chúng ta có thể tham chiếu trực tiếp đến các thuộc tính nhất định trong lược đồ theo tên. Điều này tương đương với “itemprop” trong đánh dấu nội tuyến.

Lưu ý rằng khi chúng ta tham chiếu đến các kiểu con như Place, chúng ta cần gọi @type đó một cách riêng biệt và đặt kiểu con đó trong dấu ngoặc đơn của chính nó để cho biết thuộc tính lồng nhau nào thuộc về kiểu con đó.

Đừng quên đặt dấu phẩy sau mỗi thuộc tính ngoại trừ thuộc tính cuối cùng trước dấu ngoặc kết thúc, nếu không mã của bạn sẽ không phân tích cú pháp chính xác (và thật khó chịu khi tìm kiếm mã của bạn để tìm dấu phẩy bị thiếu)!

Khi bạn đã viết mã của mình, hãy kiểm tra nó trong Công cụ kiểm tra dữ liệu có cấu trúc từ Google để đảm bảo mọi thứ đều đẹp và không thiếu bất kỳ thuộc tính bắt buộc nào.

Bước 2: Tạo trình kích hoạt

Trong Trình quản lý thẻ của Google, chúng tôi muốn tạo trình kích hoạt để thẻ đánh dấu JSON-LD của chúng tôi kích hoạt trên trang mà chúng tôi muốn nó kích hoạt – trong ví dụ ở trên, nó sẽ nằm trên trang cho sự kiện Typhoon with Radiation City.

Tạo trình kích hoạt:

  • Loại: xem bên
  • Kích hoạt tại: một số lượt xem trang
  • Kích hoạt trình kích hoạt này khi: Đường dẫn trang khớp với URL của trang đích của bạn

Đây là những gì thiết lập trình kích hoạt sẽ trông như thế nào

Bước 3: Tạo thẻ

Bây giờ đã đến lúc tạo thẻ sẽ kích hoạt trên trang đích của chúng tôi và chèn dữ liệu JSON-LD có cấu trúc của chúng tôi.

Tạo thẻ:

  • Loại: HTML tùy chỉnh
  • HTML: Dán mã JSON-LD, đảm bảo bao gồm các thẻ tập lệnh mở và đóng.
  • Trình kích hoạt: Sử dụng trình kích hoạt từ bước 2.

Đây là thiết lập thẻ trông như thế nào

Bước 4: xuất bản và thử nghiệm

Sau khi bạn đăng thẻ, hãy gửi lại url của trang thông qua công cụ kiểm tra dữ liệu có cấu trúc để xem liệu Google có thể phân tích và hiểu nó hay không.

Thì đấy, đã xong!

JSON-LD động

Nếu bạn không thêm các trang mới vào trang web của mình mỗi ngày và các trang hiện tại không thay đổi thường xuyên, thì dữ liệu có cấu trúc thông qua JSON-LD tĩnh có thể là đủ.

Tuy nhiên, JSON-LD tĩnh chỉ đơn giản là không thể mở rộng cho các trang web như trang web thương mại điện tử có thể chứa hàng nghìn sản phẩm có giá và tính khả dụng có thể thay đổi. Chúng ta cần phải có một chút ưa thích.

Bước một: tạo các biến bằng công cụ chọn CSS

Vì chúng tôi muốn tập lệnh này là động, nên chúng tôi cần sử dụng các biến GTM để tìm dữ liệu chúng tôi cần và đặt tên cho chúng mà tập lệnh của chúng tôi có thể hiểu được.

Tạo một biến (tùy chỉnh) mới. Trong ví dụ này, chúng tôi tạo một biến để nắm bắt tên sản phẩm:

  • Đặt tên duy nhất cho biến, ví dụ: B. “dataPoint – Tên sản phẩm”; Bạn sẽ tham khảo nó sau với tên này.
  • Loại: Phần tử DOM
  • Phương pháp lựa chọn: Bộ chọn CSS
  • Bộ chọn phần tử: Bộ chọn CSS duy nhất cho phần tử. Trong ví dụ này, lớp của phần tử là product-name, vì vậy bộ chọn là .product-name.

Lặp lại bước này cho từng thuộc tính mà bạn cần để xác thực dữ liệu có cấu trúc của mình.

Bước 2: Hợp đồng một biểu thức hàm

Thật không may, chúng tôi không thể chỉ dán các biến của mình vào mã JSON-LD và kết thúc một ngày. Trình quản lý thẻ của Google chèn JavaScript để trả về các biến của nó và JavaScript đó làm mất hiệu lực mã của chúng tôi.

Thay vào đó, chúng ta cần bao gồm JSON-LD IN một biểu thức hàm trước tiên lấy ra các biến của chúng ta, sau đó hợp nhất chúng với một đối tượng JavaScript và cuối cùng chèn thẻ tập lệnh JSON-LD độc quyền vào đầu trang.

Tập lệnh đã hoàn thành trong thẻ HTML tùy chỉnh (trong GTM) sẽ trông giống như sau:

Có thể mất một chút tinh chỉnh và chỉnh sửa để có được dữ liệu của bạn chính xác theo cách bạn muốn. May mắn thay, tính năng xem trước của GTM cho phép bạn kiểm tra bao nhiêu tùy thích trước khi triển khai.

Đánh dấu JSON-LD và AMP

Rất tiếc, bạn không thể sử dụng GTM để chèn dữ liệu JSON-LD có cấu trúc vào các trang AMP. Các vùng chứa GTM cho AMP, giống như hầu hết mọi thứ cho AMP, là các phiên bản rút gọn của chính chúng. Chúng không hỗ trợ thẻ HTML tùy chỉnh hoặc các biến JavaScript tùy chỉnh vì chúng có thể mất quá nhiều thời gian để tải.

Nếu trang web của bạn sử dụng AMP, bạn có thể muốn xem xét đánh dấu nội tuyến.

Khi bạn đã kiểm soát được phương pháp này, bạn sẽ thấy rằng việc triển khai dữ liệu có cấu trúc đã phát triển từ việc tốn nhiều thời gian của việc thêm đánh dấu nội tuyến và làm phiền các nhà phát triển của bạn thành một thứ gì đó bạn có thể tạo và triển khai trong vài phút.

Hơn hết, đánh dấu bằng JSON-LD được xác thực đầy đủ, kiếm được đoạn mã chi tiết và hiện được hỗ trợ bởi Bing cũng như Google – vì vậy nếu bạn nghĩ rằng nó phù hợp với trang web của bạn, không có lý do gì để không thử nó.

Ruth Burr Reedy là Giám đốc Chiến lược tại UpBuild.


Nguồn: www.searchenginewatch.com

Trả lời

Chat Zalo