Open Graph Anteprima

Uno strumento di anteprima Open Graph ti mostra come apparirà un collegamento condiviso prima di pubblicarlo Inserisci i tuoi campi og: title, og: description, og: image, og: url e Twitter Card - o incolla il blocco di meta tag che hai già - e lo strumento rende le schede social approssimative per Facebook, X/Twitter, LinkedIn, Slack e Discord fianco a fianco Invece di spingere una pagina dal vivo, condividerla e scoprire che il titolo è tagliato a metà o l'immagine non si carica mai, vedi il problema mentre puoi ancora risolverlo.

Il protocollo Open Graph è il vocabolario condiviso che quasi ogni piattaforma utilizza per costruire quelle carte Un raschietto visita la tua pagina, legge i meta tag og: nel <head>, e assembla un'anteprima da loro Il problema è che ogni piattaforma rende quegli stessi tag in modo diverso: X tronca le descrizioni a circa 110 caratteri mentre Facebook mostra più vicino a 155, LinkedIn nasconde la descrizione interamente su alcune superfici e Slack fa collassare tutto in un allegato compatto Un campo che sembra bello in una carta può essere storpiato in un'altra, motivo per cui visualizzarne tutte in anteprima contemporaneamente è l'unico controllo affidabile.

Ecco un'anteprima a grafico aperto con numeri reali Set og: title to "How We Cut Our Page Load Time in Half Without a Rewrite" (55 caratteri, un pass) e dagli un og: descrizione di 125 caratteri La convalida passa il titolo e avverte sulla descrizione: fine per Facebook e LinkedIn, ma X tronca oltre circa 110 La X scheda di grande immagine taglia il testo dopo "da 4,1 secondi...", mentre la scheda Facebook mostra l'intera frase L'anteprima dell'immagine a grafico aperto carica la tua og: immagine in ogni scheda, quindi un link interrotto mostra "Immagine non caricata" prima che qualcuno la condivida.

Questo strumento funziona lato client e non recupera o raschia mai la tua pagina Funziona dai tag che gli dai, digitati nel modulo o incollati come HTML grezzo e analizzati localmente Ciò significa che puoi convalidare i metadati per le pagine che si trovano dietro un login, su un dominio di stadiazione o non distribuite affatto L'unica richiesta che fa al tuo server è caricare l'og: URL dell'immagine, in modo che il tuo browser possa mostrare l'immagine nelle schede.