什么是模式标记 & 为什么对 SEO 很重要？

使用模式标记提升搜索结果。了解它是什么以及如何使用它使您的网页脱颖而出。

Schema.org 是一组词汇（或模式），用于将结构化数据标记应用到网页和内容中。正确应用模式可以通过丰富片段改善 SEO 结果。

结构化数据标记由谷歌和微软等平台翻译，以提供增强的丰富结果（或富媒体片段），显示在搜索引擎结果页面或电子邮件中。例如，您可以使用变体模式标记您的电子商务产品页面，帮助谷歌理解产品变体。

Schema.org 是一个独立项目，帮助确立了互联网上的结构化数据一致性。它从2011年开始与谷歌、雅虎、必应和Yandex等搜索引擎合作。

模式词汇可以通过诸如RDFa、Microdata和JSON-LD等编码应用于页面。Google更喜欢使用JSON-LD模式，因为它最容易应用和维护。

Schema标记是否能提升您的搜索排名？

模式不是排名因素。

然而，只有当您使用模式标记时，您的网页才有资格在搜索引擎结果页面中获得富媒体片段。这可以提升您的搜索可见性，并增加搜索结果页面上您网页的点击率。

Schema也可以用来构建实体知识图谱和主题。以这种方式使用语义标记可以使您的网站与AI算法对实体进行分类的方式保持一致，帮助搜索引擎理解您的网站和内容。

结构化数据提供的信息可以为原本含糊不清的网页提供背景信息。它还可以帮助您澄清具有多重潜在含义的实体。

根据Schema.org:

“大多数网站管理员都熟悉其页面上的 HTML 标签。通常，HTML 标签告诉浏览器如何显示标签中包含的信息。例如，<h1>Avatar</h1> 告诉浏览器以标题 1 格式显示文本字符串“Avatar”。

然而，HTML 标签并未提供有关文本字符串含义的任何信息——“Avatar” 可能指的是极为成功的 3D 电影，也可能指的是一种个人资料图片——这可能会使搜索引擎更难以智能地向用户显示相关内容。”

这意味着搜索引擎应该有额外的信息来帮助它们弄清楚网页的内容。

你甚至可以直接将实体链接到维基百科或谷歌的知识图谱等网站，以建立明确的连接。根据Schema App的首席执行官Martha van Berkel的说法，这种方式使用Schema可以获得积极的SEO结果：积极的SEO结果。

在 Schema App，我们测试了实体链接如何影响SEO。我们发现，消除地点等实体的歧义会使页面在 \[附近\] 和其他基于位置的搜索查询中表现更好。

我们的实验还表明，实体链接可以帮助页面出现在更相关的非品牌搜索查询中，增加页面的点击率。

这里有一个实体链接的例子。如果您的页面谈论“巴黎”，这可能会让搜索引擎感到困惑，因为世界上有几个名为巴黎的城市。

如果您谈论的是加拿大安大略省的巴黎市，您可以使用 sameAs 属性将您网站上的巴黎实体链接到维基百科、维基数据和谷歌的知识图谱中已知的巴黎，安大略实体。

通过帮助搜索引擎理解内容，您正在帮助它们节省资源（尤其是在您拥有数百万页面的大型网站时尤为重要），增加内容被正确解释和排名良好的机会。虽然这可能不是直接的排名因素，但结构化数据通过为搜索引擎正确解释您的内容提供了最佳机会，使用户有最佳发现内容的机会。

什么是模式标记用于？

上面列出了一些最受欢迎的 schema 使用方式，这些方式得到了 Google 和其他搜索引擎的支持。

您可能有一个具有schema.org定义的对象类型，但不受搜索引擎支持。

在这种情况下，建议实施它们，因为搜索引擎可能会在未来开始支持它们，而您可能会从中受益，因为您已经实施了它们。

模式编码类型：JSON-LD、Microdata 和 RDFa

有三种主要格式用于编码模式标记:

JSON-LD.
Microdata.
RDFa.

Google推荐使用JSON-LD作为结构化数据的首选格式。虽然Microdata仍然受支持，但建议使用JSON-LD模式。

