食谱（Recipe、HowTo、ItemList）结构化数据

使用结构化数据让 Google 了解您的食谱，进而帮助用户找到您的食谱内容。 有了您提供的评价者评分、烹饪和准备时长以及营养成分等信息，Google 可以更好地了解您的食谱并以有趣的方式呈现给用户。食谱可以显示在 Google 搜索结果和 Google 图片中。

该图示展示了食谱富媒体搜索结果在 Google 搜索中的显示效果。它包含 4 条来自不同网站的富媒体搜索结果，其中详细说明了食谱烹饪时间、图片以及评价信息。 该图示展示了食谱在 Google 图片中的显示效果。有 6 张图片显示不同的菜品，其中 3 条结果包含食谱标记，告诉用户这是食谱

根据您对内容的标记方式，您的食谱可能符合以下食谱增强功能的使用条件：

食谱增强功能
食谱托管轮播界面：通过添加 ItemList 结构化数据，使用户能浏览您的食谱库。 该图示展示了食谱托管轮播界面在 Google 搜索中的显示效果。它以轮播界面形式显示同一网站中的 3 种不同食谱，用户可以浏览并选择特定食谱

How to add structured data

Structured data is a standardized format for providing information about a page and classifying the page content. If you're new to structured data, you can learn more about how structured data works.

Here's an overview of how to build, test, and release structured data.

  1. Add the required properties. Based on the format you're using, learn where to insert structured data on the page.
  2. Follow the guidelines.
  3. Validate your code using the Rich Results Test and fix any critical errors. Consider also fixing any non-critical issues that may be flagged in the tool, as they can help improve the quality of your structured data (however, this isn't necessary to be eligible for rich results).
  4. Deploy a few pages that include your structured data and use the URL Inspection tool to test how Google sees the page. Be sure that your page is accessible to Google and not blocked by a robots.txt file, the noindex tag, or login requirements. If the page looks okay, you can ask Google to recrawl your URLs.
  5. To keep Google informed of future changes, we recommend that you submit a sitemap. You can automate this with the Search Console Sitemap API.

示例

下面是一些使用 JSON-LD 代码的食谱示例。

Google 搜索上的食谱

下面是一个可在 Google 搜索结果中显示的网页示例。

<html>
  <head>
    <title>Non-Alcoholic Piña Colada</title>
    <script type="application/ld+json">
    {
      "@context": "https://schema.org/",
      "@type": "Recipe",
      "name": "Non-Alcoholic Piña Colada",
      "image": [
      "https://example.com/photos/1x1/photo.jpg",
      "https://example.com/photos/4x3/photo.jpg",
      "https://example.com/photos/16x9/photo.jpg"
      ],
      "author": {
        "@type": "Person",
        "name": "Mary Stone"
      },
      "datePublished": "2024-03-10",
      "description": "This non-alcoholic pina colada is everyone's favorite!",
      "recipeCuisine": "American",
      "prepTime": "PT1M",
      "cookTime": "PT2M",
      "totalTime": "PT3M",
      "keywords": "non-alcoholic",
      "recipeYield": "4 servings",
      "recipeCategory": "Drink",
      "nutrition": {
        "@type": "NutritionInformation",
        "calories": "120 calories"
      },
      "aggregateRating": {
        "@type": "AggregateRating",
        "ratingValue": 5,
        "ratingCount": 18
      },
      "recipeIngredient": [
        "400ml of pineapple juice",
        "100ml cream of coconut",
        "ice"
      ],
      "recipeInstructions": [
        {
          "@type": "HowToStep",
          "name": "Blend",
          "text": "Blend 400ml of pineapple juice and 100ml cream of coconut until smooth.",
          "url": "https://example.com/non-alcoholic-pina-colada#step1",
          "image": "https://example.com/photos/non-alcoholic-pina-colada/step1.jpg"
        },
        {
          "@type": "HowToStep",
          "name": "Fill",
          "text": "Fill a glass with ice.",
          "url": "https://example.com/non-alcoholic-pina-colada#step2",
          "image": "https://example.com/photos/non-alcoholic-pina-colada/step2.jpg"
        },
        {
          "@type": "HowToStep",
          "name": "Pour",
          "text": "Pour the pineapple juice and coconut mixture over ice.",
          "url": "https://example.com/non-alcoholic-pina-colada#step3",
          "image": "https://example.com/photos/non-alcoholic-pina-colada/step3.jpg"
        }
      ],
      "video": {
        "@type": "VideoObject",
        "name": "How to Make a Non-Alcoholic Piña Colada",
        "description": "This is how you make a non-alcoholic piña colada.",
        "thumbnailUrl": [
          "https://example.com/photos/1x1/photo.jpg",
          "https://example.com/photos/4x3/photo.jpg",
          "https://example.com/photos/16x9/photo.jpg"
         ],
        "contentUrl": "https://www.example.com/video123.mp4",
        "embedUrl": "https://www.example.com/videoplayer?video=123",
        "uploadDate": "2024-02-05T08:00:00+08:00",
        "duration": "PT1M33S",
        "interactionStatistic": {
          "@type": "InteractionCounter",
          "interactionType": { "@type": "WatchAction" },
          "userInteractionCount": 2347
        },
        "expires": "2024-02-05T08:00:00+08:00"
       }
    }
    </script>
  </head>
  <body>
  </body>
</html>

下面是一个包含 itemList 结构化数据的食谱摘要网页（一个包含食谱列表的网页）示例。此内容可以显示在 Google 搜索结果中的网格内。

<html>
  <head>
    <title>Grandma's Best Pie Recipes</title>
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "ItemList",
      "itemListElement": [
        {
          "@type": "ListItem",
          "position": 1,
          "url": "https://example.com/apple-pie.html"
        },
        {
          "@type": "ListItem",
          "position": 2,
          "url": "https://example.com/blueberry-pie.html"
        },
        {
          "@type": "ListItem",
          "position": 3,
          "url": "https://example.com/cherry-pie.html"
        }]
    }
    </script>
  </head>
  <body>
  </body>
