Tìm hiểu Structured Data và Schema Markup trên WordPress

Bạn có phân biệt được Structured Data và Schema Markup? Vai trò của Structured Data và Schema Markup đối với SEO. Cách tích hợp nhanh nhất cho WordPress.

Structured Data và Schema Markup trên WordPress

Hiện nay sử dụng Dữ liệu có cấu trúc (structured data) đã trở thành một phần rất quan trọng của SEO Website, với việc sử dụng code đánh dấu riêng cho từng loại nội dung, chúng ta giúp Search Engine dễ dàng hiểu được loại nội dung của trang web nhằm gởi đến người dùng kết quả trực quan – hữu ích nhất.

Trong topic này, chúng ta sẽ tìm hiểu Structured Data và ứng dụng Schema Markup để khai báo Structured Data cho nội dung của trang web. Cũng như cách Google hiển thị kết quả trực quan Rich Results, Google Knowledge Graph từ dữ liệu có cấu trúc tạo bởi Schema Markup.

Sử dụng Structured Data bằng Schema Markup trên Website WordPress khá đơn giản với sự hỗ trợ của các plugin SEO nhưng hiểu rõ nguyên tắc hoạt động của chúng và tác dụng đối với SEO Website là rất cần thiết.

1. Structured Data là gì?

Trên trang web, dữ liệu có cấu trúc (Structured Data) là một định dạng chuẩn để cung cấp thông tin về một trang và phân loại nội dung trang. Ví dụ: trên một trang về công thức nấu ăn sẽ có các loại dữ liệu về nguyên liệu, thời gian nấu và nhiệt độ, lượng calo,..

recipe schema structured data,schema markup,schema markup trên wordpress

Có nhiều loại dữ liệu có cấu trúc có thể được áp dụng cho các trang web (ví dụ: “Article”, “Product”, “Book”, “Movie”, “Reviews”, “HowTo”, “Article”, “Event” hoặc “Organization”…).

Chúng cũng có thể xuất hiện dưới dạng kết quả nhiều định dạng (rich results) trên trang kết quả của công cụ tìm kiếm (Search Engine Result Page – SERP), và thông tin từ dữ liệu có cấu trúc cũng được sử dụng cho phần hiển thị thị dạng Google Knowledge Graph

Hiển thị kết quả dưới dạng trực quan Rich Results là nguyên nhân chính để việc sử dụng Structured Data trên trang Web trở thành yếu tố quan trọng cho SEO Website.

2. Lợi ích của Structured Data đối với SEO Website

Như đã nói ở trên, trong SEO Website, thì dùng Structured Data giúp tăng khả năng trang web được hiển thị dưới dạng Rich Results và nó cũng hỗ trợ cung cấp thông tin chính xác cho Google Knowledge Graph. Ta sẽ tìm hiểu về 2 cái này:

2a. Rich Results là gì?

Rich Results là các kết quả tìm kiếm hiển thị trực quan và nhiều thông tin và dữ liệu hơn hơn so với định dạng tiêu đề + miêu tả (Title + Meta Description) thông thường.

Bình thường mỗi kết quả trên trang Search Results sẽ bao gồm tiêu đề và phần miêu tả ngắn gọn để người dùng nắm được cơ bản về chủ đề của trang web đó, đó được gọi là snippet hay search snippet, google snippet…. nếu hiển thị dưới dạng trực quan – giàu hình ảnh và dữ liệu thì được gọi là rich results:

Snippet Rich Snippet structured data,schema markup,schema markup trên wordpress

Cũng nên biết bất kỳ dạng hiển thị nào giàu hình ảnh – dữ liệu hơn so với snippet thông thường đều thuộc Rich results, trong đó rich snippet như ở hình trên là một loại hiển thị như vậy, ngoài ra chúng ta còn có rất nhiều loại hiển thị rich result khác như Sitelinks:

SITELINKS structured data,schema markup,schema markup trên wordpress

Một dạng phổ biến nữa là Rich Cards như các loại hiển thị Host Carousel dưới đây:

Rich Card Host Carousel 1 structured data,schema markup,schema markup trên wordpress

Tầm quan trọng của Rich Results đối với SEO

Việc kết quả tìm kiếm hiển thị càng trực quan – giàu thông tin và hình ảnh thì còn mang nhiều giá trị đến với người dùng, người dùng có thể hiểu rõ hơn về thông tin quan trọng và chất lượng của một trang web trước khi quyết định nhấp vào để xem chi tiết.

Rich Results giúp nâng cao trải nghiệm người dùng (UX) và tăng tỉ lệ nhấp trang Click Through Rate (CTR), một yếu tố quyết định thu hút Organic Traffic – qua đó tác động lớn đến SEO của trang Web và toàn bộ Website.

Do đó việc tối ưu trang web và Website để được hiển thị dưới dạng Rich Results là một phần cực kỳ quan trọng trong SEO Website hiện nay. Và dùng Structured Data (cụ thể là dùng Schema Markup) là điều kiện cần quan trọng nhất để đạt được điều này (điều kiện đủ trang web phải đủ chất lượng để Google xếp hạng).

2b. Google Knowledge Graph là gì?

Google Knowledge Graph là phần hộp thông tin hiển thị dạng Panel/ Card ở top của trang kết quả tìm kiếm – nhằm nâng cao trải nghiệm người dùng của Google Search, tuy nhiên, khác với Rich Results, thông tin ở Google Knowledge Graph được tổng hợp từ nhiều nguồn như Wikipedia & các trang web uy tín, Google có thể lấy một phần thông tin từ structured data của Website( thường ở loại Person và Organization), ví dụ tìm kiếm về Google:

Google Knowledge graph structured data,schema markup,schema markup trên wordpress

Tìm kiếm một nhân vật nổi tiếng, thì thường thông tin chính sẽ lấy từ Wikipedia (nếu có) và tổng hợp thêm từ các trang mạng xã hội, ví dụ tìm Obama:

Google Knowledge graph 1 structured data,schema markup,schema markup trên wordpress

Từ khóa thương hiệu, công ty nổi tiếng cũng hiển thị dưới dạng Knowledge Panel:

Semrush structured data,schema markup,schema markup trên wordpress

Vai trò của Google Knowledge Graph
  • Đối với người tìm kiếm: Google Knowledge Graph giúp người dùng nhìn thấy thông tin tóm tắt khá đầy đủ và người hoặc tổ chức, thương hiệu ngay trên trang kết quả tìm kiếm mà không cần click vào trang web.. rõ ràng là nâng cao trải nghiệm người dùng (UX) khi tìm kiếm, giúp họ nắm được thông tin nhanh và có thể không cần mất thời gian vào các trang web trên kết quả tìm kiếm.
  • Đối với SEO: Google Knowledge Graph có tác động khá tiêu cực đến SEO, vì người dùng có xu hướng xem thông tin ở Knowlege Graph Panel chứ không click vào các trang xếp hạng đầu ở phần xếp hạng kết quả tìm kiếm, tỉ lệ CTR rất thấp ,do đó organic traffic cho từ khóa tương ứng không cao dù được xếp hạng ở những vị trí đầu tiên.

Việc hiển thị một kết quả tìm kiếm cho từ khóa nhất định dưới dạng Knowledge Graph Panel là do Google quyết định, chúng ta (người làm website) chẳng tác động được gì tới khả năng từ khóa được hiển thị dưới dạng này hay không.

Chúng ta chỉ có thể trợ giúp một ít bằng cách khai báo các thông tin chính xác về cá nhân hoặc dịch vụ, thương hiệu dưới dạng structured data (loại person, organization) chứ không tác động được gì thêm. Google có thể lấy nguồn từ structured data trên website, mà đôi khi cũng có thể lấy nguồn từ các trang web khác.

Tóm lại: sử dụng Structured Data cho trang web giúp hiển thị trên trang kế quả tìm kiếm dưới dạng Rich Results và đôi khi là Google Knowledge Graph, trong đó Rich Results mang lại rất nhiều lợi ích cho SEO!

3. Schema Markup là gì?

Schema Markup hay Schema.org là một tập hợp các lượt đồ (schemas) phổ biến hỗ trợ đánh dấu (markup) dữ liệu có cấu trúc (structured data) trên trang Web, nó thực chất là một dạng microdata (vi dữ liệu) hỗ trợ đánh dấu structured data.

Cần lưu ý:

  • Schema Markup đôi khi được gọi là một ngôn ngữ, nhưng thực chất nó không đủ để gọi là ngôn ngữ máy tính như HTML, XML,…, mà chỉ là một dạng microdata hỗ trợ lồng siêu dữ liệu (metadata) vào nội dung hiện có trên trang web để mô tả thông tin của dữ liệu đó.

Schema.org được khởi tạo năm 2011 bởi Google, Bing và Yahoo là để tạo ra một tập hợp chung các lượt đồ để đánh dấu dữ liệu có cấu trúc trên các trang web.

Schema Markup luôn được cập nhật, hiện nay hỗ trợ đánh dấu structured data cho rất nhiều loại nội dung như article, book, reviews, author, movie, recipe, organization, …  bạn có thể tham khảo toàn bộ tại schema.org hay xem bảng tóm tắt các loại phổ biến nhất:

Article How-to Q&A
Book Image license metadata Recipe
Breadcrumbs Job posting Review snippet
Carousel Job training Sitelinks searchbox
Critic review Local business Software app
Dataset Logo Speakable
Employer aggregate rating Movie Subscription and paywalled content
Event Estimated salary Video
Fact check Podcast ….
FAQ Product ….

