Die kleinen Vorschaubilder die für Artikel, URLs und andere Sachen in Facebook angezeigt werden kennt man. Nun gibt es seit einiger Zeit ein größeres Format, was natürlich auch mehr Aufmerksamkeit beim Leser hervorruft:
Image may be NSFW.
Clik here to view.
Laut Facebook sollten die og:images (Open Graph Images) wie folgt angelegt werden:
Small og:image: All the images referenced by og:image should be at least 200px in both dimensions, with 1500×1500 preferred. (Maximum image size is 5MB.) Please check all the images with tag og:image in the given url and ensure that it meets the recommended specification.
og:image should be larger: Provided og:image is not big enough. Please use an image that’s at least 200×200 and preferably 1500×1500. (Maximum image size is 5MB.) Image … will be used instead.
Nun ist es aktuell aber so, dass selbst wenn man ein Bild in 1500×1500 Pixel anlegt, dieses als kleines Vorschaubild angezeigt wird. Wieso? Weil es quadratisch ist. So sieht man z.B. an dem og:image von The Verge, dass es a) viel zu klein und b) quadratisch ist. Bei The Next Web hingegen mit 2500×1505 ziemlich groß. Lösung? 4:3 oder 16:9.
Ein Beispiel
Für unser neues SEO-Tool, den Linkmotor, habe ich folgendes Bild erstellt:
Bild: https://linkmotor.de/images/linkmotor.jpg
Format: 1800×1200
Angezeigt wird es dann bei Facebook so:
Image may be NSFW.
Clik here to view.
og:image …bitte was?
Mithilfe des Open Graph Protocol kann man Inhalte bzw. Webseiten semantisch auszeichnen. Webseiten wie z.B. Facebook oder Google+ können diese dann (einfacher) auslesen und verwerten. Am Beispiel von Linkmotor und des og:image Meta-Elements sieht es z.B. so aus:
<meta property="og:image" content="http://linkmotor.de/images/linkmotor.jpg">
Facebook kann diese Infos dann auslesen und z.B. im Newsfeed anzeigen. Um Open Graph-Angaben zu testen, hat Facebook auch extra ein Tool zur Verfügung gestellt.
Viel Spaß beim Einbauen.
Der Beitrag og:image ordentlich groß für Facebook anlegen ist auf Digital gefesselt erschienen.
