SEO Branding

Optimer din brand synlighed i søgeresultater og social media med meta tags og Open Graph

Hvad er SEO Branding?

SEO branding handler om at kontrollere hvordan dit brand fremstår i søgeresultater, social media og andre platforme. Det inkluderer meta tags, Open Graph, Twitter Cards og mere.

Meta Tags

Title Tag

Den vigtigste meta tag - vises som overskrift i søgeresultater.

<title>Page Title | Brand Name</title>

<!-- Next.js -->
export const metadata = {
  title: 'Page Title | Brand Name',
}
Best practice: 50-60 tegn, inkluder brand og keyword

Meta Description

Beskrivelse der vises under title i søgeresultater.

<meta name="description" content="Compelling description..." />

<!-- Next.js -->
export const metadata = {
  description: 'Compelling description...',
}
Best practice: 150-160 tegn, handlingsopfordrende

Open Graph (Facebook)

Kontroller hvordan dine sider ser ud når de deles på Facebook, LinkedIn og andre sociale platforme.

<!-- Essential Open Graph tags -->
<meta property="og:title" content="Page Title" />
<meta property="og:description" content="Page description" />
<meta property="og:image" content="https://example.com/image.jpg" />
<meta property="og:url" content="https://example.com/page" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="Brand Name" />

<!-- Next.js -->
export const metadata = {
  openGraph: {
    title: 'Page Title',
    description: 'Page description',
    images: [{ url: 'https://example.com/image.jpg' }],
    url: 'https://example.com/page',
    type: 'website',
    siteName: 'Brand Name',
  },
}
OG Image: Anbefalet størrelse 1200x630px

Twitter Cards

Optimer hvordan links vises når de deles på Twitter/X.

<!-- Twitter Card tags -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Page Title" />
<meta name="twitter:description" content="Page description" />
<meta name="twitter:image" content="https://example.com/image.jpg" />
<meta name="twitter:site" content="@yourusername" />

<!-- Next.js -->
export const metadata = {
  twitter: {
    card: 'summary_large_image',
    title: 'Page Title',
    description: 'Page description',
    images: ['https://example.com/image.jpg'],
    site: '@yourusername',
  },
}
Card Types:
• summary - Lille billede (1:1)
• summary_large_image - Stort billede (2:1)

Favicon & App Icons

<!-- Favicon -->
<link rel="icon" href="/favicon.ico" sizes="any" />
<link rel="icon" href="/icon.svg" type="image/svg+xml" />
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />

<!-- Next.js (app/icon.png or app/icon.svg) -->
// Next.js genererer automatisk favicon fra:
// - app/icon.png
// - app/icon.svg
// - app/apple-icon.png

Komplet Eksempel (Next.js)

// app/layout.tsx eller app/page.tsx
export const metadata = {
  metadataBase: new URL('https://example.com'),
  title: {
    default: 'Brand Name - Tagline',
    template: '%s | Brand Name',
  },
  description: 'Compelling brand description...',
  keywords: ['keyword1', 'keyword2', 'keyword3'],
  authors: [{ name: 'Brand Name' }],

  openGraph: {
    type: 'website',
    locale: 'da_DK',
    url: 'https://example.com',
    siteName: 'Brand Name',
    title: 'Brand Name - Tagline',
    description: 'Compelling brand description...',
    images: [{
      url: '/og-image.jpg',
      width: 1200,
      height: 630,
      alt: 'Brand Name',
    }],
  },

  twitter: {
    card: 'summary_large_image',
    title: 'Brand Name - Tagline',
    description: 'Compelling brand description...',
    images: ['/og-image.jpg'],
    site: '@yourusername',
  },

  robots: {
    index: true,
    follow: true,
    googleBot: {
      index: true,
      follow: true,
      'max-image-preview': 'large',
      'max-snippet': -1,
    },
  },
}

Avancerede Meta Tags

Viewport & Mobile

