Che cos'è un'immagine OpenGraph

Le immagini OpenGraph sono immagini utilizzate per i tag OpenGraph, che vengono visualizzate nelle anteprime di Twitter, Facebook e Open Graph.

Le immagini OpenGraph possono essere statiche o dinamiche. Questo dipende dal fatto che siano generate utilizzando un generatore OpenGraph o altri strumenti.

Le immagini generate utilizzando un generatore OpenGraph sono tipicamente statiche perché vengono generate in base ai metadati forniti, che sono solitamente statici. Ad esempio, se fornisci i metadati per un post del blog, il generatore OpenGraph creerà un'immagine OpenGraph statica basata su quei metadati.

Le immagini generate utilizzando altri strumenti possono essere dinamiche. Per esempio, se utilizzi un framework di rendering lato server per generare immagini OpenGraph, queste immagini potrebbero essere generate in base al comportamento dell'utente, all'ora, al meteo o ad altre informazioni dinamiche.

Crea immagini OpenGraph utilizzando gli strumenti

Codice HTML OpenGraph

<meta property="og:url" content="https://example.com/article">
<meta property="og:title" content="My Article Title">
<meta property="og:description" content="This is my article description">
<meta property="og:type" content="article">
<meta property="og:image" content="https://example.com/og-image.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:type" content="image/png">
<meta property="og:image:alt" content="OpenGraph">

Con questo codice HTML, la pagina mostrerà l'immagine https://example.com/og-image.png in OpenGraph.

Effetti dell'anteprima

Dopo aver creato un'immagine OG, molti siti web forniscono strumenti online di anteprima e debug per aiutarti a diagnosticare i problemi. Ecco alcuni strumenti comuni: