CommunityCodierung & Entwicklunggithub.com

blog-schema

Erzeugt vollständige, validierte JSON-LD-Strukturdatenskripte für Blogbeiträge mithilfe des @graph-Musters.

Was ist blog-schema?

Diese Fähigkeit generiert automatisch umfassende, validierte JSON-LD-Strukturdatenskripte für Blogbeiträge, die auf dem @graph-Muster basieren. Sie unterstützt die Schematypen BlogPosting, Person, Organization, BreadcrumbList, FAQPage, ImageObject und VideoObject. Dadurch wird eine semantisch reichhaltige Informationsstruktur geschaffen, die sowohl die Suchmaschinenoptimierung (SEO) für Google als auch die Extraktion durch KI-Systeme (z. B. ChatGPT, Perplexity, Gemini) verbessert. Die Fähigkeit durchläuft einen mehrstufigen Workflow: Sie liest zunächst den Blogbeitrag und extrahiert alle relevanten Schema-Daten wie Titel, Autor, Daten, Beschreibung, FAQ-Bereich, Bilder, Organisationsinformationen und Wortanzahl. Anschließend generiert sie für jede Entität ein separates Schema mit stabilen @id-Referenzen, validiert die Ausgabe anhand aktueller Deprecation-Hinweise (z. B. wie HowTo, SpecialAnnouncement) und gibt das Ergebnis als ein einziges `<script>`-Tag im @graph-Format aus. Die Ausgabe kann als eingebettetes HTML, eigenständiges JSON oder MDX-Komponente geliefert werden.

Funktioniert mit~Claude Code~Codex CLI~Cursor✓Gemini CLI
npx skills add https://github.com/AgriciDaniel/claude-blog/tree/main/skills/blog-schema

Installed? Explore more Codierung & Entwicklung skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

In Ihrer bevorzugten KI fragen

Öffnet einen neuen Chat, in dem dieser Agent-Skill bereits geladen ist.

Dokumentation

Blog Schema – JSON-LD Strukturdatengenerierung

Generiert vollständige, validierte JSON-LD-Strukturdatenskripte für Blogbeiträge mithilfe des @graph-Musters. Kombiniert mehrere Schematypen in einem einzigen script-Tag mit stabilen @id-Referenzen für die Entitätsverknüpfung.

Workflow

Schritt 1: Inhalt lesen

Lese den Blogbeitrag und extrahiere alle schema-relevanten Daten:

  • Titel (headline)
  • Autor (Name, Berufsbezeichnung, soziale Links, Qualifikationen)
  • Daten (datePublished, dateModified / lastUpdated)
  • Beschreibung (Meta-Beschreibung)
  • FAQ-Bereich (Fragen- und Antwortpaare)
  • Bilder (Coverbild-URL, Abmessungen, Alt-Text; Inline-Bilder)
  • Organisationsinformationen (Seitenname, URL, Logo)
  • Wortanzahl (ungefähr aus der Textlänge)
  • Tags/Kategorien (für BreadcrumbList-Kategorie)
  • Slug (aus Dateiname oder Frontmatter)

Schritt 2: BlogPosting-Schema generieren

Vollständiges BlogPosting mit allen erforderlichen und empfohlenen Eigenschaften:

{
  "@type": "BlogPosting",
  "@id": "{siteUrl}/blog/{slug}#article",
  "headline": "Posttitel (maximal 110 Zeichen)",
  "description": "Meta-Beschreibung (150-160 Zeichen)",
  "datePublished": "YYYY-MM-DD",
  "dateModified": "YYYY-MM-DD",
  "author": { "@id": "{siteUrl}/author/{author-slug}#person" },
  "publisher": { "@id": "{siteUrl}#organization" },
  "image": { "@id": "{siteUrl}/blog/{slug}#primaryimage" },
  "mainEntityOfPage": {
    "@type": "WebPage",
    "@id": "{siteUrl}/blog/{slug}"
  },
  "wordCount": 2400,
  "articleBody": "Die ersten 200 Zeichen des Inhalts als Auszug..."
}

Erforderliche Eigenschaften: @type, headline, datePublished, author, publisher, image. Empfohlene Eigenschaften: description, dateModified, mainEntityOfPage, wordCount, articleBody (Auszug).