Trên Website, Schema Markup được dùng phổ biến nhất vì nó được hỗ trợ bởi các ông lớn Google, Bing, Yahoo, Yandex chiếm hầu như toàn bộ thị trường tìm kiếm toàn cầu, trừ ở Trung Quốc nơi Baidu thống trị.

Cũng nên biết vẫn còn một số loại khác hỗ trợ đánh dấu dữ liệu có cấu trúc, ví dụ như Dublin Core, một loại metadata schema ra đời trước Schema Markup, có phạm vi hỗ trợ rộng hơn. Dù không còn phổ biến và hiếm khi dùng cho mục đích SEO Website nhưng Dublin Core vẫn còn được dùng trong lĩnh vực thư viện, trường đại học và các lĩnh vực nặng về tài liệu như luật.

3a. Nguyên tắc sử dụng Schema Markup

Để sử dụng (tích hợp) Schema Markup trên một trang Web, ta có 3 nguyên tắc sử dụng, bao gồm: JSON-LD, Microdata và RDFa.

JSON-LD

Đây là đoạn mã JavaScript được nhúng trong thẻ <script> trong phần tiêu đề hoặc nội dung của trang.

Thẻ đánh dấu này không nằm xen kẽ với văn bản mà người dùng nhìn thấy, điều này giúp việc xác định các mục dữ liệu lồng nhau dễ dàng hơn.

Ngoài ra, Google có thể đọc dữ liệu JSON-LD khi dữ liệu đó được chèn động vào nội dung của trang, chẳng hạn như qua mã JavaScript hoặc các tiện ích nhúng trong hệ thống quản lý nội dung của bạn.

JSON-LD là kỹ thuật được khuyên dùng nhất để đánh dấu Structure Data trên trang web.

Ví dụ cụ thể:

 <html>
  <head>
    <title>Executive Anvil</title>
    <script type="application/ld+json">
    {
      "@context": "https://schema.org/",
      "@type": "Product",
      "name": "Executive Anvil",
      "image": [
        "https://example.com/photos/1x1/photo.jpg",
        "https://example.com/photos/4x3/photo.jpg",
        "https://example.com/photos/16x9/photo.jpg"
       ],
      "description": "Sleeker than ACME's Classic Anvil, the Executive Anvil is perfect for the business traveler looking for something to drop from a height.",
      "sku": "0446310786",
      "mpn": "925872",
      "brand": {
        "@type": "Brand",
        "name": "ACME"
      },
      "review": {
        "@type": "Review",
        "reviewRating": {
          "@type": "Rating",
          "ratingValue": "4",
          "bestRating": "5"
        },
        "author": {
          "@type": "Person",
          "name": "Fred Benson"
        }
      },
      "aggregateRating": {
        "@type": "AggregateRating",
        "ratingValue": "4.4",
        "reviewCount": "89"
      },
      "offers": {
        "@type": "Offer",
        "url": "https://example.com/anvil",
        "priceCurrency": "USD",
        "price": "119.99",
        "priceValidUntil": "2020-11-20",
        "itemCondition": "https://schema.org/UsedCondition",
        "availability": "https://schema.org/InStock"
      }
    }
    </script>
  </head>
  <body>
  </body>
</html>

 

Microdata

Microdata (vi dữ liệu), loại này là một đặc tả HTML dùng để lồng dữ liệu có cấu trúc trong nội dung HTML. Microdata sử dụng các thuộc tính thẻ HTML để đặt tên cho các thuộc tính bạn muốn hiển thị dưới dạng dữ liệu có cấu trúc. Schema Markup thuộc thể loại microdata nên dĩ nhiên có thể sử dụng định dạng này để đánh dấu structured data cho trang web.

Microdata thường được sử dụng trong phần nội dung của trang, nhưng cũng có thể được sử dụng trong phần tiêu đề. Nó không có tính linh động như JSON-LD.

 <html>
  <head>
    <title>Executive Anvil</title>
  </head>
  <body>
  <div>
    <div itemtype="https://schema.org/Product" itemscope>
      <meta itemprop="mpn" content="925872" />
      <meta itemprop="name" content="Executive Anvil" />
      <link itemprop="image" href="https://example.com/photos/16x9/photo.jpg" />
      <link itemprop="image" href="https://example.com/photos/4x3/photo.jpg" />
      <link itemprop="image" href="https://example.com/photos/1x1/photo.jpg" />
      <meta itemprop="description" content="Sleeker than ACME's .." />
      .....

    </div>
  </div>
  </body>
</html>

Rõ ràng so với cách dùng JSON-LD thì việc chèn metadata trực tiếp vào mã HTML ở phần nội dung (thẻ <body> của trang web) là cách cực chẳng đã vì nó khiến code trở nên rối rắm hơn rất nhiều.