在某些情况下，由于网站技术基础设施的限制（如旧的内容管理系统），无法实施JSON-LD模式。在这些情况下，唯一的选择是通过Microdata或RDFa标记HTML。

现在可以通过将 JSON-LD 和 Microdata 格式进行混合，通过匹配 JSON-LD 模式的 @id 属性和 Microdata 模式的 itemid 属性。这种方法有助于减少页面的 HTML 大小。

例如，在一个包含大量文本的常见问题解答部分，您可以使用Microdata来处理内容，使用JSON-LD来处理结构化数据，而无需重复文本，从而避免页面大小的增加。在本文下文中，我们将更深入地讨论每种类型。

JSON-LD模式格式

JSON-LD 使用 JSON 对数据进行编码，使得将结构化数据整合到网页变得更加容易。JSON-LD 允许使用带有 @ids 的图形连接不同的模式类型，从而改善数据集成并减少冗余。

让我们看一个例子。假设你拥有一家销售高质量路由器的商店。如果你查看首页的源代码，你可能会看到类似这样的内容：

<div>
<h1>TechHaven</h1>
<h2>您在网上找到的最好的路由器！</h2>
<p>地址：</p>
<p>459 Humpback Road</p>
<p>Rialto, Ca</p>
<p>电话：909 574 3903</p>
<p><a href="http://www.techhaven.com/menu">点击这里查看我们最好的路由器！</a></p>
<p>营业时间：</p>
<p>周一至周六 8am - 10:30pm</p>
<p>周日：2pm - 8pm</p>
</div>

一旦您深入代码，您会想要找到讨论您的业务提供内容的网页部分。在这个例子中，这些数据可以在两个<div>标签之间找到。

以下 JSON-LD 格式的文本将标记您网页上的 HTML 片段中的信息，您可能希望将其包含在网页的 <head> 部分中。

<script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Store", "name": "TechHaven", "description": "The best routers you’ll find online!", "address": { "@type": "PostalAddress", "streetAddress": "459 Humpback Road", "addressLocality": "Rialto", "addressRegion": "CA", "postalCode": "92376", "addressCountry": "USA" }, "telephone": "+19095743903", "url": "http://www.techhaven.com/menu", "openingHoursSpecification": [ { "@type": "OpeningHoursSpecification", "dayOfWeek": [ "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" ], "opens": "08:00", "closes": "22:30" }, { "@type": "OpeningHoursSpecification", "dayOfWeek": "Sunday", "opens": "14:00", "closes": "20:00" } ] } </script>

这段代码通过属性"@type": "Store"将您的业务定义为商店。

然后，它详细介绍了其位置、联系信息，周一至周六的营业时间，以及周日的不同营业时间。

通过以这种方式构建网页数据，您可以直接向搜索引擎提供关键信息，从而改善它们索引和显示搜索结果中您的网站的方式。就像在初始HTML中添加标签一样，插入这个JSON-LD脚本可以告诉搜索引擎有关您业务的特定方面。

让我们来看另一个WebPage模式的示例，通过@id与Organization和Author模式相连接。JSON-LD是Google推荐的格式，其他搜索引擎也推荐使用，因为它非常灵活，这是一个很好的例子。

