Meta tag Open Graph: tutto quello che devi sapere

Guida pratica ai meta tag Open Graph: cosa sono, esempi di markup, come testarli e risolvere le anteprime sbagliate sui social.

Michael

Pubblicato 16 febbraio 2026

Cosa otterrai da questa guida

Riceverai spiegazioni pratiche e esempi concreti per implementare i meta tag Open Graph, strumenti e comandi per verificare le anteprime social, e una checklist di controllo per evitare gli errori più frequenti.

Cos'è Open Graph e come funziona

Open Graph è un protocollo di metadata che consente ai social network di leggere titolo, descrizione, immagine e altri attributi di una pagina quando viene condivisa. I tag OG vanno inseriti nella sezione head dell'HTML; i servizi social usano questi tag come fonte primaria per costruire l'anteprima condivisa. Open Graph riguarda la presentazione sui social, non la classifica su Google: può però influenzare il comportamento degli utenti (ad esempio il click-through) quando la pagina viene condivisa.

Differenza tra crawling, indicizzazione e anteprime social

I social network possono scansionare (crawl) la tua pagina per leggere i meta tag OG e costruire un'anteprima. Questo processo è separato dall'indicizzazione per i motori di ricerca e dalla valutazione di ranking. Assicurati che la risorsa sia raggiungibile e che non venga bloccata da robots.txt o da header che impediscono l'accesso, altrimenti l'anteprima potrebbe mancare o mostrare contenuti imprevedibili.

Tag Open Graph principali e esempi di markup

I tag Open Graph più utili per la maggior parte delle pagine sono og:title, og:description, og:type, og:url e og:image. Esempio minimo da inserire dentro <head>:

Aggiunte utili: og:image:alt per accessibilità e og:locale per specificare la lingua. Per Twitter, usa anche i meta tag twitter:card, twitter:title, twitter:description e twitter:image per assicurare la migliore resa su X/Twitter.

Best practice tecniche

Linee guida pratiche per risultati coerenti e accessibili:

Posiziona i tag OG dentro la sezione head e prima di script che manipolano il DOM; i crawler leggono il markup iniziale.
Fornisci una versione di og:description pensata per la lettura rapida: differente dalla meta description se necessario.
Usa immagini di buona qualità e rapporto compatibile con le anteprime social (immagini rettangolari sono più flessibili). Verifica che l'URL dell'immagine sia accessibile pubblicamente e risponda con Content-Type corretto.
Evita di inserire dati sensibili nei tag OG; il contenuto potrebbe essere memorizzato nei sistemi dei social.
Mantieni og:url coerente con la versione canonica della pagina; usa lo stesso URL che segnali con rel=canonical.

Come testare e risolvere le anteprime social

Ecco una procedura operativa per verificare che le anteprime social corrispondano al tuo markup.

1) Controllo rapido del markup

Apri la pagina nel browser e visualizza il sorgente (Ctrl/Cmd+U) o usa Chrome DevTools per cercare i meta tag nella sezione head.

2) Verifica accessibilità della risorsa

Usa curl per controllare intestazioni e risposta del server. Per le intestazioni:

curl -I https://example.com/pagina

Per simulare la richiesta di un crawler social verifica l'HTML servito a un user-agent specifico (curl -A restituisce il body):

curl -A "facebookexternalhit/1.1" https://example.com/pagina

3) Strumenti ufficiali

Facebook Sharing Debugger (developers.facebook.com/tools/debug/) permette di vedere quale markup Facebook legge e di forzare una nuova scansione.
X/Twitter Card Validator (developer.twitter.com/tools/validator) mostra la card che Twitter costruisce dalla tua pagina.

4) Problemi comuni e soluzioni

Anteprima che mostra immagini sbagliate: verifica che non ci siano più tag og:image concorrenti e che l'URL dell'immagine non venga reindirizzato o bloccato.
Anteprima mancante o vuota: controlla che la pagina risponda con 200 OK, che non ci siano header X-Robots-Tag restrittivi e che l'HTML includa i tag OG prima di eventuale JavaScript che riscrive il head.
Anteprima aggiornata non visibile: usa lo strumento di debug del social per forzare una nuova scansione; molte piattaforme memorizzano le anteprime in cache e offrono un meccanismo di re-scrape.

Checklist rapida prima della condivisione

Controlla questi punti per avere anteprime native e coerenti:

I tag og:title, og:description e og:image sono presenti nel head.
L'URL dell'immagine è pubblicamente accessibile e restituisce Content-Type corretto (es. image/jpeg o image/png).
La pagina risponde con codice 200 e non è bloccata da robots.txt o da X-Robots-Tag per i crawler social.
Se usi versioni AMP o dinamiche, assicurati che la versione condivisa contenga i tag OG o che il social network possa raggiungere la versione canonica.

Se vuoi approfondire aspetti tecnici del sito (canonicals, indicizzazione, Core Web Vitals) consulta le risorse dedicate:

Leggi la guida Technical SEO

FAQ

Open Graph influisce sulla SEO?

Open Graph influenza la presentazione sui social e può migliorare il click-through rate dalle condivisioni; non è direttamente un segnale di ranking per Google, ma una buona anteprima può aumentare il traffico e l'engagement.

Posso usare la stessa immagine og:image per tutte le pagine?

È possibile, ma per ottenere migliori risultati suggerisco immagini specifiche per contenuto: titoli diversi e immagini dedicate aumentano la probabilità di attirare attenzione nei feed social.

Come faccio a forzare la nuova anteprima su Facebook?

Apri il Facebook Sharing Debugger, inserisci l'URL e clicca su "Scrape Again" o equivalente per richiedere a Facebook di riscaricare il markup e aggiornare la cache dell'anteprima.

Qual è la differenza tra Open Graph e Twitter Card?

Open Graph è uno standard usato da molti social; Twitter Card è lo specifico set di tag che X/Twitter preferisce. Nell'implementazione pratica si possono usare entrambi: impostare i tag OG e aggiungere i tag twitter:* per garantire la resa su tutte le piattaforme.