<!-- Essential for responsive design -->
<meta name="viewport" content="width=device-width, initial-scale=1" />

<!-- Next.js (automatisk inkluderet) -->
// Next.js tilføjer viewport automatisk

Theme Color

Kontrollér browser UI farve på mobile devices

<meta name="theme-color" content="#1E40AF" />

<!-- Next.js -->
export const metadata = {
  themeColor: '#1E40AF',
}

Canonical URL (igen!)

Canonical er også en del af SEO branding - det sikrer korrekt URL vises

<link rel="canonical" href="https://example.com/page" />

<!-- Next.js -->
export const metadata = {
  alternates: {
    canonical: 'https://example.com/page',
  },
}

Language & Locale

<html lang="da">

<!-- Open Graph locale -->
<meta property="og:locale" content="da_DK" />
<meta property="og:locale:alternate" content="en_US" />

<!-- Next.js -->
export const metadata = {
  openGraph: {
    locale: 'da_DK',
  },
}

Brand Consistency på Tværs af Platforme

Hvorfor er konsistens vigtig?

Når brugere deler dine links på Facebook, Twitter, LinkedIn eller andre platforme, skal dit brand se professionelt og konsistent ud. Dårlige eller manglende metadata kan skade tilliden og reducere click-through rates.

✅ Med korrekt metadata:

  • • Professionelt og indbydende preview
  • • Dit brand logo tydeligt synligt
  • • Beskrivende title og description
  • • Højere click-through rate

❌ Uden metadata:

  • • Generisk eller manglende billede
  • • URL som titel
  • • Ingen description
  • • Lavere engagement

Best Practices for Brand Metadata:

1. Konsistent Brand Name

Brug samme brand name format overalt: "Titel | Brand Name" eller "Brand Name - Titel"

2. High-Quality Images

OG images skal være 1200x630px (1.91:1 ratio). Undgå tekst der bliver for lille.

Tip: Brug tools som Canva til at designe branded OG images med logo og key messaging

3. Action-Oriented Descriptions

Meta descriptions skal ikke bare beskrive - de skal overtale brugeren til at klikke. Brug action verbs og clear value proposition.

Real-World Eksempler

E-commerce Produktside

export const metadata = {
  title: 'iPhone 15 Pro - 128GB Sort | TechShop.dk',
  description: 'Køb iPhone 15 Pro med titanium design. Gratis fragt. 30 dages returret. På lager - leveres i morgen.',

  openGraph: {
    title: 'iPhone 15 Pro - 128GB Sort',
    description: 'Titanium design, A17 Pro chip, ProMotion display. Kun 10.499 kr med gratis fragt.',
    images: [{
      url: '/products/iphone-15-pro-black.jpg',
      width: 1200,
      height: 630,
      alt: 'iPhone 15 Pro i sort titanium',
    }],
    type: 'product',
    siteName: 'TechShop.dk',
  },

  twitter: {
    card: 'summary_large_image',
    title: 'iPhone 15 Pro - 128GB Sort',
    description: 'Titanium design, A17 Pro chip. Gratis fragt.',
    images: ['/products/iphone-15-pro-black.jpg'],
  },
}

Blog Artikel

export const metadata = {
  title: '10 SEO Tips der Virker i 2025 | MarketingBlog.dk',
  description: 'Opdateret guide til moderne SEO. Lær Core Web Vitals, AI-optimering, E-E-A-T og mere. Med screenshots og eksempler.',

  openGraph: {
    title: '10 SEO Tips der Faktisk Virker i 2025',
    description: 'Nye Google updates betyder nye SEO strategier. Her er hvad der virker nu.',
    images: [{
      url: '/blog/seo-tips-2025-og-image.jpg',
      width: 1200,
      height: 630,
      alt: 'SEO Tips 2025 infographic',
    }],
    type: 'article',
    publishedTime: '2025-01-15T08:00:00Z',
    authors: ['Jane Doe'],
    section: 'SEO',
  },

  twitter: {
    card: 'summary_large_image',
    site: '@marketingblog',
    creator: '@janedoe',
  },
}

