Ultimo aggiornamento: gennaio 27, 2021
Prima di pubblicare un post sui social, puoi vedere in anteprima come l'immagine in primo piano verrà visualizzata nel tuo post. Scopri come risolvere i problemi con l'immagine in primo piano nelle tue anteprime sociali.
Un'anteprima sociale è costruita su meta tag nella sezione <head> dell'HTML della tua pagina. Questi tag fanno parte del protocollo Open Graph, che consente a qualsiasi pagina web di diventare un oggetto ricco in un grafico sociale. Questi tag dicono ai siti di social media come Facebook, LinkedIn e Twitter su cosa concentrarsi quando creano un'anteprima del vostro link condiviso. I meta tag di base sono:
- og:title: il titolo del vostro contenuto.
- og:type: il tipo di contenuto, come un video o una pagina web.
- og:image: l'URL dell'immagine che rappresenta il tuo contenuto.
- og:url: l'URL unico del tuo contenuto che sarà usato come suo ID permanente.
- og:description: ladescrizione che riassume la tua immagine.
Il titolo, la meta descrizione e l'immagine in primo piano sono impostati automaticamente per i post del blog. Per le landing page e le pagine del sito web, l'immagine in primo piano deve essere impostata manualmente.
L'immagine in primo piano, il titolo della pagina o la descrizione della pagina non vengono visualizzati nell'anteprima del post
Se l'anteprima del tuo post sociale non mostra l'immagine in primo piano, il titolo della pagina o la descrizione della pagina che ti aspetti, ci sono diversi strumenti di debug che puoi utilizzare per risolvere il problema.
Conferma che hai specificato un'immagine in primo piano e che i tuoi meta tag sono scopribili
Se ti stai collegando a un post del blog, a una landing page o a una pagina del sito ospitata con HubSpot, assicurati di aver selezionato un'immagine in primo piano.
Se stai condividendo una pagina esterna nel tuo post, usa gli strumenti di sviluppo del tuo browser, come Chrome Developer tools, per visualizzare il sorgente della pagina, poi cerca il tag og:image per vedere quale immagine verrà visualizzata.
Se hai confermato che iltag og:image è presente e l'URL dell'immagine in evidenza è corretto, ma non vedi ancora un'anteprima del link per il tuo post, puoi anche controllare quanto segue:
- Confermare che c'è solo un'occorrenza di ogni tipo di meta tag: se ci sono più occorrenze dello stesso meta tag sulla tua pagina, alcuni social network potrebbero non scegliere quello corretto quando cercano di generare un'anteprima del link.
- Assicuratevi che i vostri meta tag siano all'inizio del vostro HTML: se avete codice extra o markup prima dei meta tag, i crawler di alcuni social network potrebbero non essere in grado di individuarli.
Usate gli strumenti di debug dei social network per convalidare la vostra immagine e i meta tag
Se nell'anteprima del social network vedete un'immagine diversa da quella che è impostata come tag og:image, il social network potrebbe aver bisogno di ri-scansionare quella pagina. È possibile utilizzare i seguenti strumenti di convalida per innescare un recrawl della pagina e far emergere eventuali errori che possono influire sulla pubblicazione:
- Facebook: usa il Facebook Sharing Debugger per far emergere eventuali avvertenze o errori con i meta tag, o per raschiare di nuovo l'URL del contenuto in modo da generare l'anteprima del link di Facebook più recente.
- Twitter: usa il Twitter Card Validator per far emergere eventuali avvisi o errori con i tuoi meta tag, o per raschiare di nuovo l'URL del contenuto in modo da generare l' anteprima della scheda Twitter più aggiornata.
- LinkedIn: utilizzate il Card Inspector di LinkedIn per far emergere eventuali avvertenze o errori con i vostri meta tag, o per raschiare nuovamente l'URL del contenuto in modo da generare l'anteprima della scheda LinkedIn più aggiornata.
Nota: LinkedIn mostrerà la vostra immagine in primo piano, il titolo della pagina e l'URL nella loro scheda di anteprima, ma non includerà la vostra meta descrizione.
Se il tag og:image non è stato impostato per una pagina, il social network scansionerà la pagina per trovare l'immagine più appropriata da includere nei post sociali, che di solito è la prima immagine che trova. Un'immagine di anteprima del link potrebbe non apparire affatto se un file robots.txt, o certi software di sicurezza, vengono utilizzati per impedire il crawling della pagina.
Requisiti di dimensione per le immagini in primo piano
Se l'immagine in primo piano di un link che hai inserito non viene visualizzata correttamente nell'anteprima sociale (ad esempio, l'immagine è tagliata o il rapporto non è corretto), potrebbe essere necessario modificare l'immagine in modo che abbia le dimensioni giuste per il social network in cui stai pubblicando, quindi ripubblicare la pagina. Se stai pubblicando su Facebook, puoi saperne di più sui loro requisiti per le immagini in primo piano nella loro documentazione.
Le seguenti dimensioni sono raccomandate per l'ottimizzazione delle immagini in primo piano su ogni rete:
- Facebook: 1.91:1
- Twitter: 16:9 per i post di foto e 1.91:1 per le immagini in primo piano nei post di link
- Instagram (quadrato): 1:1
- Instagram (verticale): 4:5
- Instagram (paesaggio): 1.91:1
- LinkedIn (paesaggio): 1.91:1
Assicurati che tutti i media che includi nei tuoi post sociali seguano le linee guida sulle dimensioni dei file per ogni rete. Se HubSpot determina che un file è troppo grande per essere pubblicato su un certo network, verrà visualizzato un avviso. Le dimensioni massime dei file per ogni social network sono elencate di seguito:
- Facebook: 8MB (sotto 1MB raccomandato per i file PNG per evitare la pixelizzazione)
- Instagram: 8MB
- Twitter: 5MB (15MB per le GIF)
- LinkedIn: 10MB
Discrepanze di colore e chiarezza dell'immagine
Differenze nel colore dell'immagine
I profili di colore incorporati potrebbero avere un impatto su come la tua immagine in primo piano viene visualizzata nel tuo post sociale. Sistemi diversi elaborano profili di colore non comuni in modi diversi, ed è per questo che i colori potrebbero apparire diversi quando si visualizza l'anteprima dell'immagine nel file manager. Puoi eseguire l'URL della tua immagine attraverso uno strumento esterno per vedere se sta usando un profilo di colore non comune. Se necessario, puoi rimuovere il profilo di colore che interferisce in uno strumento di fotoritocco come Photoshop, quindi ripubblicare la pagina prima di pubblicare i post sui social.
Differenze nella chiarezza dell'immagine
Il file manager di HubSpot utilizza la compressione delle immagini su JPEG e PNG per aiutare a ottimizzare la velocità di caricamento dei contenuti ospitati da HubSpot. Anche i social network utilizzano la compressione delle immagini nei post, che possono variare in qualità rispetto a quanto visualizzato in HubSpot. Per questo motivo, si raccomanda di utilizzare immagini a risoluzione relativamente alta (nel rapporto di aspetto raccomandato) per ogni rete. Se la tua immagine non è conforme ai requisiti di un social network, verrà mostrato un avviso nello strumento di pubblicazione sociale di HubSpot per aiutarti a regolare la tua immagine di conseguenza.