Schritt 3: Person-Schema generieren

Autorenschema mit stabiler @id für Querverweise:

{
  "@type": "Person",
  "@id": "{siteUrl}/author/{author-slug}#person",
  "name": "Autorenname",
  "jobTitle": "Rolle oder Titel",
  "url": "{siteUrl}/author/{author-slug}",
  "sameAs": [
    "https://twitter.com/handle",
    "https://linkedin.com/in/handle",
    "https://github.com/handle"
  ]
}

Optionale Eigenschaften (einbeziehen, wenn verfügbar):

  • alumniOf – Bildungseinrichtung (Typ Organization)
  • worksFor – Arbeitgeber (Verweis auf Organization @id, wenn gleiche Entität)

Schritt 4: Organization-Schema generieren

Entität der übergeordneten Organisation des Blogs:

{
  "@type": "Organization",
  "@id": "{siteUrl}#organization",
  "name": "Organisationsname",
  "url": "{siteUrl}",
  "logo": {
    "@type": "ImageObject",
    "url": "{siteUrl}/logo.png",
    "width": 600,
    "height": 60
  },
  "sameAs": [
    "https://twitter.com/org",
    "https://linkedin.com/company/org",
    "https://github.com/org"
  ]
}

Logo-Anforderungen: muss eine gültige Bild-URL sein. Google empfiehlt Logos mit mindestens 112x112px, maximal 600px breit. Rechteckige Logos werden für BlogPosting-Verlage bevorzugt.

Schritt 5: BreadcrumbList generieren

Navigations-Breadcrumb-Schema, das die Inhaltshierarchie zeigt:

{
  "@type": "BreadcrumbList",
  "@id": "{siteUrl}/blog/{slug}#breadcrumb",
  "itemListElement": [
    {
      "@type": "ListItem",
      "position": 1,
      "name": "Startseite",
      "item": "{siteUrl}"
    },
    {
      "@type": "ListItem",
      "position": 2,
      "name": "Kategoriename",
      "item": "{siteUrl}/blog/category/{category-slug}"
    },
    {
      "@type": "ListItem",
      "position": 3,
      "name": "Beitragstitel",
      "item": "{siteUrl}/blog/{slug}"
    }
  ]
}

Wenn keine Kategorie verfügbar ist, verwende "Blog" als zweiten Breadcrumb-Eintrag mit {siteUrl}/blog als URL.

Schritt 6: FAQPage-Schema generieren

Extrahiere Fragen-und-Antwort-Paare aus dem FAQ-Bereich des Blogbeitrags:

{
  "@type": "FAQPage",
  "@id": "{siteUrl}/blog/{slug}#faq",
  "mainEntity": [
    {
      "@type": "Question",
      "name": "Wie lautet die Frage?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Der vollständige Antworttext (40-60 Wörter mit Statistik)."
      }
    }
  ]
}

Wichtiger Hinweis: Google hat die FAQ-Rich-Results seit August 2023 auf Regierungs- und Gesundheitsseiten eingeschränkt. Trotzdem bietet das FAQ-Schema-Markup weiterhin Wert, weil:

  • KI-Systeme (ChatGPT, Perplexity, Gemini) FAQ-Daten für Zitate extrahieren
  • Es Inhalte für zukünftige Rich-Result-Berechtigungsänderungen strukturiert
  • Es die Signale für die Inhaltsorganisation verbessert

Schritt 7: VideoObject generieren (falls Videos vorhanden)

Für jedes im Beitrag eingebettete YouTube-Video ein VideoObject-Schema generieren:

{
  "@type": "VideoObject",
  "@id": "{siteUrl}/blog/{slug}#video-{index}",
  "name": "Videotitel",
  "description": "Videobeschreibungsauszug (erste 200 Zeichen)",
  "thumbnailUrl": "https://img.youtube.com/vi/{videoId}/hqdefault.jpg",
  "uploadDate": "{ISO 8601-Datum}",
  "contentUrl": "https://www.youtube.com/watch?v={videoId}",
  "embedUrl": "https://www.youtube.com/embed/{videoId}",
  "duration": "PT{M}M{S}S",
  "interactionStatistic": {
    "@type": "InteractionCounter",
    "interactionType": { "@type": "WatchAction" },
    "userInteractionCount": {viewCount}
  }
}

