Uporządkowane dane dotyczące przepisów kulinarnych (Recipe, HowTo, ItemList)

Pomóż użytkownikom znaleźć treść przepisu, informując o nim Google za pomocą uporządkowanych danych. Jeśli podasz takie informacje jak oceny recenzentów, czas przygotowywania i gotowania potraw oraz informacje o wartościach odżywczych, możemy zaprezentować Twój przepis w atrakcyjny sposób. Przepisy mogą pojawiać się w wynikach wyszukiwania Google i Grafice Google.

Ilustracja pokazująca, jak wyniki z elementami rozszerzonymi dotyczące przepisów mogą wyglądać w wyszukiwarce Google. Zawiera 4 wyniki z elementami rozszerzonymi z różnych witryn, w tym szczegółowe informacje o czasie gotowania, zdjęcie oraz informacje o opiniach. Ilustracja pokazująca, jak mogą się wyświetlać przepisy w Grafice Google. Jest 6 obrazów przedstawiających różne potrawy, a 3 z nich zawierają plakietkę, która informuje użytkownika, że jest to przepis.

W zależności od tego, jak oznaczysz swoje treści, możesz korzystać z tych ulepszeń przepisów:

Ulepszenia przepisów
Karuzela hosta z przepisami: dodanie uporządkowanych danych ItemList umożliwi użytkownikom przeglądanie stron galerii przepisów. Ilustracja pokazująca, jak może się wyświetlać karuzela hosta z przepisami w wyszukiwarce Google. Wyświetla 3 różne przepisy z tej samej witryny w formacie karuzeli, które użytkownicy mogą przeglądać i wybierać

Dodawanie uporządkowanych danych

Uporządkowane dane to standardowy format udostępniania informacji o stronie i klasyfikowania jej zawartości. Jeśli dopiero zaczynasz, dowiedz się, jak działają uporządkowane dane.

Poniżej omawiamy sposób tworzenia, testowania i udostępniania uporządkowanych danych.

  1. Dodaj wymagane właściwości. Dowiedz się, w którym miejscu na stronie umieścić uporządkowane dane w zależności od używanego formatu.
  2. Przestrzegaj wskazówek.
  3. Zweryfikuj kod za pomocą testu wyników z elementami rozszerzonymi i napraw błędy krytyczne. Rozważ też usunięcie niekrytycznych problemów, które mogą zostać zgłoszone w narzędziu – to może poprawić jakość uporządkowanych danych (ale nie jest to konieczne, aby witryna kwalifikowała się do wyników z elementami rozszerzonymi).
  4. Możesz wdrożyć kilka stron z uporządkowanymi danymi i dzięki narzędziu do sprawdzania adresów URL zobaczyć, jak Google je odczytuje. Upewnij się, że Twoja strona jest dostępna dla Google i nie jest blokowana przez plik robots.txt lub tag noindex ani nie wymaga logowania. Jeśli strona wygląda dobrze, możesz poprosić Google o ponowne zindeksowanie adresów URL.
  5. Aby na bieżąco informować Google o przyszłych zmianach, prześlij mapę witryny. Możesz zautomatyzować ten proces za pomocą interfejsu Search Console Sitemap API.

Przykłady

Oto kilka przykładowych przepisów zapisanych w postaci kodu JSON-LD.

Przepis w wyszukiwarce

Oto przykład strony, która może się wyświetlać w wyszukiwarce.

<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>

Oto przykład strony z podsumowaniem przepisów (strony z listą przepisów) zawierającej uporządkowane dane itemList. Te treści mogą kwalifikować się do wyświetlania w wynikach wyszukiwania w postaci siatki.

<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>

Wytyczne

Aby Twoje znaczniki kwalifikowały się do wyświetlania w wynikach wyszukiwania, musisz przestrzegać ogólnych wytycznych dotyczących uporządkowanych danych.