<script type="application/ld+json"> { "@context": "https://schema.org", "@graph": [ { "@id": "https://www.example.com/#website", "@type": "WebSite", "name": "Example Website", "url": "https://www.example.com", "publisher": { "@id": "https://www.example.com/#organization" } }, { "@id": "https://www.example.com/#organization", "@type": "Organization", "name": "Example Company", "alternateName": "Example Co.", "legalName": "Example Company Inc.", "slogan": "Innovation at its best", "foundingDate": "2000-01-01", "numberOfEmployees": 200, "url": "https://www.example.com", "logo": "https://www.example.com/logo.png", "contactPoint": { "@type": "ContactPoint", "telephone": "+1-800-555-1212", "contactType": "Customer Service", "areaServed": "US", "availableLanguage": "English" }, "founder": { "@id": "https://www.example.com/founder/jane-smith/#founder" }, "sameAs": [ "https://www.facebook.com/example", "https://www.twitter.com/example", "https://www.linkedin.com/company/example" ] }, { "@id": "https://www.example.com/sample-page/#webpage", "@type": "WebPage", "url": "https://www.example.com/about", "name": "About Us", "description": "This is the About Us page for Example Company.", "isPartOf": { "@id": "https://www.example.com/#website" }, "publisher": { "@id": "https://www.example.com/#organization" } }, { "@id": "https://www.example.com/sample-page/#newsarticle", "@type": "NewsArticle", "headline": "Example News Headline", "datePublished": "2024-05-10T10:00:40+00:00", "dateModified": "2024-05-10T11:00:40+00:00",  "wordCount": 180, "description": "This is an example news article.", "articleBody": "This is the full content of the example news article. It provides detailed information about the news event or topic covered in the article.", "author": { "@id": "https://www.example.com/authors/john-doe/#author" }, "publisher": { "@id": "https://www.example.com/#organization" }, "copyrightHolder": { "@id": "https://www.example.com/#organization" }, "isPartOf": { "@id": "https://www.example.com/sample-page/#webpage" }, "mainEntityOfPage": { "@id": "https://www.example.com/sample-page/#webpage" } }, { "@id": "https://www.example.com/founder/jane-smith/#founder", "@type": "Person", "name": "Jane Smith", "url": "https://www.example.com/founder/jane-smith", "sameAs": [ "https://www.twitter.com/janesmith", "https://www.linkedin.com/in/janesmith" ] }, { "@id": "https://www.example.com/authors/john-doe/#author", "@type": "Person", "name": "John Doe", "url": "https://www.example.com/authors/john-doe", "sameAs": [ "https://www.twitter.com/johndoe", "https://www.linkedin.com/in/johndoe" ] } ] } </script>

在这个例子中：

网站链接到组织作为发布者，使用 @id。
组织使用详细属性进行描述。
网页链接到网站，使用 isPartOf。
新闻文章链接到网页，使用 isPartOf，并返回到网页，使用 mainEntityOfPage，并通过 @id 包括作者属性。

您可以看到如何使用"@id"属性将图形节点链接在一起。通过这种方式，我们告诉谷歌这是由模式中描述的发布者发布的网页。

使用哈希符号(#)作为ID是可选的。您只需确保不同的模式类型不会意外地具有相同的ID。添加自定义哈希符号(#)可能会有所帮助，因为它提供了额外的保险层，以确保它们不会重复。

你可能会想为什么我们使用"@id"来连接图节点。我们不能只是在同一页上分别放置组织、作者和网页模式，直觉告诉我们它们是相互连接的吗？

问题在于，谷歌和其他搜索引擎无法可靠地解释这些连接，除非明确使用 @id 进行链接。

将其他模式类型添加到图中就像搭乐高积木一样简单。假设我们想要向模式中添加一张图片：

{
   "@type": "ImageObject",
   "@id": "https://www.example.com/#post-image",
   "url": "https://www.example.com/example.png",
   "contentUrl": "https://www.example.com/example.png",
   "width": 2160,
   "height": 1215,
   "thumbnail": [
     {
        "@type": "ImageObject",
        "url": "https://example.com/4x3/photo.jpg",
        "width": 1620,
        "height": 1215
      },
      {
        "@type": "ImageObject",
        "url": "https://example.com/16x9/photo.jpg",
        "width": 1440,
        "height": 810
      },
      {
        "@type": "ImageObject",
        "url": "https://example.com/1x1/photo.jpg",
        "width": 1000,
        "height": 1000
      }
    ]
}

正如您已经从NewsArticle模式中了解的那样，您需要将其添加到上述模式图中作为父节点，并通过@id进行链接。

当你这样做时，它将具有这种结构：

相当容易，不是吗？现在你理解了主要原则，就可以根据网站上的内容构建自己的模式。

既然我们生活在人工智能时代，您可能还想使用ChatGPT或其他聊天机器人来帮助您构建任何模式。

微数据架构格式

Microdata 是一组标签，旨在使使用机器可读标签对 HTML 元素进行注释变得更加容易。

然而，使用微数据的一个缺点是你必须在网页正文中标记每个单独的项目。可以想象，这可能会很快变得混乱。

查看这个示例HTML代码，它对应上面的NewsArticle JSON模式：

<main>
 <section>
   <h2>我们的公司</h2>
   <p>Example Company，也被称为 Example Co.，是科技行业的领先创新者。</p>
   <p>成立于2000年，我们已经发展成一个拥有200名专业员工的团队。</p>
   <p>我们的口号是：“创新至上”。</p>
   <p>联系我们，客服电话：+1-800-555-1212。</p>
</section>
<section>
  <h2>我们的创始人</h2>
  <p>我们的创始人简·史密斯（Jane Smith）是科技行业的先驱。</p>
  <p>关注简的 <a href="https://www.twitter.com/janesmith">Twitter</a> 和 <a href="https://www.linkedin.com/in/janesmith">LinkedIn</a>。</p>
  </section>
<section>
  <h2>关于我们</h2>
  <p>这是 Example Company 的关于我们页面。</p>
</section>
<section>
  <h2>示例新闻标题</h2>
  <p>这是一个新闻文章示例。</p>
  <p>这是新闻文章示例的完整内容。它提供了有关文章中涵盖的新闻事件或主题的详细信息。</p>
  <p>作者：约翰·多（John Doe）。关注约翰的 <a href="https://www.twitter.com/johndoe">Twitter</a> 和 <a href="https://www.linkedin.com/in/johndoe">LinkedIn</a>。</p>
  <img src="https://www.example.com/example.png" alt="示例图片" width="2160" height="1215">
</section>
</main>

如果我们将上述 JSON-LD 模式转换为 Microdata 格式，它将如下所示：

这个示例展示了与 JSON-LD 相比，由于标记分散在 HTML 中，变得更加复杂。让我们了解标记中包含了什么。

你可以看到 <div> 标签，例如：

通过添加此标签，我们声明位于<div>块之间的HTML代码标识特定项目。

接下来，我们必须通过使用'itemtype'属性来识别该项是什么类型的项（人员）。

<div itemtype="https://schema.org/Person">

项目类型以 URL 的形式呈现（例如 https://schema.org/Person）。例如，假设您有一个产品，您可以使用 http://schema.org/Product。

为了方便起见，您可以在这里浏览项目类型列表，并查看扩展以识别您正在寻找的特定实体。请记住，此列表并不包含所有内容，仅包括谷歌支持的内容，因此可能找不到适合您特定领域的项目类型。

虽然看起来复杂，但Schema.org提供了如何使用不同项目类型的示例，这样你就可以看到代码应该做什么。

别担心；你不会被丢在一边，孤冷地试图自己弄清楚这个问题！

如果您仍然对代码感到有些害怕，Google的结构化数据标记助手可以帮助您轻松为您的网页添加标记。

要使用这个令人惊叹的工具，只需选择您的项目类型，粘贴目标页面的URL或您想要定位的内容，然后突出显示不同的元素，以便您可以对其进行标记。

RDFa模式格式

RDFa 是 属性中的资源描述框架 的缩写。本质上，RDFa 是 HTML5 的扩展，旨在帮助用户标记结构化数据。

RDFa与Microdata并没有太大的区别。RDFa标签将现有的HTML代码整合到网页的主体中。为了便于理解，我们将查看上面相同的代码。

相同的 JSON-LD 新闻文章的 HTML 将如下所示：

与Microdata不同，Microdata使用URL来标识类型，而RDFa使用一个或多个单词来分类类型。

如果您希望进一步识别属性，请使用 'typeof' 属性。

让我们将 JSON-LD、Microdata 和 RDFa 进行并排比较。JSON-LD 的 @type 属性相当于 Microdata 格式中的 itemtype 属性和 RDFa 中的 typeof 属性。此外，JSON-LD 属性的 propertyName 相当于 itemprop 和 property attributes。

属性名称

JSON-LD

微数据

RDFa

类型

@类型

项目类型

typeof

@id

项目编号

资源

属性

属性名称

itemprop

属性

名称

itemprop="name"

property=”名称”

描述

itemprop="description"

property=”描述”

要进一步了解，请访问 Schema.org 查看列表和示例。您可以找到哪些元素被定义为属性，哪些被定义为类型。

为了帮助您，Schema.org 的每个页面都提供了如何正确应用标签的示例。当然，您也可以使用谷歌的结构化数据测试工具。

使用 JSON-LD 混合不同格式的结构化数据

如果您使用 JSON-LD 架构，但页面的某些部分与之不兼容，您可以通过 @id 进行链接，混合架构格式。

例如，如果您的网站上有实时博客和一个 JSON-LD 模式，将所有实时博客项目包含在 JSON 模式中意味着页面上会有相同内容出现两次，这可能会增加 HTML 大小，影响首次内容绘制和最大内容绘制页面速度指标。

你可以通过在页面加载时使用JavaScript动态生成JSON-LD，或者通过使用Microdata格式标记实时博客的HTML标签，然后通过“@id”在头部部分链接到你的JSON-LD模式来解决这个问题。

这里是如何做的一个例子。

假设我们有这样一个带有 Microdata 标记的 HTML，其中 itemid="https://www.example.com/live-blog-page/#live-blog"

<div itemid="https://www.example.com/live-blog-page/#live-blog" itemscope itemtype="https://schema.org/LiveBlogPosting">
  <h1 itemprop="name">直播博客标题<h1>
  <p itemprop="description">探索 DevDay 的重大公告<p>
  <meta itemprop="coverageStartTime" content="2024-05-06T17:39:59+00:00" />
  <meta itemprop="coverageEndTime" content="2024-05-07T03:00:00+00:00" />
  <div itemprop="liveBlogUpdate" itemscope itemtype="https://schema.org/BlogPosting">
      <div itemprop="datePublished" content="2024-05-06T18:45:52+00:00">
        <span>1:45 PM 东部时间</span> <span>2023年11月6日</span>
     </div>    
    <div itemprop="articleBody">
    <p>OpenAI 正在逐步部署 GPTs 的第一步 - 为安全目的定制的 ChatGPT。</p>
    </div>
 </div>
<div itemprop="liveBlogUpdate" itemscope itemtype="https://schema.org/BlogPosting">
   <div itemprop="datePublished" content="2023-11-06T18:44:26+00:00">
    <span>1:44 PM 东部时间</span> <span>2023年11月6日</span>
   </div>
   <div itemprop="articleBody">
      <p>ChatGPT 现在使用具有当前知识的 GPT-4 turbo。</p>
      <p>它还知道在任务中选择哪种工具，使用 GPT-4 All Tools。</p>
   </div>
</div>
<div itemprop="liveBlogUpdate" itemscope itemtype="https://schema.org/BlogPosting">
  <div itemprop="datePublished" content="2023-11-06T18:43:31+00:00">
     <span>1:43 PM 东部时间</span> <span>2023年11月6日</span>
  </div>
  <div itemprop="articleBody">
    <p>微软首席执行官萨蒂亚·纳德拉（Satya Nadella）加入 Altman 宣布与 OpenAI 深化合作，帮助开发人员带来更多人工智能进步。</p>
  </div>
</div>'

我们可以从我们之前的示例 JSON-LD 示例中链接到它，就像这样：

如果您在模式验证工具中复制并粘贴HTML和JSON示例，您将看到它们被正确验证。

The schema validator does validate the above example.

结构化数据对SEO的影响

本文探讨了不同的模式编码类型以及有关结构化数据实施的所有细微差别。

Schema比看起来要容易得多，这是您必须将其纳入网页的最佳实践。虽然应用Schema不会直接提升您的SEO排名，但它可以：

使您的页面有资格出现在丰富结果中。
确保您的页面更频繁地被正确的用户看到。
避免混淆和模棱两可。

工作可能看起来很繁琐。然而，经过时间和努力，正确实施模式标记对您的网站有好处，并且可以通过向搜索引擎提供准确信息来带来更好的用户体验。

图片来源

精选图片: Paulo Bobita
作者截图

阅读更多：