</html>

指南

您的标记必须遵循结构化数据常规指南，才能显示在 Google 搜索结果中。

以下指南适用于 Recipe 结构化数据。

  • 只有当内容是关于特定菜肴的制作方式时，才应使用 Recipe 结构化数据。例如，“磨砂膏”或“聚会创意”就不是有效的菜肴名称。
  • 要使您的食谱显示在轮播界面或网格中，您必须遵循以下指南：
    • 提供 ItemList 结构化数据，为您的列表汇总食谱。您可以单独提供 ItemList 结构化数据，也可以和 Recipe 结构化数据一起提供。
    • 您的网站必须有一个摘要网页，其中列出集合内的所有食谱。例如，当用户点击 Google 搜索结果中的摘要链接时，他们便会被正确地定向到您网站上的相应网页，其中列出了与搜索内容相关的食谱。

结构化数据类型定义

要使您的内容能够作为富媒体搜索结果显示在 Google 搜索结果中，您必须为相应内容添加必需的属性。您还可添加建议的属性，以便添加与您的内容相关的更多信息，进而提供更好的用户体验。

Recipe

请使用 schema.org Recipe 类型的以下属性标记食谱内容。如需了解 Recipe 的完整定义，请访问 schema.org/Recipe。 Google 支持的属性如下：

必要属性
image

URL 或 ImageObject

菜肴成品图片。

其他的图片指南：

  • 图片网址必须可抓取且可编入索引。如需检查 Google 能否访问您的网址，请使用网址检查工具。
  • 图片必须代表标记的内容。
  • 图片必须采用受 Google 图片支持的文件格式。
  • 为取得最佳效果，建议您提供具有以下宽高比的多个高分辨率图片（宽度乘以高度至少为 50K 像素）：16x9、4x3 和 1x1。

例如：

"image": [
  "https://example.com/photos/1x1/photo.jpg",
  "https://example.com/photos/4x3/photo.jpg",
  "https://example.com/photos/16x9/photo.jpg"
]
name

Text

菜肴的名称。
建议属性
aggregateRating

AggregateRating

相应对象所获得的平均评价分数的注解。请遵循评价摘要指南，并查看必需和建议的 AggregateRating 属性列表。

如果 Recipe 结构化数据只包含一条评价，那么评价者的名称必须是有效的个人或组织名称。例如，“配料可享 50% 折扣”就不是有效的评价者名称。
author

