Twitter-Card-Generator
Wählen Sie einen Card-Typ, geben Sie Titel, Beschreibung und Bild ein, sehen Sie die Card so, wie sie in einem Beitrag auf X erscheint, und kopieren Sie die twitter:-Meta-Tags für den Head Ihrer Seite.
- 4 Card-Typen
- Vorschau hell und dunkel
- Bildgrößen-Prüfung
- Läuft in Ihrem Browser
Card
Das @ wird für Sie ergänzt.
Optional – die Person, die die Seite geschrieben hat.
Eine Vorschau auf einer Website kann keine Bilder von anderen Websites laden – wählen Sie die Datei deshalb von Ihrem Gerät. Sie wird nur hier angezeigt und vermessen und verlässt Ihr Gerät nie.
Wird von Screenreadern vorgelesen. Bis zu 420 Zeichen.
Wird für die Domainzeile der Vorschau und für og:url verwendet. X hat dafür kein eigenes Tag.
Player
Eine https://-Seite, die nur den Player enthält und in einem iframe funktioniert.
Optional: direkte Adresse der Video- oder Audiodatei (MP4 oder AAC).
App
Zweistelliger Code wie US oder DE – nur nötig, wenn die App nicht im US-Store ist.
Vorschau
Die Vorschau folgt dem aktuellen Layout von X: Große Cards zeigen den Titel auf dem Bild und die Domain darunter, die Beschreibung wird nicht angezeigt. X speichert eine Card nach dem ersten Post etwa eine Woche im Cache.
Checkliste
HTML-Code
X liest og:title, og:description und og:image, wenn twitter:title, twitter:description und twitter:image fehlen. Ist die Option aktiv, werden diese drei nur einmal als Open-Graph-Tags geschrieben, die auch Facebook, LinkedIn und WhatsApp verwenden. Für twitter:card gibt es keinen Fallback, es bleibt immer erhalten.
Aus vorhandenem HTML importieren
Der eingefügte Code wird nur als Text in Ihrem Browser gelesen. Skripte darin werden nie ausgeführt, nichts wird daraus geladen und nichts wird irgendwohin gesendet. Der Import ersetzt den aktuellen Inhalt des Formulars.
So erstellen Sie eine X-(Twitter-)Card
Code und Vorschau aktualisieren sich beim Tippen.
- 1
Card-Typ wählen
Large Image für Artikel und Landingpages, Summary für ein kleines quadratisches Bild, Player für Video oder Audio, App für eine mobile App.
- 2
Card ausfüllen
Geben Sie das X-Konto der Website, Titel, Beschreibung, Bild-URL und Alt-Text ein. Wählen Sie die Bilddatei von Ihrem Gerät, um sie anzuzeigen und zu vermessen.
- 3
Prüfen und kopieren
Beheben Sie, was die Checkliste markiert, und fügen Sie den Code dann in den <code><head></code> Ihrer Seite ein.
Card-Tags, die X tatsächlich liest
Alle vier Card-Typen mit eigenen Feldern und Prüfungen.
Vorschau in beiden Designs
Zeigt die Card im hellen und dunklen Modus. Große Cards folgen dem aktuellen Layout von X: Der Titel liegt auf dem Bild, die Domain steht darunter.
Bildprüfung je Card-Typ
Vermisst das Bild, das Sie von Ihrem Gerät wählen, und warnt, wenn es zu klein, größer als 4096 × 4096 px oder schwerer als 5 MB ist oder beschnitten wird.
Player-Card
Felder für die Player-Seite, ihre Breite und Höhe sowie eine optionale Stream-Adresse – mit der Prüfung, dass jede Adresse https verwendet.
App-Card
App-Name, ID und Deep Link für iPhone, iPad und Google Play, dazu das Land des Stores. Die IDs werden auf das richtige Format geprüft.
Open-Graph-Fallback
Ein Schalter schreibt Titel, Beschreibung und Bild als Open-Graph-Tags, die X ebenfalls liest – kürzerer Code, der auch andere Netzwerke bedient.
Vorhandenes HTML importieren
Fügen Sie den Quelltext einer Seite ein, um deren aktuelle Card-Tags ins Formular zu laden. Der eingefügte Code wird nur als Text gelesen.
Privat
Alles läuft in Ihrem Browser. Was Sie eingeben, einfügen oder öffnen, wird nicht an einen Server gesendet.
Kostenlos, ohne Anmeldung
Kein Konto, keine Limits, kein Wasserzeichen – auf Smartphone, Tablet und Computer.
So funktionieren X-(Twitter-)Cards
Eine Card ist die Vorschau, die X an einen Beitrag mit Link anhängt. X ruft die Seite ab und liest die twitter:-Meta-Tags in ihrem Head. Das entscheidende Tag ist twitter:card; es wählt einen von vier Typen: summary, summary_large_image, player oder app. Die Tags tragen noch den alten Namen des Netzwerks; am Markup hat sich nichts geändert, als aus Twitter X wurde – bestehende Seiten müssen also nicht angepasst werden.
X greift auf Open Graph zurück. Fehlen twitter:title, twitter:description oder twitter:image, verwendet es stattdessen og:title, og:description und og:image. Eine Seite, die bereits Open-Graph-Tags hat, braucht daher nur twitter:card, für das es keinen Fallback gibt, und idealerweise twitter:site mit dem Konto der Website. Beachten Sie: Card-Tags verwenden das Attribut name, Open-Graph-Tags dagegen property. Dieses Tool kann beide Formen schreiben: alle twitter:-Tags oder den kürzeren Open-Graph-Fallback.
Häufige Fehler: eine Bildadresse, die relativ ist oder http verwendet; ein SVG-Bild, das Cards nicht anzeigen; ein breites Bild in einer Summary-Card, das quadratisch beschnitten wird; ein Titel mit mehr als 70 Zeichen, der abgeschnitten wird; und ein fehlender Alt-Text für das Bild. Player-Cards brauchen eine https-Seite, die in einem iframe funktioniert, und müssen von X freigegeben werden, bevor sie erscheinen. Außerdem speichert X eine Card etwa eine Woche lang zwischen – Änderungen sind also nicht sofort sichtbar.
Die vier Card-Typen
| Card-Typ | Was er zeigt | Bild |
|---|---|---|
| <code>summary_large_image</code> | Ein breites Bild mit dem Titel darauf – für Artikel und Landingpages | Etwa 2:1, empfohlen 1200 × 628 px, mindestens 300 × 157 px |
| <code>summary</code> | Ein kleines quadratisches Bild neben Titel und Beschreibung | Quadratisch, mindestens 144 × 144 px |
| <code>player</code> | Video oder Audio, das direkt im Beitrag abgespielt wird | Ein Vorschaubild sowie Breite und Höhe des Players |
| <code>app</code> | Eine mobile App mit Name, Beschreibung und Store-Link | Wird aus dem App-Store übernommen |
Tipps
- Den vollständigen Satz an Tags für Facebook, LinkedIn und Messenger-Apps erstellen Sie mit dem Open-Graph-Generator.
- Erstellen Sie ein Card-Bild mit 1200 × 628 px im OG-Bild-Generator oder schneiden Sie ein vorhandenes mit dem Tool Social-Media-Bildgrößen zu.
- Kennzeichnen Sie die Links, die Sie posten, damit die Besuche in Ihrer Webanalyse auftauchen – der UTM-Builder baut die Kampagnen-URL.
- Um die echte Card zu sehen, fügen Sie den Link in das Beitragsfeld auf X ein. Erscheint eine alte Card, liegt sie noch von einem früheren Beitrag im Cache.
Häufig gestellte Fragen
Keine Antwort gefunden? Schreiben Sie uns – wir antworten schnell.
Wie groß sollte das Bild einer Twitter-Card sein?
Für die Large-Image-Card etwa 2:1, ideal sind 1200 × 628 Pixel, mindestens 300 × 157. Die Summary-Card zeigt ein Quadrat von mindestens 144 × 144 Pixeln. Die Dateien müssen kleiner als 5 MB sein und im Format JPG, PNG, WebP oder GIF vorliegen.
Brauche ich Twitter-Card-Tags, wenn ich schon Open-Graph-Tags habe?
Nur eines: twitter:card, um den Card-Typ zu wählen. X übernimmt Titel, Beschreibung und Bild aus den Open-Graph-Tags, wenn die eigenen Tags fehlen. Empfehlenswert ist zusätzlich twitter:site mit Ihrem Konto.
Heißen Twitter-Cards auf X noch Twitter-Cards?
Das Netzwerk heißt X, aber die Meta-Tags behalten das Präfix twitter:. Ein neues Präfix x: gibt es nicht, und bestehende Tags funktionieren weiterhin.
Warum wird meine Card auf X nicht angezeigt?
Prüfen Sie, ob twitter:card vorhanden ist, ob die Bildadresse eine vollständige https://-URL ist, die der X-Crawler erreichen kann, und ob die robots.txt ihn nicht aussperrt. Eine früher gepostete Card bleibt etwa eine Woche im Cache.
Was ist der Unterschied zwischen summary und summary_large_image?
Die Summary-Card zeigt ein kleines quadratisches Bild neben Titel und Beschreibung. Die Large-Image-Card zeigt ein breites Bild über den ganzen Beitrag, mit dem Titel darauf und der Domain darunter; die Beschreibung wird nicht angezeigt.
Werden meine Daten an einen Server gesendet?
Nein. Das Tool läuft vollständig in Ihrem Browser. Ihre Eingaben werden nicht hochgeladen, protokolliert oder auf unseren Servern gespeichert.
Weitere kostenlose SEO- und Website-Tools
Tags und Dateien erzeugen, Statuscodes, Weiterleitungen, DNS und Zertifikate prüfen – kostenlos und ohne Konto.