RDFa

RDFa là một tiện ích HTML5 hỗ trợ dữ liệu được liên kết bằng cách sử dụng các thuộc tính thẻ HTML tương ứng với nội dung hiển thị cho người dùng mà bạn muốn mô tả cho các công cụ tìm kiếm. RDFa thường được sử dụng trong cả phần tiêu đề và phần nội dung của trang HTML.

Sử dụng tương tự microdata:

<html>
  <head>
    <title>Executive Anvil</title>
  </head>
  <body>
    <div typeof="schema:Product">
        <div rel="schema:review">
          <div typeof="schema:Review">
            <div rel="schema:reviewRating">
              <div typeof="schema:Rating">
                <div property="schema:ratingValue" content="4"></div>
                <div property="schema:bestRating" content="5"></div>
              </div>
            </div>
            <div rel="schema:author">
              <div typeof="schema:Person">
                <div property="schema:name" content="Fred Benson"></div>
              </div>
            </div>
          </div>
        </div>
        <div rel="schema:image" resource="https://example.com/photos/4x3/photo.jpg"></div>
        <div property="schema:mpn" content="925872"></div>
        <div property="schema:name" content="Executive Anvil"></div>
        ..... 

        .....
      </div>
  </body>
</html>

 

3b. Một số ví dụ về sử dụng Schema Markup

Việc sử dụng Schema Markup không đảm bảo kết quả tìm kiếm sẽ hiển thị dưới dạng Rich Results, nhưng nó là một điều kiện cần rất quan trọng, bởi vì nếu bạn không dùng dữ liệu có cấu trúc cho nội dung thì nhiều khả năng Bot của Search Engine sẽ không hiểu đúng và thu thập dữ liệu chính xác để hiển thị dưới dạng Rich Results.

Ví dụ về Product Schema Markup

Ví dụ, bạn tìm một sản phẩm, thì các dữ liệu được đánh dấu cho nội dung sản phẩm sẽ giúp Google hiển thị sản phẩm dưới định dạng riêng rất trực quan, ví dụ tìm kiếm sản phẩm Google Home, nếu đã đánh dấu structured data cho sản phẩm, sẽ hiển thị các thuộc tính sản phẩm như đánh giá, khoảng giá của sản phẩm…

products imagesearch structured data,schema markup,schema markup trên wordpress

Ví dụ về Recipe Schema Markup

Một loại nữa rất phổ biến là Recipe – công thức nấu ăn, đồ uống, làm bánh: hiển thị kết quả đánh giá, số lượng reviews, thời gian chế biến hay lượng calo trong món ăn, thức uống…

rich snippet recipe structured data seo structured data,schema markup,schema markup trên wordpress

Ví dụ về starRating Schema Markup

Ngoài ra, chúng ta ít để ý nhưng việc hiển thị star-rating trên kết quả tìm kiếm của các bài viết cũng là một loại dữ liệu có cấu trúc, và loại này cũng thường được sử dụng như một thành phần của các loại khác – như trên dữ liệu của product, recipe, book, movie…

Rating Schema structured data,schema markup,schema markup trên wordpress

4. Cách dùng Schema Markup trên Website WordPress

Như đã nói ở trên, với các trang web nói chung, có 3 cách dùng Schema Markup là chèn code JSON-LD, Microdata hoặc RDFa vào trang web, đây là việc khá khó cho người không nắm rõ về kiến thức lập trình (cơ bản), và cũng rất mất thời gian vì phải lặp lại công việc này ở từng trang web nếu cần dùng Schema Markup trên các trang đó. Đa số các trường hợp – việc tích hợp Schema Markup do các coder phụ trách.

Tuy nhiên, với các Website sử dụng CMS (Content Management System) như WordPress thì việc tích hợp Schema Markup có thể dễ dàng thực hiện bởi người dùng bình thường nhờ các plugins hỗ trợ tính năng này.

Việc sử dụng Schema Markup trên Website WordPress hiện nay được rất nhiều plugin SEO hỗ trợ, như Yoast SEO (Free), RankMath SEO (Free), SEOPress (Pro), … hay plugin chuyên cho Schema Markup là Schema Pro trong bộ Astra Agency.

Trên WordPress chúng ta không cần phải chèn code (JSON-LD, Microdata, RDFa) vào trang web một cách thủ công mà chỉ cần khai báo các thông tin cần thiết để plugin thực hiện công việc đó.

seopress pro schema structured data,schema markup,schema markup trên wordpress

Trong khóa học SEO WordPress của WPVUI, các bạn có thể học cách sử dụng Schema Markup rất dễ dàng và linh hoạt với sự hỗ trợ của các plugin SEOPress Pro hay Rank Math SEO Pro.

Chúc thành công!

Scroll to Top