Person 或 Organization

撰写食谱的个人或组织的名称。为了帮助 Google 更好地了解各种功能中的作者，应该遵循作者标记最佳实践。
cookTime

Duration

实际烹饪菜肴所需的时间，采用 ISO 8601 格式（如果适用）。

始终与 prepTime 结合使用。
datePublished

Date

食谱的发布日期，采用 ISO 8601 格式（如果适用）。
description

Text

一段用于描述菜肴的简短摘要。
keywords

Text

用来描述您的食谱的其他字词，如季节（“夏季”）、假日（“万圣节”）或其他描述词（“快速”、“简单”、“正宗”）。

其他指南

  • 用英文逗号分隔关键字列表中的多个条目。
  • 请勿使用实际为 recipeCategory 或 recipeCuisine 的标记。

    不建议：

    "keywords": "dessert, American"

    建议：

    "keywords": "winter apple pie, nutmeg crust"
nutrition.calories

Energy

使用此食谱制作的每份菜肴所含的卡路里数。如果定义了 nutrition.calories，必须使用份量定义 recipeYield。
prepTime

Duration

准备菜肴的食材和工作区所需的时间，采用 ISO 8601 格式（如果适用）。

始终与 cookTime 结合使用。
recipeCategory

Text

您的食谱是关于三餐中的哪一餐或哪道菜。例如：“晚餐”、“主菜”或“甜点/点心”。
recipeCuisine

Text

与您的食谱相关的地理区域。例如，“法国菜”、“地中海菜”或“美国菜”。
recipeIngredient

Text

食谱中用到的配料。

例如：

"recipeIngredient": [
  "1 (15 ounce) package double crust ready-to-use pie crust",
  "6 cups thinly sliced, peeled apples (6 medium)",
  "3/4 cup sugar",
  "2 tablespoons all-purpose flour",
  "3/4 teaspoon ground cinnamon",
  "1/4 teaspoon salt",
  "1/8 teaspoon ground nutmeg",
  "1 tablespoon lemon juice"
]

其他指南：

  • 仅添加按食谱烹制菜肴所必需的配料。
  • 不要添加无关紧要的信息，如配料的定义。
recipeInstructions

HowToStep、HowToSection 或 Text

制作菜肴的步骤。

有几个选项可用于设置 recipeInstructions 的值。我们建议使用 HowToStep。当食谱包含多个部分时，您还可以利用 HowToSection 将 HowToStep 分组。

  • HowToStep：使用 HowToStep 指定食谱的步骤。 
    "recipeInstructions": [
  {
    "@type": "HowToStep",
    "name": "Preheat",
    "text": "Heat oven to 425°F.",
    "url": "https://example.com/recipe#step1",
    "image": "https://example.com/photos/recipe/step1.jpg"
  }, {
    "@type": "HowToStep",
    "name": "Prepare crust",
    "text": "Place 1 pie crust in ungreased 9-inch glass pie plate, pressing firmly against side and bottom.",
    "url": "https://example.com/recipe#step2",
    "image": "https://example.com/photos/recipe/step2.jpg"
  }, {
    "@type": "HowToStep",
    "name": "Make filling",
    "text": "In large bowl, gently mix filling ingredients; spoon into crust-lined pie plate.",
    "url": "https://example.com/recipe#step3",
    "image": "https://example.com/photos/recipe/step3.jpg"
  }, {
    "@type": "HowToStep",
    "name": "Cover",
    "text": "Top with second crust. Cut slits or shapes in several places in top crust.",
    "url": "https://example.com/recipe#step4",
    "image": "https://example.com/photos/recipe/step4.jpg"
  }, {
    "@type": "HowToStep",
    "name": "Bake",
    "text": "Bake 40 to 45 minutes. The pie is ready when the apples are tender and the crust is golden brown.",
    "url": "https://example.com/recipe#step5",
    "image": "https://example.com/photos/recipe/step5.jpg"
  }, {
    "@type": "HowToStep",
    "name": "Cool",
    "text": "Cool on cooling rack at least 2 hours before serving.",
    "url": "https://example.com/recipe#step6",
    "image": "https://example.com/photos/recipe/step6.jpg"
  }
]
  • HowToSection（仅当食谱包含多个部分时）：用于将步骤组合成多个部分。有关示例，请参见 HowToSection。
  • 单个或重复的文本属性：包含一个或多个步骤的文本块。Google 会将所有步骤视为在一个部分中。重复的属性值会连接成一个文本块。然后，Google 会尝试自动将这个文本块拆分为多个步骤。Google 会尝试查找并移除所有部分名称、步骤编号、关键字以及其他所有可能会错误地显示在食谱步骤文本中的内容。为获得最佳效果，我们建议您使用 HowToStep 明确指定步骤。 
    "recipeInstructions": [
  "In large bowl, gently mix filling ingredients; spoon into crust-lined pie
plate. Top with second crust. Cut slits or shapes in several places in top
crust. Bake 40 to 45 minutes. The pie is ready when the or until apples are
tender and the crust is golden brown. Cool on cooling rack at least 2 hours
before serving."
]