Uporządkowane dane Recipe muszą być zgodne z tymi wytycznymi.

  • Używaj uporządkowanych danych Recipe do treści związanych z przygotowywaniem konkretnej potrawy. Na przykład określenia typu „peeling do twarzy” czy „pomysły na przyjęcie” nie są prawidłowymi nazwami potraw.
  • Aby Twoje przepisy mogły się wyświetlać w karuzeli lub siatce, musisz przestrzegać tych wytycznych:
    • Użyj uporządkowanych danych ItemList, by zrobić zestawienie przepisów, które zostaną dodane do listy. Uporządkowane dane ItemList możesz podawać osobno lub razem ze znacznikami Recipe.
    • W swojej witrynie musisz mieć stronę podsumowania z listą wszystkich przepisów, jakie się w niej znajdują. Jeśli np. użytkownik kliknie link do podsumowania w wynikach wyszukiwania, otworzy mu się strona w Twojej witrynie z listą przepisów związanych z jego zapytaniem.

Definicje typów uporządkowanych danych

Aby treści mogły się wyświetlać w wynikach z elementami rozszerzonymi, musisz w nich stosować wymagane właściwości. Możesz też dodawać do nich właściwości zalecane, by wzbogacać informacje o treściach dla wygody użytkowników.

Recipe

Dodaj do swojego przepisu poniższe właściwości typu Recipe schema.org. Pełną definicję znaczników Recipe znajdziesz na schema.org/Recipe. Właściwości obsługiwane przez Google:

Właściwości wymagane
image

URL lub ImageObject

Zdjęcie gotowego dania.

Dodatkowe wytyczne dotyczące obrazów:

  • Adresy URL obrazów muszą być dostępne do pobrania i zindeksowania. Aby sprawdzić, czy Google może uzyskać dostęp do Twoich adresów URL, użyj narzędzia do sprawdzania adresów URL.
  • Obrazy muszą symbolizować treści objęte znacznikami.
  • Pliki graficzne muszą być w formacie obsługiwanym przez Grafikę Google.
  • Najlepsze efekty zapewni użycie wielu obrazów o wysokiej rozdzielczości (o iloczynie szerokości i wysokości wynoszącym co najmniej 50 tys. pikseli) i tych formatach obrazu: 16:9, 4:3 i 1:1.

Na przykład:

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

Text

Nazwa potrawy.

Właściwości zalecane
aggregateRating

AggregateRating

Adnotacja ze średnią oceną elementu. Przestrzegaj wytycznych dotyczących fragmentów opinii oraz zapoznaj się z listą wymaganych i zalecanych właściwości AggregateRating.

Jeśli uporządkowane dane Recipe zawierają pojedynczą opinię, imię i nazwisko jej autora musi być prawidłowym imieniem i nazwiskiem osoby lub prawidłową nazwą organizacji. Na przykład „50% zniżki na składniki” nie jest prawidłowym imieniem i nazwiskiem autora opinii.

author

Person lub Organization

Imię i nazwisko osoby lub nazwa organizacji będącej autorem przepisu. Aby pomóc Google w lepszym rozpoznawaniu autorów w różnych funkcjach, postępuj zgodnie ze sprawdzonymi metodami dodawania znaczników autora.

cookTime

Duration

Czas gotowania potrawy podany w formacie ISO 8601 (jeśli dotyczy).

Zawsze używaj ich w połączeniu z właściwością prepTime.

datePublished

Date

Data publikacji przepisu podana w formacie ISO 8601 (w odpowiednich przypadkach).

description

Text

Krótki opis potrawy.

keywords

Text

Dodatkowe określenia związane z przepisem, np. pora roku („lato”), święto („Boże Narodzenie”) lub inne jego cechy („szybki”, „łatwy”, „autentyczny”).

Dodatkowe wytyczne

  • Jeśli na liście słów kluczowych masz wiele pozycji, rozdziel je przecinkami.
  • Nie używaj tagów, które są w rzeczywistości właściwością recipeCategory lub recipeCuisine.

    Niezalecane:

    "keywords": "dessert, American"

    Zalecane:

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

Energy

Liczba kalorii w każdej porcji przygotowanej według tego przepisu. Jeśli podasz właściwość nutrition.calories, musisz określić liczbę porcji we właściwości recipeYield.

prepTime

Duration

Czas przygotowania składników i obszaru roboczego do przyrządzenia potrawy podany w formacie ISO 8601 (w stosownych przypadkach).

