Open Graph vs Twitter Card: Hvad er forskellen?
Er du ikke sikker på, hvilke tags din side har?
Tjek dine Open Graph-tags gratis med Proovd — indsæt en URL og se præcis, hvordan den ser ud på X, LinkedIn, Slack, Discord, WhatsApp og Reddit.
Hurtigt svar
- Open Graph (og:) blev oprettet af Facebook i 2010
- Indstil begge for maksimal kompatibilitet
Open Graph — Facebook-standarden
<meta property="og:title" content="Your Title" />
<meta property="og:description" content="Your description" />
<meta property="og:image" content="https://yoursite.com/image.jpg" />
<meta property="og:url" content="https://yoursite.com/page" />Andre platforme overtog standarden Open Graph. LinkedIn, Discord, Slack, WhatsApp, and Reddit all read og: tags to render link previews.
Twitter Cards — Twitter-standarden
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Your Title" />
<meta name="twitter:description" content="Your description" />
<meta name="twitter:image" content="https://yoursite.com/image.jpg" />Twitter Cards har to hovedtyper:
Platform kompatibilitet
Her er, hvilke platforme der bruger hvilke tags:
| Platform | Primary Tags | Fallback |
|---|---|---|
| X / Twitter | twitter:card | og: tags |
| og: tags | twitter:card tags | |
| Discord | og: tags | twitter:card tags |
| Slack | og: tags | twitter:card tags |
| og: tags | twitter:card tags | |
| og: tags | twitter:card tags |
Hvorfor du skal indstille begge
Den komplette opsætning
Her er den anbefalede opsætning for enhver side:
<!-- Open Graph (LinkedIn, Discord, Slack, WhatsApp, Reddit) -->
<meta property="og:title" content="Your Title" />
<meta property="og:description" content="Your description" />
<meta property="og:image" content="https://yoursite.com/image.jpg" />
<meta property="og:url" content="https://yoursite.com/page" />
<meta property="og:type" content="website" />
<!-- Twitter/X (X/Twitter) -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Your Title" />
<meta name="twitter:description" content="Your description" />
<meta name="twitter:image" content="https://yoursite.com/image.jpg" />Tjekliste til hurtig rettelse
- Indstil twitter:card med værdien "summary_large_image"
- Indstil twitter:title og twitter:image
- Test med Proovd for at verificere på alle platforme
Ofte stillede spørgsmål
Kan jeg kun bruge OG-tags og springe Twitter Cards over?
Du kan, men X/Twitter gengiver muligvis ikke dit kort korrekt. Indstil altid begge for de bedste resultater på tværs af alle platforme.
Har jeg brug for forskellige billeder til OG og Twitter Card?
Nej. Brug den samme billed-URL for både og:image og twitter:image. Platformene vil bruge det tag, de foretrækker.
Relaterede artikler
Bekræft både OG- og Twitter Card-tags
Tjek dine Open Graph-tags gratis med Proovd — indsæt en URL og se forhåndsvisningen på X, LinkedIn, Slack, Discord, WhatsApp og Reddit.