Twitter-Card-Generator
Ein Tag oder der ganze Block
Dieser Twitter-Card-Generator schreibt ein Tag oder den ganzen Block und macht aus einem geposteten Link eine Karte mit Bild. Er schreibt das Minimum, weil Twitter Ihre Open-Graph-Tags bereits liest, oder das volle Paar für eine Seite, die keines von beiden hat.
- KostenlosPreis
- 4Kartentypen
- KeineAnmeldung
- KeineUploads
Twitter-Card-Generator
Die twitter:-Tags, und nur die, die Sie brauchen
Bereit. Wählen Sie einen Kartentyp und tragen Sie den Titel ein.
Was eine Karte ist und welche Tags sie bauen
Posten Sie einen Link, und die Timeline zeigt eine Karte: ein Bild, eine Überschrift, eine Zeile Beschreibung und Ihre Domain. Weil Karten weit mehr Platz einnehmen als ein nackter Link, bekommen sie auch weit mehr Aufmerksamkeit.
Die Tags dahinter sehen aus wie gewöhnliche Meta-Tags mit dem Präfix twitter:. Nur eines hat nirgendwo sonst eine Entsprechung, während der Rest schlicht Open Graph dupliziert.
Dieses eine ist twitter:card. Es sagt, welche Form Sie wollen, und ohne es fällt die Plattform auf ihre kleinste Option zurück.
Alles andere ist optional. Der ehrliche Rat lautet also: Schreiben Sie die Open-Graph-Tags einmal und ergänzen Sie danach eine einzige twitter:-Zeile daneben.
Die vier Kartentypen
Summary mit großem Bild ist die Karte, die alle meinen. Sie zeigt ein breites Bild über der Überschrift und nimmt außerdem den meisten Platz im Feed ein.
Die einfache Summary setzt ein kleines quadratisches Vorschaubild neben den Text. Deshalb passt sie zu einer Seite, deren Bild ein Logo und kein Foto ist.
App- und Player-Karten sind in jeder Hinsicht enger. App bewirbt einen Store-Eintrag, während Player Video oder Audio einbettet, was die Plattform von Hand freigibt.
Name, nicht property
Twitter-Card-Tags nutzen das Attribut name. Open Graph nutzt hingegen property, weil es aus RDFa hervorging. Kopieren Sie ein Tag aus dem falschen Beispiel, ignoriert die Plattform es.
Die Referenz zum meta-Element erklärt, warum es beide Schreibweisen gibt. Dieser Generator schreibt jede Familie mit ihrem eigenen Attribut, sodass der Unterschied für Sie unsichtbar bleibt.
Was die Handles bewirken
twitter:site nennt das Konto, dem die Seite gehört, und twitter:creator nennt den Autor. Keines von beiden verändert die Karte stark. Beide zählen jedoch in der Analyse, wo sie den Link einem Konto zuordnen.
Bilder, die den Zuschnitt überstehen
Eine Karte mit großem Bild will etwa 2 zu 1, und 1200 mal 628 funktioniert überall. Außerdem sollte das Bild unter 5 MB liegen und über https ausgeliefert werden.
Summary-Karten schneiden hingegen quadratisch zu. Alles Wichtige nahe dem linken oder rechten Rand verschwindet, also halten Sie das Motiv zentriert.
Text im Bild schrumpft mit der Karte. Deshalb gehören Ihre Worte in den Titel, wo sie auf dem Smartphone lesbar bleiben.
Warum eine Karte einen nackten Link schlägt
Ein nackter Link ist eine Zeile blauer Text. Eine Karte nimmt dagegen ein Vielfaches davon ein und trägt ein Bild, deshalb gewinnt sie den Blick.
Außerdem beantwortet sie die erste Frage des Lesers. Was das ist und wer es veröffentlicht hat, steht da, bevor jemand klickt.
Das zählt vor allem auf einer Plattform, auf der Beiträge in Sekunden vorbeiziehen. Die Karte ist nämlich die Anzeige, und der Beitrag ist die Bildunterschrift.
Nichts davon hilft allerdings, wenn die Tags falsch sind. Eine kaputte Karte nimmt so viel Platz ein wie ein nackter Link und wirkt zudem nachlässig.
Warum eine Karte einen nackten Link schlägt
Ein nackter Link ist eine Zeile blauer Text. Eine Karte nimmt dagegen ein Vielfaches davon ein und trägt ein Bild, deshalb gewinnt sie den Blick.
Außerdem beantwortet sie die erste Frage des Lesers. Was das ist und wer es veröffentlicht hat, steht da, bevor jemand klickt.
Das zählt vor allem auf einer Plattform, auf der Beiträge in Sekunden vorbeiziehen. Die Karte ist nämlich die Anzeige, und der Beitrag ist die Bildunterschrift.
Nichts davon hilft allerdings, wenn die Tags falsch sind. Eine kaputte Karte nimmt so viel Platz ein wie ein nackter Link und wirkt zudem nachlässig.
Karten werden zwischengespeichert
Die Plattform speichert, was sie ausgelesen hat, manchmal tagelang. Also reparieren Sie ein Tag, posten erneut, und die alte Karte kann trotzdem erscheinen. Ein Lauf durch den Validator leert den Cache.
So nutzen Sie den Twitter-Card-Generator
Vier Schritte, und der zweite entscheidet, wie viel Code am Ende herauskommt.
- 1
Den Kartentyp wählen
Großes Bild für alles mit einem Foto. Summary, wenn Ihr einziges Bild ein Logo ist, da ein gestrecktes Logo schlechter aussieht als ein kleines.
- 2
Festlegen, wie viel Text auf die Karte kommt
Lassen Sie Nur die abweichenden Tags angehakt, wenn Ihre Seite bereits og:-Tags hat. Entfernen Sie den Haken für eine Seite ohne.
- 3
Titel, Bild und Handles eintragen
Titel bis 70 Zeichen bleiben erhalten. Zudem zeigt die Vorschau die Zuschnittform, sodass Sie das Bild prüfen können, bevor es live geht.
- 4
Einfügen, dann validieren
Setzen Sie den Block in Ihren Head und schicken Sie die Adresse durch den Card Validator. Sonst bleibt eine zwischengespeicherte Karte tagelang stehen.
Was diesen Card-Generator auszeichnet
Die meisten Tools schreiben acht twitter:-Tags, ob Sie sie brauchen oder nicht. Dieses fragt hingegen zuerst und erklärt dann die Antwort.
Ein Minimalmodus als Standard
Weil die Plattform og:-Tags liest, genügt meist eine Zeile. Deshalb schreibt der Haken genau diese Zeile und nichts sonst.
Beide Familien, richtig geschrieben
twitter:-Tags nehmen name, während og:-Tags property nehmen. Folglich schreibt dieses Tool jede Familie mit dem Attribut, das sie braucht.
Eine Kartenvorschau mit dem richtigen Zuschnitt
Karten mit großem Bild sind breit, Summary-Karten quadratisch. Deshalb wechselt die Vorschau mit dem Typ, und die Form ist nie eine Überraschung.
Handles werden beim Tippen bereinigt
Ein führendes At-Zeichen, keine Leerzeichen, fünfzehn Zeichen. Selbst eine eingefügte volle Profiladresse ergibt einen gültigen Handle.
Player-Felder, wenn sie gelten
Wählen Sie eine Player-Karte, und die Einbettungsfelder erscheinen, dazu ein Hinweis, dass die Plattform diese vorher von Hand freigibt.
Nichts verlässt Ihren Tab
Kampagnentexte und unveröffentlichte Adressen bleiben hier. Somit ruft die Seite nichts ab, speichert nichts und protokolliert nichts.
Regeln für Karten, die Klicks bringen
Eine Karte konkurriert mit allem anderen im Feed. Diese Gewohnheiten sorgen dafür, dass sie gewinnt.
- Zuerst die og:-Tags schreiben. Sie bedienen auch jedes andere Netzwerk, und die Plattform greift auf sie zurück. Ein Block statt zwei heißt weniger Abgleich.
- Den Kartentyp zum Bild passend wählen. Ein Foto verlangt die Karte mit großem Bild. Ein Logo verlangt die Summary, weil ein über den Feed gestrecktes Logo billig wirkt.
- Den Titel unter 70 Zeichen belassen. Darüber hinaus kürzt die Karte, und der Schnitt fällt dort, wo die Breite endet, statt an ein Wort Ihrer Wahl.
- Das Motiv des Bildes zentrieren. Zuschnitte kosten die Ränder. Ein Gesicht oder Produkt am linken Rand überlebt am Desktop und verschwindet auf dem Smartphone.
- Den Alt-Text des Bildes ergänzen. Eine Zeile, und ein Screenreader hat etwas anzusagen statt des Bildes. Kaum jemand denkt daran.
- Überall https nutzen. Die Plattform verwirft Bilder über einfaches http. Ebenso verwirft sie alles hinter einem Login, einem Staging-Passwort oder einer Hotlink-Regel.
- Nach jeder Änderung validieren. Der Cache ist der Grund, warum Ihre Karte falsch aussieht. Schicken Sie die Adresse durch den Validator, statt einen Testlink zu posten.
- Ein Bild pro Seite behalten. Ein zweites Bild-Tag zwingt die Plattform zur Wahl, und sie wählt selten das gewünschte. Ein Tag beseitigt die Frage.
- Prüfen, wie es ohne Bild wirkt. Manche Clients entfernen Bilder ganz. Titel und Domain müssen den Link dann allein tragen.
Sechs Kartenfehler, die einen Beitrag verschwenden
Jeder davon hinterlässt eine funktionierende Seite und einen Link, der als schlichter grauer Text erscheint.
property statt name verwenden
Das Tag wird zu einem og:-Tag, das nichts erkennt. Gültiges HTML, komplett ignoriert und mit bloßem Auge schwer zu entdecken.
Eine Karte mit großem Bild ohne Bild
Die Plattform fällt auf eine kleine Karte zurück, also nimmt der Beitrag nur ein Drittel des erwarteten Platzes ein.
Jedes twitter:-Tag doppelt schreiben
og:-Tags in twitter:-Form zu duplizieren verdoppelt den Block ohne Gewinn. Der Rückgriff deckt alle vier bereits ab.
Ein Vorschaubild mit zu geringer Auflösung
Unter etwa 300 Pixeln Breite lässt die Karte das Bild weg. Zielen Sie auf 1200 mal 628, dann müssen Sie nie wieder daran denken.
Nach dem Laden eingefügte Tags
Der Scraper liest das ausgelieferte HTML und führt keine Skripte aus. Deshalb bleiben per JavaScript eingefügte Tags für ihn unsichtbar.
Ein Handle mit der vollen URL
twitter:site erwartet ein At-Zeichen und einen Namen. Eine Profiladresse verschwindet dort stillschweigend, und die Zuordnung gleich mit.
Häufige Fragen zu Karten
Brauche ich überhaupt Twitter-Card-Tags?
Sie brauchen eines: twitter:card. Außerdem liest die Plattform og:title, og:description, og:image und og:url, wenn die twitter:-Versionen fehlen, deshalb sind die übrigen Duplikate.
Welche Bildmaße bringen das beste Ergebnis?
Nutzen Sie 1200 mal 628 für eine Karte mit großem Bild, was fast 2 zu 1 ist. Summary-Karten schneiden jedoch quadratisch zu, also halten Sie das Motiv in der Mitte.
Warum erscheint meine Karte als reiner Text?
Meist wegen eines fehlenden twitter:card-Tags, eines Bildes, das der Scraper nicht erreicht, oder Tags, die JavaScript nach dem Laden einfügt. Prüfen Sie deshalb zuerst diese drei Punkte.
Wie bekomme ich eine Kartenvorschau für X?
Nutzen Sie den Card Validator der Plattform mit der Live-Adresse. Die Vorschau hier zeigt Form und Kürzungslängen, während der Validator das zwischengespeicherte Ergebnis zeigt.
Beeinflusst die Karte die SEO?
Nicht direkt, da diese Tags außerhalb der Suche wirken. Stattdessen beeinflussen sie die Klickrate geteilter Links, und das ist eine andere, oft größere Zahl.
Worin unterscheiden sich site und creator?
Der site-Handle nennt das Konto, das die Seite veröffentlicht. Der creator-Handle nennt dagegen die Person, die sie geschrieben hat. Beide erscheinen in der Analyse statt auf der Karte.
Kann ich eine Player-Karte für mein eigenes Video nutzen?
Nur nach Freigabe. Die Plattform prüft Player-Karten nämlich von Hand, und bis sie Ihre freigibt, fällt der Link auf eine Summary zurück.
Wohin gehören diese Tags?
In das head-Element der Seite, die Sie teilen, neben Ihre übrigen Meta-Tags. Außerdem erleichtert es eine spätere Prüfung, wenn beide Familien zusammenstehen.
Funktionieren Karten auch in anderen Apps?
Die og:-Tags schon, und deshalb schreibt diese Seite sie ebenfalls. Slack, WhatsApp, LinkedIn und Discord lesen alle dieselben vier Eigenschaften.
Funktionieren Karten auch in anderen Apps?
Die og:-Tags schon, und deshalb schreibt diese Seite sie ebenfalls. Slack, WhatsApp, LinkedIn und Discord lesen alle dieselben vier Eigenschaften.
Schickt diese Seite meinen Text irgendwohin?
Nein. Ihr Browser schreibt jedes Tag, und die Seite ruft keine Adresse ab. Folglich speichert diese Website nichts und protokolliert nichts.
Tools für Social-Links
Karten sind Tags plus ein Bild. Diese drei decken beide Teile und den Head drumherum ab.
Open-Graph-Generator
Die vier Eigenschaften, die jedes Netzwerk liest.
Tool öffnen →JPG-zu-WebP-Konverter
Ein Kartenbild verkleinern, ohne Details zu verlieren.
Tool öffnen →Meta-Tag-Generator
Title, Description und Canonical für dieselbe Seite.
Tool öffnen →
Bereit, Ihre Karte zu schreiben?
Wählen Sie einen Typ, tragen Sie einen Titel ein und kopieren Sie den Block. Der Twitter-Card-Generator ist kostenlos, braucht kein Konto und behält jedes Wort auf Ihrem Gerät.