← Blog

Veel voorkomende fouten met Open Graph-tags

Zelfs ervaren ontwikkelaars maken deze OG-tagfouten. Hier zijn de meest voorkomende - en hoe u ze kunt oplossen.

Controleer uw OG-tags op fouten

Gebruik Proovd — plak een URL en zie meteen hoe deze eruit ziet op X, LinkedIn, Slack, Discord, WhatsApp en Reddit.

Snel antwoord

  • Relatieve URL's gebruiken voor og:image — platforms kunnen deze niet ophalen
  • Ontbrekende tag twitter:card — X geeft uw kaart niet weer
  • Afbeelding te klein voor het platform — LinkedIn heeft minimaal 1200×627 nodig
  • Het cachegeheugen wordt niet gewist na updates: platforms houden OG-tags dagenlang in de cache

Fout 1: relatieve URL's gebruiken voor og:image

Dit is de meest voorkomende fout. Ontwikkelaars schrijven:

✗ Fout

<meta property="og:image" content="/images/preview.jpg" />

De crawlers van platforms kunnen relatieve URL's niet omzetten. Ze hebben een absolute URL nodig:

✓ Juist

<meta property="og:image" content="https://yoursite.com/images/preview.jpg" />

Gebruik altijd https:// in uw og:image URL. Dit is van invloed op elk platform: X, LinkedIn, Discord, Slack, WhatsApp en Reddit.

Fout 2: Ontbrekende tag twitter:card

Veel ontwikkelaars stellen alleen Open Graph-tags in en slaan Twitter Card-tags over. X/Twitter geeft de voorkeur aan twitter:card en geeft uw kaart mogelijk niet correct weer zonder deze kaart.

✗ Onvolledig

<meta property="og:image" content="https://yoursite.com/image.jpg" />

✓ Compleet

<meta property="og:image" content="https://yoursite.com/image.jpg" /> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:image" content="https://yoursite.com/image.jpg" />

Stel zowel og:image als twitter:image in voor volledige dekking. Zie onze Open Graph versus Twitter Card gids voor meer informatie.

Fout 3: Afbeelding te klein voor het platform

Elk platform heeft verschillende minimale afbeeldingsgroottes. Een afbeelding die werkt op Discord (minimaal 300×300) werkt mogelijk niet op LinkedIn (minimaal 1200×627).

Platform Minimum Recommended
X / Twitter800 × 4181200 × 628
LinkedIn1200 × 6271200 × 627
Discord300 × 3001200 × 630
WhatsApp300 × 1571200 × 630
Reddit120 × 1201200 × 628

Als u 1200 × 630 als standaardformaat gebruikt, dekt u alle platforms. Zie onze Open Graph Gids voor afbeeldingsgrootte voor het volledige overzicht.

Fout 4: Cache niet wissen na updates

U werkt uw OG-tags bij. Platforms tonen nog steeds de oude preview. Het probleem: platforms cachen OG-tags en halen deze niet automatisch opnieuw op.

Nadat u uw tags heeft bijgewerkt, moet u de cache van elk platform wissen:

Zie onze handleiding Cache wissen Open Graph Cache voor de volledige uitleg per platform.

Fout 5: Ontbrekende og:description of afgekapte tekst

Sommige ontwikkelaars stellen og:title en og:image in, maar slaan og:description over. Anderen schrijven beschrijvingen die te lang zijn en worden afgekapt.

Beste praktijken:

Fout 6: og:url niet ingesteld

Zonder og:url kunnen platforms de verkeerde URL in het voorbeeld gebruiken (bijvoorbeeld een URL met trackingparameters). Stel altijd de canonieke URL in:

✓ Juist

<meta property="og:url" content="https://yoursite.com/your-page" />

Fout 7: Verkeerd MIME-type afbeelding gebruiken

Als uw server de verkeerde Content-Type header voor uw afbeelding retourneert (bijvoorbeeld door een PNG weer te geven met image/jpeg), zullen sommige platforms deze weigeren. Zorg ervoor dat uw beeldserver het juiste MIME-type retourneert:

LinkedIn is vooral streng wat betreft de validatie van het MIME-type.

Fout 8: dynamische pagina's zonder unieke OG-tags

Als u een SPA- of dynamische site heeft waar elke pagina dezelfde OG-tags deelt (meestal de homepage-tags), zullen platforms voor elke pagina hetzelfde voorbeeld weergeven. Elke pagina heeft zijn eigen unieke titel, beschrijving en afbeelding nodig.

Gebruik in Next.js generateMetadata(). Gebruik in WordPress de instellingen voor Yoast/RankMath per pagina. In gewone HTML stelt u tags afzonderlijk in op elke pagina.

Controlelijst voor snelle reparatie

  1. Gebruik absolute URL's (https://...) voor alle og:image paden
  2. Stel zowel de tags og: als twitter: in
  3. Gebruik afbeeldingen van 1200×630 pixels voor universele compatibiliteit
  4. Wis platformcaches na het updaten van tags
  5. Stel unieke OG-tags in voor elke pagina
  6. Voeg og:description toe (150-160 tekens)
  7. Stel og:url in op de canonieke URL
  8. Controleer of het MIME-type overeenkomt met het werkelijke afbeeldingsformaat
  9. Test met Proovd om alle fouten in één keer te onderkennen

Veelgestelde vragen

Wat is de meest voorkomende Open Graph-fout?

Een relatieve URL gebruiken voor og:image in plaats van een absolute URL die begint met https://. Platforms kunnen geen relatieve URL's ophalen, dus de afbeelding zal nooit in het voorbeeld verschijnen.

Waarom werkt mijn OG-image op het ene platform en niet op het andere?

Elk platform heeft verschillende vereisten voor de afbeeldingsgrootte. LinkedIn vereist minimaal 1200x627, X vereist 800x418 en Discord accepteert minimaal 300x300. Een afbeelding die op het ene platform werkt, kan voor een ander platform te klein zijn.

Hoe controleer ik of mijn OG-tags fouten bevatten?

Gebruik Proovd om een ​​URL te plakken en precies te zien hoe deze op alle zes platforms tegelijk wordt weergegeven.

Controleer uw OG-tags op fouten

Gebruik Proovd — plak een URL en bekijk het voorbeeld op X, LinkedIn, Slack, Discord, WhatsApp en Reddit.