其他指南

  • 不要添加应在别处使用的元数据。尤其是，应使用 author 属性指定作者，使用 recipeCuisine 属性指定菜系，使用 recipeCategory 属性指定类别，并使用 keywords 属性指定其他关键字。
  • 只能添加与如何按照食谱烹制菜肴相关的文本，不能添加其他文本（如“指导”、“观看视频”或“第 1 步”）。请在结构化数据以外指定这些词组。

    不建议：

    "recipeInstructions": [{
  "@type": "HowToStep",
  "text": "Step 1. Heat oven to 425°F."
}]

    建议：

    "recipeInstructions": [{
  "@type": "HowToStep",
  "text": "Heat oven to 425°F."
}]
recipeYield

Text 或 Integer

食谱的份量（如果适用）。您可以使用纯数字指定此食谱制作出的份量。如果您想使用其他单位（例如食物数量），可以添加其他份量信息。如果您指定了每份菜肴的任何营养信息（例如 nutrition.calories），这就是必需的属性。

示例

"recipeYield": [
  "6",
  "24 cookies"
]
totalTime

Duration

准备和烹饪菜肴所需的总时间，采用 ISO 8601 格式（如果适用）。

使用 totalTime，或者将 cookTime 与 prepTime 搭配使用。
video VideoObject

一段视频，描述菜肴的烹制步骤。需遵循必需和建议的视频属性的列表。

HowToSection

使用 HowToSection 对一系列步骤（或子部分）进行分组，它们构成了食谱说明的一部分。直接在 recipeInstructions 属性的定义内指定 HowToSection，或指定为另一个 HowToSection 的 itemListElement。

HowToSection 类型用于定义单个食谱的一部分，可包含一个或多个步骤。不得使用 HowToSection 定义同一菜肴的不同食谱，而是要将 HowToSection 用作单个食谱的一部分。如需列举菜肴的多个食谱，请使用多个 Recipe 对象。例如，对于制作苹果派的多种方法，请将它们列为多个 Recipe 对象，而不是 HowToSection 对象。

如需了解 HowToSection 的完整定义，请访问 schema.org/HowToSection。

必需的属性
itemListElement HowToStep

部分和/或子部分的详细步骤列表。例如，在某道披萨食谱中，可能有一个部分会介绍披萨皮制作步骤，有一个部分会介绍馅料准备步骤，还有一个部分会介绍拌匀和烘焙步骤。

示例：

{
  "@type": "HowToSection",
  "name": "Assemble the pie",
  "itemListElement": [
    {
      "@type": "HowToStep",
      "text": "In large bowl, gently mix filling ingredients; spoon into crust-lined pie plate."
    }, {
      "@type": "HowToStep",
      "text": "Top with second crust. Cut slits or shapes in several places in top crust."
    }
  ]
}
name Text

相应部分的名称。

HowToStep

使用 HowToStep 对一个或多个句子进行分组，它们介绍了如何完成食谱的某个部分（如果这适用于您的内容）。使用句子定义 text 属性，或者使用 HowToDirection 或 HowToTip 为每个句子定义 itemListElement。

使用 HowToStep 类型的以下属性标记食谱步骤。直接在 recipeInstructions 属性的定义内指定 HowToStep，或指定为 HowToSection 的 itemListElement。

如需了解 HowToStep 的完整定义，请访问 schema.org/HowToStep。

