Zach hat das gemacht, bei dem jeder seiner Blogbeiträge eine spezielle URL hat mit dem Design einer Social-Image-Karte, die von einem Headless-Browser (wie Puppeteer) „screenshotted“ und als echtes Meta-Open-Graph-Bild verwendet wird. Das bedeutet, es wird auf Twitter, Facebook, iMessage, Slack, Discord und allen anderen Plattformen angezeigt, die diese Kartenoptik unterstützen.
Ich mag das. Obwohl ich im Moment (für WordPress) eine ziemlich gute Lösung in Arbeit habe, werden die Vorlagen nicht mit HTML/CSS gesteuert, wie ich es mir wünschen würde.
Als kleines Yang zum Ying hierzu hat Jim einige Gedanken zu den nicht so tollen Aspekten von Open Graph-Bildern.
Ich habe das Gefühl, dass sie von automatisiert generierten Computerbildern gekapert wurden, die mehr als aufmerksamkeitsheischende Füllung denn als unterstützender Ausdruck dienen.
Jim Nielsen, „Quibbles With Social Share Imagery“
Es ist irgendwie so… wir können Open Graph-Bilder hinzufügen, und wir bekommen im Wesentlichen ein völlig kostenloses, riesiges, klickbares Ziel für hungrige Finger, also fügen wir Open Graph-Bilder hinzu – auch wenn das Bild, nun ja, langweilig ist. Nur automatisch generierter Computer-Rotz mit dem Titeltext mit Branding. Jims Beitrag enthält Beispiele.
Ich verstehe, woher Jim kommt, und ich bin wohl bis zu einem gewissen Grad schuldig. Ich habe jedoch das Gefühl, dass wir bei CSS-Tricks eine Stufe besser sind, wenn Sie mir einen Hauch von Verteidigungshaltung verzeihen, denn
- Wir haben eine Auswahl an Vorlagen, aus denen wir wählen können, um Abwechslung zu schaffen, wie z. B. ein Zitatdesign.
- Wir integrieren benutzerdefinierte Bilder in die endgültige Karte, was bedeutet, dass die meisten Karten visuell einigermaßen einzigartig sind.
- Wir branden die Karten nicht nur, wir integrieren normalerweise den Autor für einen kleinen Extra-High-Five für die Person, anstatt nur unsere Marke.
Screenshat?! Ich glaube, du meinst „Screenshot“, Chris.
Ich habe gerade Screenshat auf Urban Dictionary nachgeschlagen und du hast Recht – es ist ein Begriff.
LOL, das hat mich auch erwischt, als ich den Entwurf durchging. So lustig, und ich bin ganz dafür.
Mir scheint, das Problem ist das alte: Du hast keinen Inhalt (ein gutes Bild), aber du willst so tun, als ob.
Meine LAMP-Lösung für automatisierte Sharing-Karten
Hole das Beitragsbild, falls vorhanden („featured“ Bilder sind gut für die In-Site-Suchergebnisse, Banner usw.)
Oder hole das erste Bild, falls vorhanden (dies setzt voraus, dass deine Seite interessante Bilder hat)
Oder wähle zufällig aus einer vorausgewählten Auswahl generischer Bilder, die deine Seite repräsentieren: Logos, Themenfotos/-illustrationen usw.
Yep. Mache etwas Ähnliches in WordPress, um völlig redundante (!) Beitragsbilder und damit Open Graph-Bilder zu generieren. Ich meine, zumindest verwende ich sie auch für „Beitrags-Thumbnails“, nehme ich an? Ich verwende auch nur PHP (nun ja, DomPDF und Imagick), um tatsächliches HTML/CSS in PNG umzuwandeln, was nett ist.