Zawsze używaj ich w połączeniu z właściwością cookTime.

recipeCategory

Text

Rodzaj posiłku lub dania, którego dotyczy przepis, np. „kolacja”, „danie główne” lub „deser, przekąska”.

recipeCuisine

Text

Region, z którym kojarzy się Twój przepis, np. „francuski”, „śródziemnomorski” czy „polski”.

recipeIngredient

Text

Składnik używany w przepisie.

Na przykład:

"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"
]

Dodatkowe wskazówki:

  • Podawaj tylko te składniki, które są niezbędne do przygotowania potrawy.
  • Nie podawaj zbędnych informacji, np. definicji składnika.
recipeInstructions

HowToStep, HowToSection lub Text

Czynności, które trzeba wykonać, by przyrządzić potrawę.

Wartość właściwości recipeInstructions można podać na kilka sposobów. Zalecamy użycie znacznika HowToStep. Jeśli przepis zawiera sekcje, można też użyć znacznika HowToSection, by pogrupować elementy HowToSteps.

  • HowToStep: właściwość HowToStep pozwala określić etapy wykonywania tego przepisu.
    "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 (właściwość używana tylko wtedy, gdy przepis składa się z wielu sekcji): służy do grupowania czynności w wiele sekcji. Przykład znajdziesz w sekcji HowToSection.
  • Pojedyncze lub powtórzone pole tekstowe właściwości: blok tekstu, który zawiera co najmniej jeden krok. Google traktuje wszystkie kroki jako należące do jednej sekcji. Powtórzone wartości właściwości są łączone w pojedynczy blok tekstu. Google próbuje potem automatycznie podzielić ten blok na poszczególne kroki. Stara się przy tym znajdować i usuwać wszystkie nazwy sekcji, numery kroków, słowa kluczowe i wszelkie inne elementy, które mogłyby niepotrzebnie wystąpić w treści kroku przepisu. Aby uzyskać najlepsze efekty, zalecamy jednoznaczne wskazywanie poszczególnych kroków za pomocą właściwości 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."
    ]

Dodatkowe wytyczne

  • Nie dodawaj metadanych, które nie pasują do przepisów kulinarnych. W szczególności używaj pola author, by wskazać autora, a pola recipeCuisine, by podać nazwę potrawy. Poza tym kategorię wpisz w polu recipeCategory, a inne słowa kluczowe – w polu keywords.
  • Podawaj tylko sposób przyrządzenia potrawy bez dodatkowego tekstu takiego jak „Wskazówki”, „Obejrzyj film” czy „Krok 1”. Takie wyrażenia należy dodawać poza uporządkowanymi danymi.

    Niezalecane:

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

    Zalecane:

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

Text lub Integer

Ilość potrawy, jaką można przygotować według przepisu (w odpowiednich przypadkach). Określ, ile porcji można przygotować według tego przepisu, podając tylko liczbę. Jeśli chcesz użyć innej jednostki (np. liczby elementów), możesz je dodać. Jest to wymagane, jeśli podasz informacje o wartościach odżywczych porcji (np. nutrition.calories).

Przykład

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

Duration

Łączny czas przygotowywania i gotowania potrawy podany w formacie ISO 8601 (w stosownych przypadkach).

Możesz używać właściwości totalTime lub kombinacji właściwości cookTimeprepTime.

video VideoObject

Film przedstawiający czynności, które trzeba wykonać, by przygotować potrawę. Zapoznaj się z listą wymaganych i zalecanych właściwości Video.

HowToSection

Za pomocą właściwości HowToSection pogrupuj sekwencję kroków (podsekcje), które stanowią część instrukcji w ramach przepisu. Określ właściwość HowToSection bezpośrednio w obrębie definicji właściwości recipeInstructions lub jako właściwość itemListElement innego elementu HowToSection.

Typ HowToSection określa sekcję pojedynczego przepisu i zawiera co najmniej jeden krok. Nie określaj różnych przepisów na tę samą potrawę za pomocą znacznika HowToSection. Typ HowToSection powinien być raczej częścią jednego przepisu. Aby wymienić wiele przepisów na określoną potrawę, użyj wielu obiektów Recipe, np. aby podać kilka sposobów na przygotowanie szarlotki, wymień je jako kilka obiektów Recipe, a nie obiektów HowToSection.