Local Business

export const metadata = {
  title: 'Café Hygge København - Økologisk Kaffe & Brunch',
  description: 'Besøg Københavns hyggeligste café. Økologisk kaffe, hjemmelavet brunch, glutenfri options. Book bord online.',

  openGraph: {
    title: 'Café Hygge - Din Nye Favorit Café i København',
    description: 'Økologisk kaffe, award-winning brunch, vintage interiør. Vi ses på Nørrebro! ☕',
    images: [{
      url: '/cafe-hygge-interior.jpg',
      width: 1200,
      height: 630,
      alt: 'Hyggeligt interiør på Café Hygge',
    }],
    type: 'business.business',
    locale: 'da_DK',
    siteName: 'Café Hygge',
  },
}

Almindelige Fejl at Undgå

❌ For Lang Title

Titles over 60 tegn bliver afskåret i søgeresultater. OG titles kan være lidt længere (~70).

Løsning: Hold titles under 60 tegn. Placer vigtigste keywords først.

❌ Manglende Alt Text på OG Image

Mange glemmer alt text på Open Graph billeder - dårligt for accessibility.

Løsning: Inkluder altid beskrivende alt text for alle billeder.

❌ Relative URLs i OG Tags

Brug af relative URLs (/image.jpg) i stedet for absolute URLs i OG image tags.

Løsning: Brug altid fulde absolute URLs: https://example.com/image.jpg

❌ Duplicate Title og OG Title

Nøjagtig samme title i både <title> og og:title - missed opportunity.

Løsning: OG title kan være mere engaging/clickbait-y end SEO title.

❌ Forkerte Image Dimensioner

OG images i forkert størrelse bliver cropped forkert eller ser pixelated ud.

Løsning: Brug præcis 1200x630px for OG images. Test med debugger tools.

❌ Manglende Cache Busting

Facebook/Twitter cacher OG images aggressivt - ændringer vises ikke med det samme.

Løsning: Brug Facebook Debugger til at scrape URL igen, eller add version parameter til image URL.

Testing & Validation Tools

🔵 Facebook Sharing Debugger

Test hvordan dine sider ser ud på Facebook og scrape cache igen.

developers.facebook.com/tools/debug →

Brug "Scrape Again" knappen hvis du har opdateret metadata

🐦 Twitter Card Validator

Valider Twitter Cards og se live preview af hvordan tweets ser ud.

cards-dev.twitter.com/validator →

💼 LinkedIn Post Inspector

Test hvordan dine links vises når de deles på LinkedIn.

linkedin.com/post-inspector →

📱 WhatsApp Link Preview

WhatsApp bruger OG tags - test ved at sende link til dig selv.

Ingen officiel tool, men WhatsApp respekterer OG metadata

🔍 Meta Tags Analyzer

Browser extensions som "META SEO Inspector" viser alle meta tags.

Tilgængelig for Chrome og Firefox

🛠️ View Page Source

Den simpleste måde: højreklik → View Page Source → Søg efter "og:"

Virker altid og kræver ingen tools

Avancerede Tips & Tricks

💡 Dynamic OG Images

Generér unikke OG images for hver side dynamisk med page title overlayed.

Tools til dynamic OG image generation:

  • • Vercel OG Image Generation (@vercel/og)
  • • Cloudinary Dynamic Images
  • • Canvas API (server-side rendering)

🎯 A/B Test Meta Descriptions

Test forskellige meta descriptions for at se hvilke har bedst CTR i Search Console.

Search Console → Performance → Se CTR per page → Optimér low CTR pages

📊 Track Social Shares

Tilføj UTM parameters til dine OG URLs for at tracke social media traffic.

og:url = "https://example.com/page?utm_source=facebook&utm_medium=social"

SEO Branding Checklist

Brug denne checklist til at sikre optimal brand synlighed: