Wichtige Fakten
- Kategorie
- Entwicklung & Web
- Eingabetypen
- text, textarea, select
- Ausgabetyp
- html
- Sample-Abdeckung
- 4
- API verfügbar
- Yes
Überblick
Das SERP & Social Vorschau-Studio ermöglicht es Ihnen, die Darstellung Ihrer Webseite in den Google-Suchergebnissen sowie auf Social-Media-Plattformen wie X (Twitter), Facebook und LinkedIn vorab zu simulieren. Durch die pixelgenaue Berechnung der Titel-Abschneidung für Desktop und Mobilgeräte sowie eine integrierte SEO-Diagnose optimieren Sie Ihre Metadaten fehlerfrei vor dem Live-Gang.
Wann verwenden
- •Vor dem Veröffentlichen neuer Blogbeiträge oder Landingpages, um die Darstellung in Suchmaschinen und sozialen Netzwerken zu prüfen.
- •Bei der Optimierung bestehender Meta-Tags, um sicherzustellen, dass Titel und Beschreibungen auf Mobil- und Desktop-Geräten nicht abgeschnitten werden.
- •Zur Qualitätskontrolle von OpenGraph-Bildern und Twitter-Cards, um eine fehlerfreie Darstellung beim Teilen von Links zu garantieren.
So funktioniert es
- •Tragen Sie den Seitentitel, die Meta-Beschreibung und die Canonical-URL in die entsprechenden Eingabefelder ein.
- •Fügen Sie optional die OpenGraph-Bild-URL hinzu und wählen Sie das gewünschte Vorschau-Gerät sowie den Twitter-Kartentyp aus.
- •Das Tool berechnet die exakte Pixelbreite des Titels in Arial und rendert sofort die Google-SERP-, X- und OpenGraph-Vorschau.
- •Überprüfen Sie die automatische Pre-Launch-SEO-Diagnose auf Warnungen wie zu lange Texte, ungültige URLs oder fehlende Social-Media-Tags.
Anwendungsfälle
Überprüfung der mobilen und Desktop-Darstellung von Google-Suchergebnissen vor dem Content-Launch.
Validierung von OpenGraph-Bild-URLs auf HTTPS-Konformität und das korrekte Seitenverhältnis von 1.91:1.
Erkennung von Formatierungsfehlern wie Unterstrichen in URLs oder unescapten Sonderzeichen in Meta-Beschreibungen.
Beispiele
1. Optimierung eines Blogbeitrags für Google und Social Media
SEO-Manager- Hintergrund
- Ein neuer Testbericht über Laufschuhe soll veröffentlicht werden. Der Titel und das Teaser-Bild müssen in den SERPs und auf LinkedIn perfekt aussehen.
- Problem
- Der Titel könnte auf Mobilgeräten abgeschnitten werden und das Social-Media-Bild hat eventuell das falsche Format.
- Verwendung
- Tragen Sie den Titel 'Best Running Shoes 2026 — Tested & Reviewed | RunLab' und die Bild-URL ein. Wählen Sie 'both' für die Geräte-Vorschau.
- Beispielkonfiguration
-
{ "title": "Best Running Shoes 2026 — Tested & Reviewed | RunLab", "description": "We tested 40 running shoes for comfort, durability, and speed. See our top picks for road, trail, and racing in 2026.", "url": "https://runlab.example.com/best-running-shoes-2026", "ogImage": "https://runlab.example.com/og/shoes-1200x630.jpg", "ogDescription": "The 2026 running shoe guide, lab-tested for every type of runner.", "siteName": "RunLab", "twitterCard": "summary_large_image", "device": "both" } - Ergebnis
- Die Vorschau zeigt, dass der Titel auf Desktop und Mobilgeräten vollständig sichtbar bleibt. Die Diagnose bestätigt die HTTPS-Verschlüsselung des Bildes und das korrekte 1.91:1-Format.
2. Fehlerdiagnose bei einer Produktseite
Webentwickler- Hintergrund
- Eine neue E-Commerce-Produktseite soll online gehen. Es muss sichergestellt werden, dass keine technischen SEO-Fehler in den Meta-Tags vorliegen.
- Problem
- Unbekannte Fehler in der URL-Struktur und fehlende Twitter-Card-Tags könnten das Teilen der Seite beeinträchtigen.
- Verwendung
- Geben Sie die Produkt-Metadaten und eine URL mit Unterstrichen ein, um die Diagnose-Tabelle zu prüfen.
- Beispielkonfiguration
-
{ "title": "Premium Leder-Rucksack 'Urban' - Wasserdicht", "description": "Kaufen Sie unseren neuen Leder-Rucksack online.", "url": "https://shop.example.com/produkte/leder_rucksack_urban", "device": "desktop" } - Ergebnis
- Die Diagnose warnt vor der Verwendung von Unterstrichen in der URL und weist auf die fehlende Twitter-Card sowie eine zu kurze Meta-Beschreibung hin.
Mit Samples testen
imageBeispiele für Beiträge in sozialen Medien
Textproben aus sozialen Medien zum Testen der Hashtag- und Erwähnungsextraktion
title token social
ActivityPub Dezentralesiertes Sozial-Netzwerk-Protokoll
ActivityPub-Protokollbeispiele für föderierte soziale Netzwerke, Mastodon-Kompatibilität und dezentralisierte soziale Medien
title token social
Docker-Image-Tag Beispiele
Sammlung von Docker-Image-Referenzen mit verschiedenen Registries, Repositories, Tags und Digests
matched family image
QR-Code-Beispiele
Beispiel-QR-Code-Bilder zum Testen von QR-Code-Lese- und Generierungswerkzeugen
matched family image
Verwandte Hubs
Tools fur Bildformat-Konvertierung und animierten Export
Vergleiche Bildkonverter fur JPG, PNG, GIF, AVIF, WebP, TIFF, ICO, base64 und animationsgeeignete Exporte in einem Hub.
Werkzeuge fur Bildbereinigung, Rahmen und Batch-Vorbereitung
Bunde Bildbereinigung, Beschneiden, Padding, Rahmen, Batch-Resize/Kompression, Wasserzeichen und visuelle Veredelung in einem Hub fur Asset-Vorbereitung.
Bildmetadaten-, EXIF- und Datenschutz-Bereinigungs-Tools
Vergleichen Sie Bildmetadaten-Viewer, EXIF/IPTC/XMP-Inspektoren, Ausrichtungsfixes, Metadaten-Editoren und Datenschutz-Bereinigungstools für Foto-Publishing-Workflows.
FAQ
Wie berechnet das Tool die Abschneidung des Google-Titels?
Die Abschneidung basiert auf der tatsächlichen Pixelbreite der Zeichen in der Schriftart Arial (ca. 600px für Desktop und 920px für Mobilgeräte), nicht auf der bloßen Zeichenanzahl.
Welche Social-Media-Plattformen werden simuliert?
Das Tool simuliert X-Karten (Summary und Summary Large Image) sowie OpenGraph-Karten für Plattformen wie Facebook und LinkedIn.
Was prüft die integrierte SEO-Diagnose?
Sie prüft Titellängen, Geräte-Abschneidungen, HTTPS-Gültigkeit der Bild-URL, Canonical-URLs, Sonderzeichen und gibt Hinweise auf strukturierte Daten.
Warum ist die Angabe einer Canonical-URL wichtig?
Die Canonical-URL teilt Suchmaschinen die bevorzugte Version einer Seite mit. Das Tool validiert das Format und prüft auf typische Fehler wie Unterstriche.
Kann ich das Tool auch ohne OpenGraph-Bild nutzen?
Ja, Sie können Felder leer lassen. Die Diagnose weist Sie dann gegebenenfalls auf das Fehlen hin, damit Sie die Lücken vor dem Launch schließen können.