Pełną definicję znaczników HowToSection znajdziesz na schema.org/HowToSection.

Właściwości wymagane
itemListElement HowToStep

Lista szczegółowych kroków danej sekcji lub podsekcji. Na przykład przepis na pizzę może zawierać jedną sekcję ze wskazówkami, jak przygotować kruchą warstwę spodnią, inną sekcję z opisem wykonania warstwy wierzchniej oraz jeszcze jedną z opisem łączenia tych warstw i pieczenia.

Przykład:

{
  "@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

Nazwa sekcji.

HowToStep

Za pomocą polecenia HowToStep możesz pogrupować zdania, które wyjaśniają, jak wykonać część przepisu (jeśli ma to sens w przypadku Twoich treści). Podaj te zdania we właściwości text lub określ wartości HowToDirection albo HowToTip właściwości itemListElement w przypadku każdego zdania.

Oznacz kroki przepisu za pomocą poniższych właściwości typu HowToStep. Określ właściwość HowToStep w obrębie definicji właściwości recipeInstructions lub jako właściwość itemListElement elementu HowToSection.

Pełną definicję znaczników HowToStep znajdziesz na schema.org/HowToStep.

Właściwości wymagane
itemListElement HowToDirection lub HowToTip

Lista szczegółowych podetapów, w tym wskazówek.

Opcjonalne, jeśli używana jest właściwość text.

text Text

Pełna treść instrukcji zawartej w danym kroku.

Opcjonalne, jeśli używana jest właściwość itemListElement. Dodatkowe wskazówki:

  • Podawaj tylko treść instrukcji bez dodatkowego tekstu takiego jak „Wskazówki”, „Obejrzyj film” czy „Krok 1”. Takie wyrażenia należy dodawać poza treściami zawierającymi znaczniki.

    Niezalecane:

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

    Zalecane:

    {
      "@type": "HowToStep",
      "text": "Heat oven to 425°F."
    }
Właściwości zalecane
image ImageObject lub URL

Obraz ilustrujący dany krok. Dodatkowe wytyczne dotyczące obrazów:

name Text

Słowo lub krótkie wyrażenie podsumowujące krok (np. „Ułóż kruchą warstwę”. Nie używaj nieopisowego tekstu, np. „Krok 1: [tekst]”, ani innych form z numerem kroku, np. „1. [tekst]”.

url URL

Adres URL prowadzący bezpośrednio do kroku (jeśli jest dostępny), np. fragment linku kotwiczącego.

video VideoObject lub Clip

Film lub klip wideo przedstawiające dany krok.

W przypadku właściwości VideoObject postępuj zgodnie z listą wymaganych i zalecanych właściwości Video lub Clip.

HowToDirectionHowToTip

Użyj właściwości HowToDirection i HowToTip, aby opisać polecenia lub wskazówki (jeśli są dostępne). Mają te same właściwości wymagane i zalecane.

Pełne definicje danych HowToDirectionHowToTip znajdziesz na schema.org/HowToDirection oraz schema.org/HowToTip.

Właściwości wymagane
text Text

Treść wskazówki.

ItemList

Oprócz właściwości Recipe dodaj też poniższe właściwości związane z listami zależnymi od hosta. Chociaż znaczniki ItemList nie są wymagane, musisz dodać te właściwości, jeśli chcesz, by Twój przepis kwalifikował się do karuzeli hosta. Więcej informacji o karuzeli hosta znajdziesz w artykule Karuzela.

Pełną definicję znaczników ItemList znajdziesz na schema.org/ItemList.

Właściwości wymagane
itemListElement

ListItem

Adnotacja o pojedynczej stronie elementu.

ListItem.position

Integer

Pozycja porządkowa strony elementu na liście, np.:

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

URL

Kanoniczny URL strony elementu. Każdy element musi mieć niepowtarzalny 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 自动提取这些结果。

Rozwiązywanie problemów

Jeśli masz problem z zastosowaniem lub debugowaniem uporządkowanych danych, skorzystaj z tych rozwiązań: