Alle eksempler/examples/rdfa-basics

RDFa Grundlæggende

RDFaMellem

Introduktion til RDFa markup med Article eksempel

Kodeeditor der viser React-kildekode
Foto: Juanjo Jaramillo / Unsplash
Beskrivelse

Om dette eksempel

Lær hvordan man bruger RDFa (Resource Description Framework in Attributes) til at embedde struktureret data i HTML. RDFa bruger attributter som vocab, typeof og property til at annotere eksisterende HTML elementer. Dette format er særligt populært i publishing og news websites.

Markup

Kodeeksempel

rdfa-basics.htmlRDFa
<!DOCTYPE html>
<html lang="da" vocab="https://schema.org/">
<head>
  <meta charset="UTF-8">
  <title>Fremtidens Kunstig Intelligens i Sundhedssektoren</title>
</head>
<body>
  <article typeof="Article">
    <header>
      <h1 property="headline">
        Fremtidens Kunstig Intelligens i Sundhedssektoren
      </h1>
      
      <p property="description">
        En dybdegående analyse af hvordan AI revolutionerer 
        diagnosticering og patientbehandling i moderne hospitaler.
      </p>
      
      <div property="author" typeof="Person">
        <img property="image" src="/authors/maria-jensen.jpg" 
             alt="Maria Jensen">
        Af <span property="name">Maria Jensen</span>,
        <span property="jobTitle">Senior Sundhedsjournalist</span>
        <meta property="email" content="maria.jensen@example.com">
      </div>
      
      <time property="datePublished" datetime="2025-10-15T09:00:00+02:00">
        15. oktober 2025
      </time>
      
      <time property="dateModified" datetime="2025-10-20T14:30:00+02:00">
        Opdateret: 20. oktober 2025
      </time>
    </header>
    
    <div property="publisher" typeof="Organization">
      <meta property="name" content="HealthTech News Danmark">
      <div property="logo" typeof="ImageObject">
        <meta property="url" content="https://www.example.com/logo.png">
        <meta property="width" content="600">
        <meta property="height" content="60">
      </div>
    </div>
    
    <img property="image" src="/articles/ai-healthcare-2025.jpg" 
         alt="AI teknologi i hospitaler">
    
    <div property="articleBody">
      <p>
        Kunstig intelligens transformerer sundhedssektoren med 
        hidtil usete hastigheder. Machine learning algoritmer kan 
        nu diagnosticere visse sygdomme med højere præcision end 
        erfarne læger.
      </p>
      <p>
        I Danmark har flere hospitaler implementeret AI-baserede 
        systemer til tidlig detektion af kræft og hjertesygdomme...
      </p>
    </div>
    
    <meta property="wordCount" content="1847">
    <meta property="inLanguage" content="da">
    
    <div property="about" typeof="Thing">
      <meta property="name" content="Kunstig Intelligens i Sundhed">
    </div>
  </article>
</body>
</html>
Validér altid, før du sender live
Gennemgang

Forklaring

Dette eksempel viser hvordan RDFa bruges til at markere en nyhedsartikel. vocab attributten i html tagget definerer Schema.org som default vokabular. typeof specificerer schema typen (Article), mens property attributter markerer individuelle egenskaber. RDFa gør det muligt at neste objekter naturligt i HTML strukturen, som vist med author (Person) og publisher (Organization). Time tags bruges til datoer med machine-readable datetime attributter.

Anvendelse

Use cases

  • News websites og online magasiner der publicerer artikler dagligt
  • Blogs og content platforms der vil have rich snippets i søgeresultater
  • Educational content der skal vises med author og publication info
  • Websites bygget på Drupal eller andre CMS'er med RDFa support
  • Artikler der skal deles på sociale medier med korrekte metadata
  • Content der skal indekseres af Google News og andre news aggregators
Praksis

Best practices

  • Definer vocab="https://schema.org/" i <html> tagget for global scope
  • Brug typeof for at specificere schema type på container elementer
  • Anvend property attributter til at markere alle relevante egenskaber
  • Inkluder både datePublished og dateModified for artikler
  • Brug time tags med datetime attribut for maskinlæsbare datoer
  • Nest Person og Organization objekter korrekt for author og publisher
  • Specificer ImageObject med dimensions for publisher logo
  • Valider at alle required properties for NewsArticle/Article er inkluderet
Krydshenvisninger

Andre eksempler

Kolofon

Format
RDFa
Niveau
Mellem
Use cases
6
Best practices
8
Tilbage til registeret