Abbiamo visto qualche settimana fa come configurare All in One SEO Pack per ottimizzare l'interazione delle nostre pagine con i social network utilizzando, nel caso di Facebook, gli Open Graph.
Oggi analizziamo meglio i meta tag semantici dedicati al social network di Mark Zuckemberg e il loro utilizzo.
Gli Open Graph vanno posizionati nell header della nostra pagina, tra i tag <HEAD> e vengono abbreviati in og seguito da “:” e poi il nome del metatag.
Un esempio di sintassi potrebbe essere:
<meta property=”tipodiOpenGraph” content=”ValoreDellOpenGraph” />
Metatag di base
Sono dei metatag generici per ogni singola pagina web, ve ne sono di più specifici per includere informazioni aggiuntive come audio, video e località.
og:locale: la lingua dell’oggetto condiviso.
og:title: è un titolo che può differire dal metatag title della pagina, va a definire il title dell’oggetto nel grafo sociale.
og:type: permette di indicare il tipo di oggetto rappresentato nella pagina.
og:image: accetta come valore l’url di una immagine rappresentativa dell’oggetto/pagina. La featured image per fare un esempio pratico.
og:url: indica l’url canonico in cui recuperare l’oggetto.
og:description: presenta una breve descrizione della pagina.
og:site_name: il dominio/sito in cui è presente l’oggetto.
Metatag audio
Forniscono informazioni sull’audio che viene rappresentato dall’oggetto condiviso.
Per inserire gli open graph di descrizione dell’audio è necessario un file a cui far puntare l’url.
og:audio: l’URL di riferimento del file audio.
og:audio:title: titolo di riferimento del file audio.
og:audio:artist: identifica l’artista di riferimento del file audio.
og:audio:album: identifica l’album di riferimento del file audio.
og:audio:type: identifica l’estensione multifunzione o formato del file descritto in og:audio.
Metatag video
Forniscono le informazioni sul video rappresenta dall’oggetto condiviso.
Come per l’open graph dedicato all’audio per inserire gli open graph di descrizione dell’video è necessario un file a cui far puntare l’url.
og:video: è l’URL di riferimento ad un video in formato SWF. Facebook non accetta video in altri formati.
og:video:width: larghezza del video espressa in pixel. La larghezza massima è decisa dalle norme che regolano l’inclusione di video in Facebook. Per maggiori informazioni vi consiglio di guardare la nostra infografica dedicata alle dimensioni delle immagini sui Social Network.
og:video:height: l’altezza del video espressa in pixel.
og:video:type: identifica l’estensione multifunzione o formato del file descritto in og:video.
Metatag di località
Forniscono informazioni aggiuntive sulla località.
og:latitude: latidudine di riferimento.
og: longitude: longitudine di riferimento.
og:street_address: indirizzo di riferimento in cui è presente l’oggetto condiviso.
og:locality: la città o la località in cui è presente l’oggetto condiviso.
og:postal-code: codice di avviamento postale dell’oggetto condiviso.
og:country-name: paese di riferimento dell’oggetto condiviso.
Metatag di contatto
Forniscono informazioni sui contatti dell’oggetto condiviso.
og:email: l’email di riferimento dell’oggetto condiviso.
og:phone_number: numero telefonico dell’oggetto condiviso.
og:fax_number: numero di fax dell’oggetto condiviso.
Esempio Pratico
Un esempio pratico di come vengono utilizzati gli open graph, preso dal codice HTML della home page di www.posizionamento-seo.com:
<meta property="og:locale" content="it_IT" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Posizionamento siti internet" />
<meta property="og:description" content="informazioni sul posizionamento organico
dei siti internet, SEO, SEM, ottimizzazione dei Social Network e campagne di advertising" />
<meta property="og:url" content="https://www.posizionamento-seo.com/" />
