Artikel

Video i HTML — video-elementet, formater og SEO

HTML video-elementet giver fuld kontrol over selvhostede videoer — men kræver korrekt opsætning af formater, preload og tilgængelighed for optimal SEO.

Sidst opdateret:

HTML <video>-elementet giver fuld kontrol over videoafspilning direkte i browseren — uden plugins, uden tredjeparts-platforme. Det er standardmetoden til selvhostede videoer og den korrekte løsning når du vil beholde kontrol over afspilleren, undgå YouTube-branding eller servere video fra dit eget CDN.

Grundlæggende video-markup

<video
  width="1280"
  height="720"
  controls
  preload="metadata"
  poster="thumbnail.jpg">
  <source src="video.webm" type="video/webm">
  <source src="video.mp4" type="video/mp4">
  <p>Din browser understøtter ikke HTML5 video.
     <a href="video.mp4">Download videoen</a>.</p>
</video>

Browseren forsøger <source>-elementerne i rækkefølge og bruger det første understøttede format. Fallback-teksten vises i browsere der ikke understøtter <video>.

Videoformater og codec

FormatCodecUnderstøttelseKomprimering
MP4H.264UniversalBasis
MP4H.265/HEVCSafari + nyereBedre
WebMVP9Alle moderne browsereBedre end H.264
WebMAV1Alle moderne browsereBedst

Inkluder altid MP4 (H.264) som fallback for maksimal kompatibilitet. Tilføj WebM (VP9 eller AV1) som foretrukket format — det reducerer filstørrelsen markant for brugere med moderne browsere.

preload-attributten

preload styrer hvornår videofilen downloades:

  • preload="none" — download intet ved sideload. Bedst for performance, dårligst for hurtig afspilning.
  • preload="metadata" — download kun metadata (varighed, dimensioner). God balance.
  • preload="auto" — browser bestemmer. Ofte downloader den hele videoen — undgå på mobile enheder.

Brug preload="metadata" som standard. Brug preload="none" på sider med mange videoer.

poster — thumbnail-billede

poster-attributten viser et stillbillede inden videoen starter. Uden poster viser browseren enten et sort billede eller det første videobillede:

<video poster="video-thumbnail.jpg" ...>

Brug altid poster — det forbedrer oplevelsen og reducerer CLS (browser ved dimensionerne fra billedet).

Autoplay — regler og best practice

Moderne browsere tillader kun autoplay for muted video:

<video autoplay muted loop playsinline>
  <source src="baggrund.webm" type="video/webm">
  <source src="baggrund.mp4" type="video/mp4">
</video>

playsinline er nødvendig på iOS for at undgå at videoen åbner i fullscreen. loop gentager videoen. muted er obligatorisk for autoplay at virke.

Video og SEO

Selvhostede videoer indekseres af Googlebot via VideoObject schema. Uden structured data er sandsynligheden for video rich results lav. Se VideoObject schema for implementeringsdetaljer.

For performance: host videoer på et CDN. En 100MB video-fil hostet på shared hosting med langsom TTFB vil forværre LCP markant. Brug Cloudflare Stream, Bunny.net eller tilsvarende video-CDN for optimal performance.

Sidst opdateret: marts 2026. Denne artikel er en del af Stegger.dk’s SEO-ordbog. → Denne artikel er en del af Indholdselementer i kode — Links, billeder og formularer.

Del af: Indholdselementer i kode — Links, billeder og formularer →

Andre artikler i samme emne

Relaterede begreber

Emne Indholdselementer i kode — Links, billeder og formularer Links, billeder, formularer, tabeller og lister — HTML-elementerne der bærer dit indhold og påvirker SEO direkte. Artikel iframe og embed — Indlejring af eksternt indhold i HTML iframe indlejrer eksternt indhold — YouTube-videoer, Google Maps og betalingswidgets. Forstå SEO-konsekvenserne og hvornår iframe er det rigtige valg. Artikel Billeder i HTML — img-tag, alt-tekst og billedoptimering img-tagget med alt-tekst er fundamentalt for SEO og accessibility — og loading og dimensions-attributter påvirker Core Web Vitals direkte. Emne Web Performance — Core Web Vitals og teknisk hastighed Web performance er en direkte SEO-rankingfaktor — Core Web Vitals, hastighed og responsivt design påvirker din placering. Artikel VideoObject schema — Structured data til videoindhold VideoObject schema markerer videoindhold for Google og kan aktivere thumbnails, videokarrusel og tidsstempler direkte i søgeresultaterne. Hovedguide Kode — Webkode og teknisk SEO Komplet guide til webkode og teknisk SEO — fra HTML-struktur og metadata til crawling, structured data og Core Web Vitals.

Ofte stillede spørgsmål

Hvornår er selvhostet video bedre end YouTube-iframe?
Selvhostet video er bedre når: du vil have fuld kontrol over afspilleren og branding, du vil undgå YouTubes anbefalinger efter afspilning, videoindholdet er fortroligt eller eksklusivt, eller du vil undgå Googles data-indsamling. YouTube-iframe er bedre til SEO-synlighed (YouTube er verdens andenstørste søgemaskine), hosting-besparelser og automatisk CDN-distribution.
Hvilke videoformater skal jeg inkludere?
MP4 med H.264-codec er basisformatet med universel browserunderstøttelse. WebM med VP9 eller AV1 giver bedre komprimering (20-50% mindre ved samme kvalitet) og understøttes i alle moderne browsere. Brug source-elementet med begge formater — browseren vælger det bedste understøttede format automatisk.
Hvad er autoplay-reglerne i moderne browsere?
Moderne browsere (Chrome, Firefox, Safari) tillader kun autoplay for videoer der er mutede (lydløse). Video med lyd der forsøger at autoplay blokeres. Autoplay af muted video er tilladt og bruges hyppigt til baggrundsvideo og loopende illustrationer. Brug aldrig autoplay af video med lyd — det er irriterende og blokeres alligevel.
Hvad er preload-attributten og hvad er standardindstillingen?
preload-attributten styrer browserens forhåndsindlæsning af videofilen: 'none' downloader ingenting ved sideload (bedst for performance), 'metadata' downloader kun varighed og dimensioner (god balance), og 'auto' lader browseren bestemme — resulterer typisk i download af hele filen. Standard er 'metadata' i de fleste browsere. Brug 'none' på sider med mange videoer eller videoer under fold for at spare bandwidth og reducere LCP-påvirkning.
Kan Google indeksere selvhostede videoer og vise dem i søgeresultater?
Ja — Google kan indeksere selvhostede videoer hvis de er korrekt markeret med VideoObject structured data (JSON-LD) og tilgængelige for Googlebots crawler. Uden VideoObject schema er sandsynligheden for video-rich results og Video-tab indeksering lav. Vigtige felter: name, description, thumbnailUrl, uploadDate og contentUrl (URL til videofilen direkte). YouTube-embeds giver automatisk indeksering via Googles YouTube-integration.

Placering i ordbogen

Kode — Webkode og teknisk SEO
Indholdselementer i kode — Links, billeder og formularer
Video i HTML — video-elementet, formater og SEO