Skip to content
Search

Open Graph meta-tags: det du skal vide

En praktisk guide til Open Graph meta-tags: hvad de gør, nøgle-tags og eksempler, platform-fallbacks, testtrin og en checkliste til korrekte sociale previews.

Open Graph Meta Tags - What You Need to Know

Hvad Open Graph gør, og hvorfor det betyder noget

Open Graph meta-tags fortæller sociale platforme, hvilken titel, beskrivelse og billede de skal vise, når nogen deler en URL. Placeret i HTML head'en standardiserer disse tags, hvordan sider bliver vist i preview på tjenester, der understøtter protokollen. Når du sætter dem, styrer du de uddrag folk ser i feeds, private beskeder og chat-previews i stedet for at lade platformens heuristik vælge.

Et par tekniske noter, der påvirker implementering og fejlsøgning: Google bruger den mobile version af en side som sit primære grundlag for crawling og indeksering; since July 2024 Google crawls Search with Googlebot Smartphone by default. Facebook, Twitter/X og andre sociale scrapers kan hente en side med forskellige user-agents og cache-previews. Bemærk også, at Google fjernede traditionelle cached pages i begyndelsen af 2024, hvilket ikke ændrer, hvordan Open Graph fungerer, men påvirker, hvordan søgemaskiner viser ældre side-snapshots.

Vigtige Open Graph-tags og eksempel på markup

De centrale Open Graph-tags, du bør inkludere i head på hver delbar side, er og:title, og:description, og:image, og:url og og:type. Tilføj dem sammen med standard meta description og structured data; sociale crawlers læser kun head'en, så sørg for at de er fuldt renderede dér.

Eksempel på HTML (placer inde i <head>):

<meta property="og:title" content="Din sidetitel">
<meta property="og:description" content="Kort resumé, der supplerer titlen">
<meta property="og:image" content="https://yourdomain.com/wp-content/uploads/your-image.png">
<meta property="og:url" content="https://yourdomain.com/your-page">
<meta property="og:type" content="article">

Hvis du publicerer indhold programmatisk (CMS-templates eller server rendering), sørg for, at disse tags genereres server-side, så scrapers får dem uden at skulle stole på client-side JavaScript.

Platformforskelle og fallbacks

Open Graph er en bredt understøttet protokol, men hver platform anvender sine egne regler og fallbacks.

Fordi platforme cache previews forskelligt, bør du altid teste din side på de tjenester, du forventer, brugerne deler på. Brug platformernes debugværktøjer til at inspicere, hvad hver service ekstraherer, og til at rydde cachede snapshots, når du opdaterer metadata.

Retningslinjer for billeder og tilgængelighedsovervejelser

Visuelle elementer er det mest iøjnefaldende i en social preview. Sig efter billeder, der er store nok til at gengive skarpt på høj-DPI-enheder og visuelt centrerede for almindelige crop-forhold. En ofte brugt tilgang er at levere et billede i landskabsformat og inkludere eksplicit width/height-metadata hvor det understøttes (og:image:width og og:image:height), så scrapers kender dimensionerne uden at skulle downloade hele filen.

Tjek også disse praktiske punkter:

Eksempel: tjek billede-headere med en kommando som curl -I https://yourdomain.com/wp-content/uploads/your-image.png for at bekræfte 200-respons og Content-Type.

Sådan tester og fejlsøger du Open Graph

Når en preview ser forkert ud, følg en systematisk checkliste i stedet for at gætte. Start med det rå HTML head for at bekræfte, at tags findes, og tjek derefter, hvordan scrapers henter siden, og om proxies eller caches returnerer forældet indhold.

For sider, du ejer, er Google Search Console’s URL Inspection stadig nyttig til indeks- og mobilrenderingstjek, men den erstatter ikke de sociale platformes egne debuggers, når du diagnosticerer problemer med sociale previews.

Almindelige fejl og en hurtig implementeringscheckliste

Hurtig implementeringscheckliste:

Hvis du vil have en dybere teknisk gennemgang af, hvordan dine sider leveres og renderes, se Læs Technical SEO Guide for layout, rendering og server-side considerations.

FAQ: Hvad hvis en platform ignorerer mit og:image?

Platforme bruger deres egne heuristikker og caching. Bekræft, at image-URL'en returnerer 200-status og korrekt Content-Type, er stor nok og har et passende sideforhold, og ikke er blokeret af robots.txt. Brug platformens debugger til at se præcis, hvad scraperen ekstraherede, og for at tvinge en re-scrape.

FAQ: Kan jeg bruge forskellig tekst til Twitter/X og Facebook?

Ja. Twitter/X understøtter twitter:* tags for title, description og image. Hvis du har brug for en anden overskrift eller et andet billede på Twitter/X, inkludér både og:* og twitter:* tags — platformen vil foretrække sine egne tags, når de er til stede.

FAQ: Skal Open Graph-tags tilføjes for hver side?

Prioriter delbare sider: blogindlæg, landing pages og produkt-sider får typisk mest gavn. For site-wide sider (legal, admin) er fordelen mindre, men ufarlig. Hvis en side sandsynligvis ikke bliver delt, giver tags lidt værdi, men koster heller ikke meget.

FAQ: Påvirker Open Graph-tags SEO-rangeringer?

Open Graph-tags styrer sociale previews og ændrer ikke direkte, hvordan søgemaskiner rangerer sider. Bedre previews kan dog øge click-throughs fra sociale kanaler, hvilket indirekte kan påvirke brugerengagement-signaler. Hold forskellen mellem crawling, indeksering og rangering i mente: OG-tags påvirker, hvad sociale platforme viser, ikke søgemaskinernes indekseringsregler.

Related articles