必需的属性
itemListElement HowToDirection 或 HowToTip

详细子步骤列表，包括指导或提示。

如果使用了 text，则该属性为可选属性。
text Text

相应步骤的完整说明文字。

如果使用了 itemListElement，则该属性为可选属性。其他指南：

  • 只能添加说明文本，不能添加其他文本（如“指导”、“观看视频”或“第 1 步”）。请在标记的属性以外指定这些词组。

    不建议：

    {
  "@type": "HowToStep",
  "text": "Step 1. Heat oven to 425°F."
}

    建议：

    {
  "@type": "HowToStep",
  "text": "Heat oven to 425°F."
}
建议属性
image ImageObject 或 URL

相应步骤的图片。其他图片指南：

  • 图片网址必须可抓取且可编入索引。
  • 图片必须代表已标记的内容。
  • 图片格式必须为 .jpg、.png 或 .gif。
name Text

相应步骤的总结性字词或短语（例如“排列馅饼皮”）。请勿使用非描述性文字（例如“第 1 步：[文字]”）或其他形式的步骤编号（例如“1. [文字]”）。

url URL

一个可直接链接到相应步骤的 URL（如有），例如锚链接片段。

video VideoObject 或 Clip

相应步骤的视频或视频剪辑。

如果使用 VideoObject，则位于必需和建议的 Video 属性或 Clip 属性列表后面。

HowToDirection 和 HowToTip

HowToDirection 和 HowToTip 用于描述指导或提示（如果适用）。这两者具有相同的必需属性和建议属性。

如需了解 HowToDirection 和 HowToTip 的完整定义，请访问 schema.org/HowToDirection 和 schema.org/HowToTip。

必需的属性
text Text

相应指导或提示的文字。

ItemList

除了 Recipe 属性之外，您还可为托管专用列表添加以下属性。虽然 ItemList 不是必需的，但如果您希望食谱能够显示在托管方陈列界面中，则必须添加以下属性。如需详细了解托管轮播界面，请参阅 Carousel。

如需了解 ItemList 的完整定义，请访问 schema.org/ItemList。

必需的属性
itemListElement

ListItem

列表中单个食谱网页的注释。
ListItem.position

Integer

列表中相应食谱网页的序数位置。例如：

"itemListElement": [
  {
    "@type": "ListItem",
    "position": 1,
  }, {
    "@type": "ListItem",
    "position": 2,
  }
]
ListItem.url

URL

项目网页的规范网址。每个项目都必须具备一个独一无二的网址。

使用 Search Console 监控富媒体搜索结果

Search Console 是一款工具，可帮助您监控网页在 Google 搜索结果中的显示效果。即使没有注册 Search Console，您的网页也可能会显示在 Google 搜索结果中，但注册 Search Console 能够帮助您了解 Google 如何查看您的网站并做出相应的改进。建议您在以下情况下查看 Search Console：

  1. 首次部署结构化数据后
  2. 发布新模板或更新代码后
  3. 定期分析流量时

首次部署结构化数据后

等 Google 将网页编入索引后，请在相关的富媒体搜索结果状态报告中查看是否存在问题。 理想情况下，有效项目数量会增加，而无效项目数量不会增加。如果您发现结构化数据存在问题，请执行以下操作：

  1. 修正无效项目。
  2. 检查实际网址，核实问题是否仍然存在。
  3. 使用状态报告请求验证。

发布新模板或更新代码后

如果对网站进行重大更改，请监控结构化数据无效项目的增幅。
  • 如果您发现无效项目增多了，可能是因为您推出的某个新模板无法正常工作，或者您的网站以一种新的错误方式与现有模板交互。
  • 如果您发现有效项目减少了（但无效项目的增加情况并不对应），可能是因为您的网页中未再嵌入结构化数据。请通过网址检查工具了解导致此问题的原因。

定期分析流量时

请使用效果报告分析您的 Google 搜索流量。数据将显示您的网页在 Google 搜索结果中显示为富媒体搜索结果的频率、用户点击该网页的频率以及网页在搜索结果中的平均排名。您还可以使用 Search Console API 自动提取这些结果。

问题排查

如果您在实施或调试结构化数据时遇到问题，请查看下面列出的一些实用资源。