Hopp til hovedinnhold
Opplevelse

CLS

Cumulative Layout Shift – Core Web Vital som måler visuell stabilitet og uventede layoutendringer.

Oppdatert: 2026-01

Hva er cls?

CLS (Cumulative Layout Shift) måler hvor mye innholdet på siden "hopper" eller flytter seg mens den laster.

Dette skjer ofte når:

  • Bilder lastes uten definerte dimensjoner
  • Annonser dukker opp
  • Fonter bytter under lasting
  • Dynamisk innhold injiseres

Mål:

  • God: Under 0.1
  • Trenger forbedring: 0.1 - 0.25
  • Dårlig: Over 0.25

Hvorfor er det viktig?

Layout shift er ekstremt frustrerende:

  • Du skal klikke på en lenke, men den flytter seg
  • Du leser tekst som plutselig hopper nedover
  • Feilklikk fører til uønskede handlinger

Dårlig CLS gir dårlig brukeropplevelse og lavere Google-rangering.

Hvordan bruke det?

  1. Sett dimensjoner på bilder: Bruk width og height attributter
  2. Reserver plass for annonser: Definer størrelse på containere
  3. Preload fonter: Unngå font-swap som flytter tekst
  4. Unngå å injisere innhold over eksisterende: Legg til nederst
  5. Test på treg forbindelse: Layout shift er verre på sakte nett