Boost dine sociale medier med Meta Tags

Udgivet: November 04, 2020
Senest opdateret: March 19, 2024

Estimeret læsetid: 3 minutter

Sådan kan du forbedre din hjemmesides delingsmuligheder på de sociale medier:

1) Open Graph (OG) og Meta Tags

Dette er kode-bidder, der styrer, hvordan hjemmesidens URL'er vises, når de deles på Facebook. Men disse bruges også på andre platforme som LinkedIn og Twitter, når der ikke registreres nogen Twitter Markup Tags (mere om dette senere).

(Figur 1: Open Graph koder brugt på 1902 Softwares timepriser).

Facebook lister 17 OG tags, men kun fire er de mest basale Meta Tags, som du skal bruge:

  • og:image – indsæt URL til det billede, der repræsenterer sidens indhold.
  • og:url – repræsenterer URL'en til et unikt billede, der repræsenterer sidens indhold.
  • og:title – repræsenterer titlen på siden. Det bør ikke indeholde "branding" som fx din hjemmesides navn.
  • og:description – indsæt en kort beskrivelse af sidens indhold, typisk mellem to og fire sætninger.

Facebook har oprettet Sharing Debugger værktøjet for at kontrollere, om der er er fejl og forslag til OG-tags . Det viser også, hvordan og:image ser ud, den anvendte titel og beskrivelse osv.

(Figur 2: Afsnittet 'Link Preview' viser, hvordan https://1902software.dk/priser/
vises ved deling på Facebook).

2) Twitter Card Markup Tags

Disse fungerer på samme måde som Open Graph Meta Tags. Disse tags styrer fx forhåndsvisningen af din hjemmesides links, når de deles på Twitter.

(Figur 3: Twitter Card Markup Tags, der bruges på 1902 Softwares timepriser).

Der er forskellige Card-typer at vælge imellem, og hver type understøtter og kræver et specifikt sæt egenskaber. I eksemplet ovenfor brugte vi Card-typen 'Summary', og her er de anvendte egenskaber:

  • twitter:card – repræsenterer Card-typen. I dette tilfælde brugte vi 'Summary'.
  • twitter:image – repræsenterer URL'en til et unikt billede, der repræsenterer sidens indhold. Generiske billeder som f.eks. hjemmesidens logo eller forfatterfoto bør ikke bruges.
  • twitter:title – repræsenterer titlen på hjemmesiden.
  • twitter:description – indsæt en beskrivelse, der opsummerer hjemmesidens indhold. Genbrug ikke titlen som beskrivelse.

Ligesom Facebook har Twitter også et Card Validator Tool, som kan bruges til at teste, om der er fejl på de implementerede Markup Tags. Fra august 2022 blev Twitter-kortpreviewet flyttet til Twitter composer. Hvis du vil tjekke Twitter-kortpreviewet, kan du se det direkte på Twitter composer, når du poster dit tweet. Du kan stadig bruge kortvalideringsværktøjets logsektion til fejlfinding.

(Figur 4: 'Log'-sektionen viser metatag-informationen, der er fundet på siden https://1902software.dk/priser/)

AUTHOR

Peter Skouhus

Peter Skouhus

En dansk iværksætter, der ejer 1902 Software Development, et it-selskab på Filippinerne, hvor han har boet siden 1998. Peter har stor erfaring inden for IT-udvikling, strategisk it-ledelse og salg.