Cumulative Layout Shift (CLS) er en Core Web Vital, der måler, hvor meget synligt indhold uventet flytter sig under indlæsning og brug. Scoren er ikke en tid i sekunder, men et tal baseret på, hvor stort et område der skifter, og hvor langt det flytter sig. Brugerinitierede ændringer tæller normalt ikke.
Hvorfor CLS betyder noget
Når knapper, tekst eller menuer hopper, mens brugeren læser eller klikker, opstår fejlklik og mistet tillid. CLS er sammen med LCP og INP en af de tre Core Web Vitals. Google vurderer den ved 75. percentil: højst 0,1 er godt, 0,1–0,25 bør forbedres, over 0,25 er dårligt.
Typiske årsager er billeder uden dimensioner, annoncer og embeds uden reserveret plads, webskrifttyper der ændrer linjeskift, og dynamisk indhold indsat over det, brugeren allerede ser — cookie-bannere, kampagnebjælker eller anbefalet indhold.
Forebyg CLS i WordPress
Angiv altid bredde og højde på billeder, eller brug CSS aspect-ratio, så browseren kan reservere plads før filen er hentet. Gør det samme for video, iframes, kort, formularer og annoncepladser.
- Brug lazy loading på billeder under folden, men reservér plads — lazy load alene løser ikke hop.
- Lad ikke samtykkebanner eller popup skubbe hovedindholdet ned; brug overlay eller reserveret plads.
- Begræns fontvarianter og test skabeloner med lange overskrifter, så webfont ikke ændrer layout sent.
- Undgå at forbedre LCP ved at forsinke synligt indhold kunstigt; det kan øge CLS.
Sådan finder du årsagen
Brug PageSpeed Insights til feltdata og Chrome DevTools' Performance-panel til at se, hvilke elementer der flytter sig. Test på mobil med langsom netværksprofil. Ret de største layoutskift først — ofte hero-billeder, annoncer og font-loading — og mål igen på samme URL og cachetilstand.
