Generatore di Immagini OG: Crea un'Immagine di Condivisione 1200 x 630 nel Browser | We.Inc
Progetta l'immagine che appare quando la tua pagina viene condivisa. Scegli un modello, aggiungi titolo, logo e colori, guarda l'anteprima come scheda X, LinkedIn, Slack e iMessage, poi scarica un PNG da 1200 per 630 e i meta tag.
La dimensione standard di un'immagine Open Graph è 1200 per 630 pixel, una proporzione di 1,91 a 1 che Facebook, LinkedIn, X, Slack e le app di messaggistica mostrano tutte bene. Scegli un modello qui sotto, scrivi il titolo, aggiungi un logo e i colori del brand, controlla le anteprime, poi scarica il PNG e copia i meta tag og:image.
Dimensioni delle immagini di condivisione per piattaforma
Piattaforma
Cosa richiede
Note
Facebook e le altre app Meta
1200 per 630 per risultati migliori; almeno 600 per 315
Proporzione 1.91:1; le immagini piccole appaiono come miniatura
Scheda grande di X (Twitter)
Proporzione 2:1; da 300 per 157 fino a 4096 per 4096; meno di 5 MB
Richiede twitter:card impostato su summary_large_image
LinkedIn
1200 per 627
Usa il Post Inspector per aggiornare un'immagine in cache
Slack, Discord, iMessage, WhatsApp
Nessuna dimensione pubblicata
Leggono og:image; 1200 per 630 si vede bene in ognuna
Quattro modelli disegnati su un canvas nel tuo browser a esattamente 1200 per 630. Il tuo logo non lascia mai il tuo dispositivo. Le anteprime mostrano più o meno come ogni app ritaglia l'immagine, e il blocco di meta tag è pronto da incollare nella head della pagina.
Scegli un modello: titolo in grassetto, centrato, diviso con logo o scheda articolo.
Scrivi il titolo e una breve riga sotto, e il nome del sito o l'URL mostrato in basso.
Scegli i colori di sfondo, testo e accento, e carica un logo se ne vuoi uno (un PNG o SVG con sfondo trasparente funziona meglio).
Controlla le anteprime, scarica il PNG, caricalo sul tuo sito e incolla i meta tag con il suo URL completo.
Tieni il titolo sotto i 60 caratteri circa e alto almeno 48 pixel nell'immagine, perché la maggior parte delle persone vede la scheda a una frazione della sua dimensione reale.
Lascia un margine attorno al testo importante. Alcune app ritagliano i bordi o arrotondano gli angoli.
Usa un URL https assoluto in og:image. I percorsi relativi non funzionano con la maggior parte dei crawler.
Le piattaforme mettono in cache le immagini di condivisione. Dopo averne cambiata una, aggiornala con lo strumento di debug di ogni piattaforma, oppure dai al file un nuovo nome.
Domande frequenti
Qual è la dimensione migliore per un'immagine OG?
1200 per 630 pixel. Rispetta la raccomandazione di Meta per i display ad alta risoluzione, è vicina ai 1200 per 627 di LinkedIn e funziona per la scheda con immagine grande di X, quindi un solo file vale per tutti. Salvala come PNG per i design ricchi di testo o come JPG per le foto, e tienila ben sotto i 5 MB.
Mi serve un'immagine separata per la Twitter card?
Di solito no. X usa og:image quando manca twitter:image. Ti serve però il meta tag twitter:card impostato su summary_large_image per avere l'anteprima grande invece di una piccola miniatura.
Perché si vede ancora la vecchia immagine?
Ogni piattaforma mette in cache l'anteprima. Usa lo Sharing Debugger di Meta, il Post Inspector di LinkedIn o semplicemente un nuovo nome per il file immagine per forzare un nuovo recupero. Slack e le app di messaggistica si aggiornano secondo i propri tempi.
Posso creare automaticamente un'immagine per ogni pagina?
Sì, con un renderer di immagini lato server che costruisce l'immagine dal titolo di ogni pagina. Questo strumento serve a progettare il modello e a creare immagini scelte a mano per le pagine importanti.
Cosa rende cliccabile un'immagine di condivisione
Una scheda di condivisione compete con tutto il resto di un feed, a dimensioni ridotte. Un titolo breve e grande e un solo elemento visivo forte battono un layout affollato. Tratta l'immagine come la compagna del titolo, non come una seconda copia della pagina.
La coerenza del brand aiuta le persone a riconoscere i tuoi link nel tempo. Usa lo stesso modello con un titolo diverso per ogni pagina invece di progettare ogni immagine da zero.
Verificare che funzioni
Dopo la pubblicazione, incolla l'URL della pagina nel nostro strumento di anteprima Open Graph per vedere i tag che la pagina serve davvero, e nel debugger di ogni piattaforma prima di un lancio importante.
Titolo in grassetto
Centrato
Diviso con logo
Scheda articolo
Progetta l'immagine
Modello
Titolo ({n} caratteri)
Riga sotto il titolo
Nome del sito o URL
Sfondo
Testo
Carica logo
Rimuovi logo
Immagine di condivisione: {title}
Scarica PNG (1200 per 630)
Come appare quando viene condivisa (approssimativo)
Meta tag
URL completo dove caricherai l'immagine
Copia i meta tag
Come abbiamo dimezzato il tempo di caricamento della pagina