Open Graph (OG) tags zijn HTML-meta-tags die bepalen welke titel, beschrijving, afbeelding, URL en contenttype worden weergegeven wanneer een webpagina wordt gedeeld op sociale media. Simpel gezegd geven OG-tags je de controle over hoe jouw website eruitziet op platforms als Facebook, LinkedIn, WhatsApp, X en andere; correct toegepast verhogen ze het aantal kliks, versterken ze je merk en voorkomen ze verkeerde afbeeldingen of ontbrekende teksten bij het delen.
Wanneer je een blogartikel, productpagina of bedrijfsdienst deelt op sociale media, scannen de platforms meestal automatisch je pagina en genereren ze een previewkaart. Als er geen Open Graph-data zijn ingesteld, kunnen sociale netwerken willekeurig een afbeelding kiezen, een verouderde titel tonen of zelfs een lege omschrijving weergeven. Dit kan vooral bij campagnepagina’s, e-commerce producten, nieuwsartikelen en corporate sites die merkbekendheid willen vergroten tot flinke performance-verliezen leiden.
In deze gids van het Hostragons blog leggen we uit wat Open Graph tags precies zijn, welke OG-tags je absoluut moet gebruiken, hoe je ze toevoegt in WordPress en custom software, welke ideale afbeeldingsformaten gelden, welke testtools je kunt gebruiken en welke veelgemaakte fouten je moet vermijden. Daarnaast behandelen we ook hoe hosting, SSL en domeinconfiguratie indirect invloed hebben op de kwaliteit van social media previews. Webhosting Domeinsopzoeking SSL certificaat
Wat is het Open Graph Protocol?
Het Open Graph-protocol is een metadata-standaard die oorspronkelijk door Facebook is ontwikkeld. Het doel is om webpagina’s als rijke kaarten (rich cards) weer te geven op sociale media. De OG-tags in de HTML-broncode van een pagina geven sociale netwerken antwoord op vragen als: Wat is de titel van deze pagina? Wat is de omschrijving? Welke afbeelding moet worden gebruikt? Wat is de URL? En om wat voor soort content gaat het: artikel, product, video?
Tegenwoordig beperkt Open Graph zich niet alleen tot Facebook. LinkedIn, WhatsApp, Telegram, Slack en vele andere chatapps lezen OG-gegevens om een preview van links te genereren. X (voorheen Twitter) ondersteunt ook eigen Twitter Card-tags, maar maakt vaak ook gebruik van OG-tags. Daarom vormt een goede Open Graph-configuratie een belangrijke brug tussen technische SEO, social media optimalisatie en gebruikerservaring op moderne websites.
OG-tags worden niet direct door Google als rankingfactor gezien; alleen het toevoegen van OG-tags verbetert je organische positie dus niet automatisch. Maar als je link er op sociale media duidelijker, professioneler en aantrekkelijker uitziet, kan dat wel leiden tot meer verkeer, meer shares en een sterkere merkbeleving. OG-tags dragen dus indirect bij aan je digitale zichtbaarheid.
Waarom zijn Open Graph-tags zo belangrijk?
Gebruikers op sociale media beslissen binnen enkele seconden of ze op een link klikken. De belangrijkste factoren die die beslissing beïnvloeden zijn: titel, afbeelding, omschrijving en een betrouwbaar ogenschijnlijk domein. OG-tags maken het mogelijk om deze vier elementen precies te sturen. Vooral op mobiele apparaten is de linkkaart vaak de eerste – en soms enige – indruk die een gebruiker van je pagina krijgt.
- Verhoogt het doorklikpercentage: Een duidelijke titel en aansprekende afbeelding vallen meer op in een social media feed.
- Waarborgt merkconsistentie: Elke keer de juiste logo’s, kleuren, omschrijvingen en URL’s tonen.
- Voorkomt verkeerde afbeeldingen: Zo voorkom je dat platforms een willekeurige afbeelding kiezen.
- Verbeterde deelervaring: Professionele kaarten verschijnen op WhatsApp, LinkedIn, Facebook en andere platformen.
- Ondersteunt campagneprestaties: Op product-, kortings- en aankondigingspagina’s komt je boodschap duidelijk over.
Stel je een hostingcampagnepagina voor. Als je OG-afbeelding de campagne naam, kortingspercentage en merkaccenten bevat, begrijpt de gebruiker meteen waar het over gaat. Zonder OG-tag kiest het systeem misschien een klein icoontje of een ongerelateerde banner, wat vertrouwen en klikbereidheid vermindert. Bij campagnepagina’s zijn ook een betrouwbare hostingomgeving, snelle serverrespons en HTTPS essentieel. WordPress hosting Zakelijk Hosting
Essentiële OG-tags die je altijd moet gebruiken
Elke website heeft z’n eigen behoeften, maar bij een basis Open Graph-configuratie zijn een aantal tags praktisch onmisbaar. Zij vormen de minimale set die sociale platformen nodig hebben om je link correct te interpreteren.
og:title
og:title bepaalt de titel die op sociale media wordt weergegeven. Dit hoeft niet exact gelijk te zijn aan de SEO-titel van de pagina. Voor sociale media kun je een kortere, duidelijkere en klikstimulerende titel schrijven. Meestal wordt een lengte tussen 40 en 60 tekens als veilig gezien. Te lange titels worden op mobiel vaak afgekapt.
Voorbeeld: <meta property='og:title' content='Open Graph Tags voor een Professionele Social Media Weergave'>
og:description
og:description is de korte omschrijving in de linkkaart. Deze moet de gebruiker helder vertellen wat hij op de pagina kan vinden. Een lengte van 120 tot 160 tekens is ideaal voor de meeste platformen. De tekst moet informatief en nieuwsgierigheid opwekken, zonder overdreven reclameachtig te zijn.
Voorbeeld: <meta property='og:description' content='Beheer titel, afbeelding en omschrijving met OG-tags voor professionele social media shares.'>
og:image
og:image is de URL van de afbeelding die wordt getoond bij het delen. Deze tag heeft een grote invloed op de social media prestaties. De afbeelding moet een volledige URL bevatten, via HTTPS bereikbaar zijn en niet geblokkeerd worden. Het formaat 1200 x 630 pixels is een gangbare en veilige standaard voor horizontale social cards. Houd de bestandsgrootte bij voorkeur tussen 300 KB en 1 MB voor snelle laadtijden.
Voorbeeld: <meta property='og:image' content='https://voorbeeldsite.nl/afbeeldingen/open-graph-gids.jpg'>
og:url
og:url geeft het canonieke sociale deeladres van de content aan. De URL mag geen trackingcodes of sessieparameters bevatten. Als dezelfde content via meerdere URL’s bereikbaar is, helpt het OG-url de voorkeurslink duidelijk te maken en voorkomt het dat deelstatistieken verspreid raken.
og:type
og:type beschrijft het type content. Voor blogs gebruik je ‘article’, voor homepagina’s ‘website’, voor productpagina’s ‘product’. Dit helpt platformen om je content juist te categoriseren.
og:site_name en og:locale
og:site_name toont de merk- of sitenaam. og:locale geeft taal- en regiogegevens aan. Voor Nederlandstalige sites is ‘nl_NL’ een gangbare waarde. Bij meertalige websites is het belangrijk om voor elke taalvariant de juiste locale te definiëren.
Overzichtstabel van Belangrijke OG-tags
| Tag | Functie | Aanbevolen Gebruik |
|---|---|---|
| og:title | Stelt de titel in voor de social card. | 40-60 tekens, helder en passend bij de pagina. |
| og:description | Geeft een korte omschrijving van de link. | 120-160 tekens, informatief en niet overdreven. |
| og:image | Definieert de afbeelding voor de share. | 1200 x 630 px, HTTPS, snel ladend bestand. |
| og:url | Geeft de hoofd-URL voor delen aan. | Canonieke, schone en parameterloze URL. |
| og:type | Beschrijft het contenttype. | article, website, product, etc. |
| og:site_name | Toont de merk- of sitenaam. | Consistente merknaam gebruiken. |
| og:locale | Geeft taal- en regio-informatie. | nl_NL voor Nederlandstalige sites. |
Verschil tussen Open Graph en Twitter Card
Open Graph-tags worden door veel sociale netwerken gebruikt, terwijl Twitter Card-tags specifiek zijn ontwikkeld voor previews op het X-platform. De twee systemen lijken op elkaar, maar verschillen in naamgeving en enkele functionaliteiten. Het beste is om op je pagina zowel OG- als Twitter Card-tags te implementeren, zodat je content op alle platformen consistent en optimaal wordt weergegeven.
| Kenmerk | Open Graph | Twitter-kaart |
|---|---|---|
| Hoofdgebruik | Facebook, LinkedIn, WhatsApp, Slack en vele anderen | X-platform |
| Titel-tag | og:title | twitter:title |
| Omschrijving-tag | og:description | twitter:description |
| Afbeelding-tag | og:image | twitter:image |
| Kaarttype | og:type | twitter:card (summary, summary_large_image) |
In de praktijk is het aan te raden om bij een blogartikel na het instellen van OG-tags ook twitter:card op ‘summary_large_image’ te zetten. Zo krijg je een grote afbeelding in de preview en val je beter op in mobiele feeds.
Hoe voeg je Open Graph-tags toe?
OG-tags worden in de <head>-sectie van de HTML-code geplaatst. Ze zijn dus niet zichtbaar voor de bezoeker, maar worden uitgelezen door browsers en social media bots. De manier van toevoegen hangt af van je websiteplatform.
1. OG-tags toevoegen in WordPress
Gebruik je WordPress, dan kun je OG-tags beheren zonder zelf code te schrijven. SEO-plugins zoals Yoast SEO, Rank Math of All in One SEO bieden mogelijkheden om per bericht of pagina social media titels, omschrijvingen en afbeeldingen in te stellen.
- Installeer en activeer je SEO-plugin.
- Open het bericht of de pagina in de editor.
- Ga naar het tabblad voor social media of ‘Sociaal’.
- Voer een titel, omschrijving en afbeelding in voor Facebook/LinkedIn.
- Upload een afbeelding van 1200 x 630 px.
- Update de pagina en controleer de preview met een testtool.
Prestaties zijn ook belangrijk: als social bots je site niet kunnen bereiken of de server traag reageert, kan de preview niet goed geladen worden. Gebruik daarom een snelle en betrouwbare WordPress-hostingomgeving. WordPress hosting LiteSpeed Hosting
2. OG-tags toevoegen in custom software of statische sites
Werk je met custom software zoals Laravel, Next.js, Nuxt, of een statische sitegenerator, dan definieer je OG-tags meestal in je templates. Voor blogs en productpagina’s haal je de titel, omschrijving en afbeelding dynamisch uit de database.
Een simpel voorbeeld: <meta property='og:title' content='Paginatitel'> <meta property='og:description' content='Pagina-omschrijving'> <meta property='og:image' content='https://site.nl/og-afbeelding.jpg'> <meta property='og:url' content='https://site.nl/pagina'> <meta property='og:type' content='article'>
Een veelgemaakte fout is dat voor alle pagina’s dezelfde OG-titel en afbeelding worden gebruikt, wat vooral bij grote webshops met honderden producten de social sharing prestaties schaadt. Elke belangrijke pagina moet unieke OG-data hebben die bij de content past.
3. OG-tags voor productpagina’s in e-commerce
Op productpagina’s zet je de productnaam in og:title, een korte productvoordeel in og:description en een hoge kwaliteit productfoto in og:image. Vermijd misleidende campagne-teksten bij uitverkochte producten. Bij productvariaties kun je de canonieke URL van het hoofdproduct gebruiken als og:url.
Wanneer een productpagina gedeeld wordt, moet de gebruiker in één oogopslag het productbeeld, de prijsvoordelen of de belangrijkste eigenschappen kunnen herkennen. Gebruik geen overdreven verkooppraatjes in de omschrijving, maar vertel helder wat het product biedt.
Ideale afmetingen en bestandsvoorschriften voor Open Graph-afbeeldingen
De OG-afbeelding is het meest opvallende onderdeel van de previewkaart. Lage resolutie, afgesneden of onleesbare afbeeldingen zorgen voor een onprofessionele indruk. In 2024 is 1200 x 630 pixels nog steeds de veiligste algemene maat. Dit komt neer op een verhouding van ongeveer 1.91:1 en werkt goed op Facebook, LinkedIn en veel andere platforms.
- Aanbevolen maat: 1200 x 630 px.
- Minimale maat: 600 x 315 px, maar hoger is beter voor kwaliteit.
- Bestandsformaat: JPG of PNG worden breed ondersteund; WebP kan problemen geven op sommige platforms.
- Bestandsgrootte: Bij voorkeur onder 1 MB houden.
- URL: Gebruik altijd een absolute URL, geen relatieve paden.
- HTTPS: De afbeelding moet via een beveiligde verbinding bereikbaar zijn.
Plaats belangrijke tekst niet te dicht bij de randen, omdat sommige platforms de kaart kunnen bijsnijden. Houd logo, titel en hoofdboodschap centraal. Unieke OG-afbeeldingen per artikel of product verminderen het gevoel van herhaling in social feeds.
OG-tags testen en cacheproblemen oplossen
Na het toevoegen van OG-tags is testen essentieel. Sociale platforms cachen pagina’s, dus als er een foutieve afbeelding of omschrijving is opgehaald, kan het zijn dat die nog even blijft hangen ondanks wijzigingen.
Handige testtools
- Facebook Sharing Debugger: Hiermee controleer je de OG-tags, forceer je een hernieuwde scan en vernieuw je de cache.
- LinkedIn Post Inspector: Voor het controleren van LinkedIn preview-kaarten.
- Twitter Card Validator: Controleert of je Twitter Card correct werkt op X.
- WhatsApp-test: Stuur de link naar jezelf om de mobiele preview te bekijken.
Krijg je foutmeldingen zoals 404, 403, SSL-waarschuwingen of beperkingen in robots.txt? Dan kunnen social bots je pagina niet bereiken. Controleer dan je hostingbeveiliging, CDN-instellingen en firewallregels. Een correct en veilig SSL-certificaat is cruciaal voor toegang tot afbeeldingen en pagina’s door social media bots. SSL certificaat Wat is CDN 403 Verboden Fout Oplossing
Veelvoorkomende fouten bij Open Graph-implementatie
Kleine fouten in OG-tags kunnen grote impact hebben op de weergave. De volgende punten komen regelmatig voor bij technische SEO-audits:
- Gebruik van relatieve afbeeldingspaden: Gebruik altijd een volledige URL zoals https://site.nl/images/og.jpg.
- Afbeeldingen zijn niet toegankelijk: Hotlinkbescherming, firewall of verkeerde bestandsrechten kunnen bots blokkeren.
- Zelfde OG-content op alle pagina’s: Unieke titels en omschrijvingen zijn cruciaal voor blogs, producten en diensten.
- Te lange titels: Worden op mobiele previews afgekapt en verliezen impact.
- Geen HTTPS: Kan leiden tot beveiligingswaarschuwingen en laadtijdproblemen.
- Cache niet geleegd: Sociale netwerken blijven oude previews tonen.
- Inconsistentie tussen canonieke URL en og:url: Versnipperde deelstatistieken door verschillende URL’s.
Bijvoorbeeld: je hebt de uitgelichte afbeelding van je blog gewijzigd, maar WhatsApp toont nog steeds de oude afbeelding. Controleer eerst of het og:image-tag in de broncode correct is aangepast. Gebruik daarna de Facebook Sharing Debugger of een ander platform om de URL opnieuw te laten scannen. Als het probleem blijft, verwijder dan ook de CDN- en servercache.
Hoe beoordeel je Open Graph-tags vanuit SEO-oogpunt?
OG-tags zijn geen klassieke on-page SEO-tags zoals title, meta description, canonical of structured data: ze bepalen niet direct je positie in zoekresultaten. Wel is het in 2024 essentieel om SEO in bredere zin te zien, waarbij gebruikersgedrag, merktrouw, contentdistributie en multi-channel zichtbaarheid samenkomen. Content die er op sociale media goed uitziet, kan meer clicks, shares en conversies opleveren.
Met de opkomst van Google AI Overviews en rijke zoekresultaten moet content niet alleen voor zoekmachinebots, maar ook voor diverse content preview-systemen begrijpelijk zijn. Daarom zijn OG-tags een integraal onderdeel van moderne technische SEO-checklists.
Schrijf je SEO-title en og:title zo dat ze hetzelfde doel dienen: de SEO-title concurreert in zoekresultaten, de og:title valt op in social media feeds. Zorg dat ze elkaar niet tegenspreken, de gebruiker niet misleiden, en de pagina-inhoud accuraat weergeven. Hetzelfde geldt voor meta description en og:description, die per platform geoptimaliseerd kunnen verschillen.
Stapsgewijze Open Graph checklist
Gebruik deze checklist voordat je een nieuwe pagina live zet. Handig voor bureaus, contentteams en websitebeheerders om een consistent publicatieproces te borgen.
- Heeft de pagina een unieke og:title?
- Beschrijft og:description de pagina correct en bondig?
- Is og:image 1200 x 630 px en van goede kwaliteit?
- Is de afbeelding via HTTPS voor iedereen bereikbaar?
- Komt og:url overeen met de canonieke URL?
- Is og:type correct gekozen op basis van contenttype?
- Is og:locale ingesteld op nl_NL bij Nederlandstalige pagina’s?
- Heb je preview’s getest op Facebook, LinkedIn en WhatsApp?
- Is cache en CDN recent geleegd?
- Is de mobiele weergave gecontroleerd op titel- en afbeelding-bijsnijdingen?
Met deze lijst houd je je social media weergave consistent voor blogs, producten, campagnes en belangrijke bedrijfspagina’s. Bovendien versnelt het de interne kwaliteitscontrole.
Invloed van hosting, SSL en domeinnaam op OG-weergave
Hoewel OG-tags in de HTML staan, is een betrouwbare webinfrastructuur cruciaal voor een correcte werking. Social media bots moeten je pagina snel en foutloos kunnen laden. Als de server vaak time-outs geeft, het SSL-certificaat fout is of afbeeldingen geblokkeerd worden met 403-fouten, dan kan de preview onvolledig zijn.
Een kort, herkenbaar en merkconform domein draagt bij aan vertrouwen in de social share. SSL-certificaten zijn inmiddels standaard en essentieel voor zowel gebruikersvertrouwen als platformcompatibiliteit. Bij het opzetten van een nieuwe site loont het om domeinnaam, hosting en SSL meteen goed te regelen. Zo voorkom je later problemen met social shares en SEO. Domeinsopzoeking Webhosting SSL certificaat
Conclusie: Open Graph-tags zijn klein, maar hun impact is groot
Open Graph (OG) tags zijn essentiële meta-gegevens waarmee je bepaalt hoe je website wordt weergegeven op sociale media. Door de juiste titel, omschrijving, afbeelding en URL te gebruiken, maak je je links betrouwbaarder, duidelijker en aantrekkelijker om op te klikken. Deze optimalisatie garandeert geen hogere zoekmachineposities, maar ondersteunt je social traffic, merkbeleving en contentdistributie sterk.
Controleer OG-tags bij elke nieuwe publicatie, zorg voor goede afbeeldingsformaten en test previews grondig. Met snelle hosting, een betrouwbaar SSL-certificaat en een passend domein zorg je ervoor dat je social media kaarten soepel werken. Bekijk gerust de oplossingen van Hostragons om een solide basis te leggen voor je site, en maak OG-controle onderdeel van je reguliere publicatieproces.
Veelgestelde vragen
Wat doen Open Graph (OG) tags precies?
Open Graph (OG) tags bepalen welke titel, omschrijving, afbeelding en URL worden weergegeven wanneer een webpagina op sociale media wordt gedeeld. Zo zien links er professioneel en consistent uit.
Beïnvloeden OG-tags direct de SEO-ranking?
OG-tags zijn geen directe rankingfactor voor Google. Ze kunnen echter indirect bijdragen aan betere SEO door meer klikken, shares en meer vertrouwen via social media.
Wat is de ideale grootte voor een Open Graph-afbeelding?
De veiligste standaard is 1200 x 630 pixels. De afbeelding moet via HTTPS bereikbaar zijn, van goede kwaliteit en liefst onder 1 MB groot.
Hoe voeg ik OG-tags toe in WordPress?
Met plugins als Yoast SEO, Rank Math of All in One SEO kun je per pagina of bericht eenvoudig social media titels, omschrijvingen en afbeeldingen instellen.
Wat te doen als WhatsApp de verkeerde afbeelding toont?
Controleer eerst of de og:image-tag in de broncode correct is. Maak daarna de cache en CDN leeg, laat de URL opnieuw scannen via Facebook Sharing Debugger en test opnieuw.