Füge jedes VideoObject zum @graph-Array hinzu. Verwende #video-1, #video-2 usw. für den @id-Fragment. Extrahiere die Video-Metadaten aus dem no-script-Fallback des Embeds oder aus der YouTube Data API, falls über blog-google verfügbar.

Schritt 7.5: ImageObject generieren

Coverbildschema für das Hauptbild des Beitrags:

{
  "@type": "ImageObject",
  "@id": "{siteUrl}/blog/{slug}#primaryimage",
  "url": "https://cdn.pixabay.com/photo/.../image.jpg",
  "width": 1200,
  "height": 630,
  "caption": "Beschreibende Bildunterschrift passend zum Alt-Text"
}

Bildanforderungen:

  • Die URL muss crawlbar und öffentlich zugänglich sein
  • Breite und Höhe sollten den tatsächlichen Bildabmessungen entsprechen
  • Die Bildunterschrift sollte mit dem Alt-Text des Bildes übereinstimmen oder ihm sehr nahe kommen
  • Bevorzugte Abmessungen: 1200x630 (OG-kompatibel) oder 1920x1080

Schritt 8: Validieren & Warnen

Überprüfe auf veraltete Schematypen und wende Validierungsregeln an:

Diese veralteten Typen NIE verwenden:

  • HowTo – Veraltet seit September 2023 (Google zeigt keine Rich Results mehr an)
  • SpecialAnnouncement – Veraltet seit Juli 2025
  • PracticeProblem – Veraltet (Bildungsmarkup)
  • Dataset – Veraltet für die allgemeine Verwendung
  • SitelinksSearchBox – Veraltet
  • Q&A – Veraltet seit Januar 2026 (unterscheidet sich von FAQPage)

Validierungsprüfungen:

  1. Alle @id-Referenzen lösen auf Entitäten innerhalb des @graph auf
  2. dateModified ist gleich oder nach datePublished
  3. headline überschreitet nicht 110 Zeichen
  4. description liegt zwischen 50-160 Zeichen
  5. Alle URLs sind absolut (nicht relativ)
  6. Bildabmessungen sind positive ganze Zahlen
  7. BreadcrumbList-Positionen sind sequentiell und beginnen bei 1
  8. FAQPage hat mindestens 2 Fragen

Hinweis zur Optimierung von KI-Zitaten: Seiten, die 3 oder mehr Schematypen verwenden, haben eine etwa 13% höhere Wahrscheinlichkeit, von KI zitiert zu werden. Diese Fähigkeit generiert bis zu 7 Typen (BlogPosting, Person, Organization, BreadcrumbList, FAQPage, ImageObject, VideoObject), um sowohl das Verständnis durch Suchmaschinen als auch die Extraktion durch KI zu maximieren.

Schritt 9: Ausgabe

Kombiniere alle Schemas in einem einzigen <script>-Tag unter Verwendung des @graph-Musters:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@graph": [
    { "@type": "BlogPosting", ... },
    { "@type": "Person", ... },
    { "@type": "Organization", ... },
    { "@type": "BreadcrumbList", ... },
    { "@type": "FAQPage", ... },
    { "@type": "VideoObject", ... },
    { "@type": "ImageObject", ... }
  ]
}
</script>

Vorteile des @graph-Musters:

  • Ein einziger Script-Tag anstelle von mehreren – saubereres HTML
  • Entitätsverknüpfung über stabile @id-Referenzen (z. B. verweist der Autor auf Person per @id)
  • Google und KI-Systeme parsen @graph-Arrays korrekt
  • Einfacher zu warten und als einzelner Block zu aktualisieren

Ausgabeoptionen:

  • Eingebettetes HTML – Bereit zum Einfügen in <head> oder vor </body>
  • Eigenständiges JSON – Für CMS-Schemafelder oder API-Injektion
  • MDX-Komponente – Wenn das Projekt MDX verwendet, in eine Komponente packen

Speichere das generierte Schema je nach Präferenz des Benutzers in der Blogbeitragsdatei oder in einer separaten Schema-Datei.

Individual skills in this repo

This repo contains 20 individual skills — each has its own dedicated page.

Verwandte Skills