JSON-LD Beispiel und Erklärung: Einfache Anleitung

Wenn Du eine Website optimierst, um besser bei Suchmaschinen zu ranken, wirst Du früher oder später über den Begriff JSON-LD stolpern. In diesem Blogpost erkläre ich Dir, was JSON-LD ist und wie Du es verwenden kannst, um strukturierte Daten für Deine Website zu erstellen.

Was ist JSON-LD?

JSON-LD steht für JavaScript Object Notation for Linked Data. Es ist ein Format, das verwendet wird, um strukturierte Daten auf Webseiten bereitzustellen. Die Idee dahinter ist, dass Du Maschinen (wie Suchmaschinen) mehr Informationen über den Inhalt Deiner Website geben kannst.

Mit JSON-LD können wir zum Beispiel Suchmaschinen mitteilen, dass eine Seite ein Artikel, ein Rezept, ein Produkt oder eine Veranstaltung ist. Diese Informationen helfen Suchmaschinen, Deine Inhalte genauer zu verstehen und sie entsprechend in den Suchergebnissen anzuzeigen.

Warum JSON-LD verwenden?

Einfach zu lesen und zu schreiben
Von Google bevorzugt
Erhöht die Chance auf Rich Snippets in den Suchergebnissen

Beispiel eines JSON-LD Code-Snippets

Um Dir zu zeigen, wie es in der Praxis funktioniert, gebe ich Dir ein einfaches JSON-LD-Beispiel. Nehmen wir an, Du hast einen Blogpost über ein Rezept. Hier ist, wie ein JSON-LD-Code-Snippet aussehen könnte:


<script type="application/ld+json">
{
  "@context": "https://schema.org/",
  "@type": "Recipe",
  "name": "Müsliriegel",
  "author": {
    "@type": "Person",
    "name": "Max Mustermann"
  },
  "datePublished": "2023-05-01",
  "description": "Ein einfacher und gesunder Müsliriegel.",
  "prepTime": "PT15M",
  "cookTime": "PT30M",
  "totalTime": "PT45M",
  "recipeYield": "10 Riegel",
  "recipeIngredient": [
    "Haferflocken",
    "Honig",
    "Nüsse",
    "Trockenfrüchte"
  ],
  "recipeInstructions": [
    "Mische alle trockenen Zutaten.",
    "Füge den Honig hinzu und vermische alles gut.",
    "Backe die Mischung für 30 Minuten bei 180 Grad."
  ]
}
</script>

Wo soll der JSON-LD Code eingefügt werden?

Der JSON-LD-Code sollte im <head> oder am Ende des <body>-Tags Deiner HTML-Seite eingefügt werden. Hier ist ein Beispiel, wie Du das machen könntest:


<html>
  <head>
    <script type="application/ld+json">
    {
      "@context": "https://schema.org/",
      "@type": "Recipe",
      "name": "Müsliriegel",
      "author": {
        "@type": "Person",
        "name": "Max Mustermann"
      },
      "datePublished": "2023-05-01",
      "description": "Ein einfacher und gesunder Müsliriegel.",
      "prepTime": "PT15M",
      "cookTime": "PT30M",
      "totalTime": "PT45M",
      "recipeYield": "10 Riegel",
      "recipeIngredient": [
        "Haferflocken",
        "Honig",
        "Nüsse",
        "Trockenfrüchte"
      ],
      "recipeInstructions": [
        "Mische alle trockenen Zutaten.",
        "Füge den Honig hinzu und vermische alles gut.",
        "Backe die Mischung für 30 Minuten bei 180 Grad."
      ]
    }
    </script>
  </head>
  <body>
    
  </body>
</html>

Wie validiere ich meinen JSON-LD Code?

Bevor Du Deinen JSON-LD-Code live schaltest, solltest Du ihn validieren, um sicherzustellen, dass er korrekt ist. Google bietet dafür das Rich Results Test Tool an. Hier ist der Link: Rich Results Test Tool.

Häufige Fehler vermeiden

Wenn Du mit JSON-LD arbeitest, gibt es einige häufige Fehler, die Du vermeiden solltest:

Sicherstellen, dass alle Eigenschaften in der korrekten Form vorliegen. Beispielsweise sollte ein Datum im Format “YYYY-MM-DD” und eine Zeit im Format “PT#H#M#S” vorliegen.
Verwende korrekte URLs, vor allem für “@context” und “@type”.
Verwende nur die von Schema.org definierten Typen und Eigenschaften.
Überprüfe den JSON-Code auf syntaktische Fehler. Ein fehlendes Komma oder eine fehlende Klammer können die gesamte Struktur ungültig machen.

Zusammenfassung

Mit JSON-LD kannst Du strukturierten Daten einfach und effizient auf Deiner Website einbinden. Im Vergleich zu anderen Formaten wie Microdata und RDFa hat JSON-LD den Vorteil der Einfachheit und Klarheit. Außerdem wird es von Suchmaschinen wie Google bevorzugt. Falls Du Dir noch unsicher bist, wie Du JSON-LD implementieren kannst, beginne doch einfach mit kleinen Schritten und verwende Tools wie das Rich Results Test Tool, um Deinen Code zu validieren.

#	Produkt	Bewertung	Preis
1	Samsung X210N Galaxy Tab A9+ graphit 11 Zoll WiFi 64GB Android Tablet 4 GB RAM	Aktuell keine Bewertungen	175,41 EUR	Bei Amazon ansehen
2	Lenovo Tab M10 (3. Gen) Tablet \| 10,1″ WUXGA Touch Display \| Unisoc T610 \| 4GB RAM \| 64GB Speicher \|…	Aktuell keine Bewertungen	109,00 EUR	Bei Amazon ansehen
3	Samsung Galaxy Tab A9 Wi-Fi Android-Tablet, 64 GB Speicherplatz, Großes Display, Satter Sound,…	Aktuell keine Bewertungen	125,00 EUR	Bei Amazon ansehen
4	Samsung Galaxy Tab A9 128 Go 27,9 cm (11 Zoll) 8 Go Wi-Fi 5 (802.11ac) Graphit	Aktuell keine Bewertungen	214,94 EUR	Bei Amazon ansehen