Hvad er Core Web Vitals?
Core Web Vitals er et sæt præstationsmålinger, som Google har indført for at evaluere vigtige aspekter af brugeroplevelsen på hjemmesider.
De fokuserer på, hvor hurtigt en side indlæses, hvor responsiv den føles, når brugerne interagerer, og hvor stabilt layoutet er, når indholdet vises.
Google betragter Core Web Vitals som en del af sine ranking-signaler for sideoplevelse, som har direkte indflydelse på SEO-præstationer og synlighed i søgeresultater.
De tre vigtigste Core Web Vitals er:
- Largest Contentful Paint (LCP) - Måler indlæsningsperformance.
- Interaction to Next Paint (INP) - Måler responsivitet (erstatter FID).
- Cumulative Layout Shift (CLS) - Måler visuel stabilitet.
De tre kernemålinger forklaret
1. Største indholdsrige maleri (LCP)
- Definition: Den tid, det tager for det største synlige element (f.eks. et billede, en video eller en tekstblok) at blive vist i visningsvinduet.
- God score: ≤ 2,5 sekunder.
- Tips til optimering:
- Brug effektive billedformater (WebP, AVIF).
- Implementer doven indlæsning.
- Forudindlæs kritiske ressourcer.
- Optimer serverens svartider (TTFB).
2. Interaktion til næste billede (INP)
- Definition: Måler den samlede responsivitet ved at beregne ventetiden mellem en brugers interaktion (som et klik eller tryk) og den næste visuelle opdatering.
- God score: ≤ 200 millisekunder.
- Erstatter: First Input Delay (FID), som kun målte den første interaktion.
- Tips til optimering:
- Minimér udførelsestiden for JavaScript.
- Opdel lange opgaver.
- Brug
requestIdleCallback()eller Web Workers til ikke-hastende kode. - Prioriter kritiske event-lyttere.
3. Kumulativ layoutforskydning (CLS)
- Definition: Sporer, hvor meget synlige elementer uventet bevæger sig rundt under sideindlæsning.
- God score: ≤ 0,1.
- Tips til optimering:
- Inkluder bredde/højde-attributter for billeder og videoer.
- Reserver plads til annoncer og dynamiske indlejringer.
- Undgå at indsætte indhold over eksisterende elementer.
Understøttende målinger af ydeevne
Mens Core Web Vitals er Googles fokus, supplerer flere laboratoriemålinger dem under performancetest:
Samlet blokeringstid (TBT)
Måler, hvor længe scripts blokerer hovedtråden mellem First Contentful Paint (FCP) og Time to Interactive (TTI).
- Ideel værdi: < 200 ms.
- Proxy-metrik: TBT bruges i laboratorietest som en proxy for INP, før feltdata er tilgængelige.
Tid til interaktiv (TTI)
Angiver, hvornår en side bliver fuldt interaktiv.
- Mål: ≤ 5 sekunder.
- Hjælper med at måle brugeropfattet parathed ud over LCP.
Første indholdsrige maling (FCP)
Måler, hvor hurtigt den første tekst eller det første billede vises.
- Mål: ≤ 1,8 sekunder.
- Ofte det første indtryk af den opfattede performance.
Moderne standarder for weblevering
Core Web Vitals performance er tæt forbundet med moderne webtransport og optimeringsprotokoller.
Implementering af følgende kan forbedre resultaterne drastisk:
HTTP/2 og HTTP/3
- Tillader multiplexing og hurtigere parallel ressourceindlæsning.
- Reducerer latenstid og forbedrer den samlede brugeroplevelse.
Brotli-komprimering
- Mere effektiv end GZIP; komprimerer tekstbaserede aktiver (HTML, JS, CSS) med mindre filstørrelser.
Preload, Prefetch og Preconnect
- Forudindlæsning: Fortæller browseren, at den skal prioritere vigtige aktiver (skrifttyper, heltebilleder).
- Prefetch: Indlæser sandsynligvis nødvendige ressourcer, før brugeren anmoder om dem.
- Preconnect: Etablerer tidlige forbindelser til tredjepartsdomæner.
Doven indlæsning
- Udskyder indlæsning af ikke-kritiske billeder eller iframes, indtil de kommer ind i visningsporten.
- Reducerer den indledende sidevægt og forbedrer LCP.
Prioriterede hints
- Giver udviklere mulighed for eksplicit at kontrollere rækkefølgen for indlæsning af ressourcer ved hjælp
af fetchpriority. - Især nyttigt for at sikre, at heltebilleder eller skrifttyper indlæses først.
HSTS (HTTP Strict Transport Security)
- Tvinger HTTPS-forbindelser til alle anmodninger, hvilket forbedrer sikkerheden og potentielt reducerer omdirigeringer.
Hvordan Core Web Vitals påvirker SEO
Google bruger Core Web Vitals som et ranking-signal i sin Page Experience-opdatering.
Hjemmesider, der klarer sig godt på disse parametre, har en tendens til at have det:
- Højere brugerengagement og fastholdelse.
- Lavere afvisningsprocent.
- Forbedret organisk synlighed.
Ranktrackers værktøjer Web Audit og SERP Checker kan hjælpe med at måle og overvåge disse målinger for at identificere flaskehalse i ydeevnen, der kan påvirke placeringen.
Bedste praksis for at optimere centrale webvitale parametre
- Brug et indholdsleveringsnetværk (CDN): Reducer ventetiden ved at servere indhold fra eksterne steder.
- Implementer opdeling af kode: Server mindre, sidespecifikke JavaScript-bundter.
- Optimer skrifttyper: Brug font-display swap og forudindlæs vigtige fonte.
- Cache strategisk: Udnyt browsercaching og caching på serversiden.
- Udskyd ikke-kritiske scripts: Brug
async-ogdefer-attributtertil JS. - Minificer og komprimér aktiver: Anvend minificering og Brotli-komprimering til HTML, CSS og JS.
- Overvåg feltdata: Brug Chrome UX Report eller Ranktracker's site audit til at indsamle data om brugernes reelle performance.
Værktøjer til at måle centrale web-vitale parametre
- Ranktracker Web Audit: Identificer Core Web Vitals-problemer i realtid.
- Google PageSpeed Insights: Felt- + laboratoriedata fra Chrome UX Report.
- Lighthouse: Simuleret laboratorietest til optimering af ydeevne.
- WebPageTest: Avanceret ydelsesdiagnostik med visuel sammenligning.
- Chrome DevTools: Performance-fanen til inspektion af renderings- og blokerings-scripts.
Fremtiden for Core Web Vitals
Google fortsætter med at forfine målingerne, så de bedre afspejler den reelle brugeroplevelse.
Fremtidige retninger inkluderer:
- AI-drevet prioritering af ydeevne (prædiktiv indlæsning).
- Udvidet INP-fokus på mikrointeraktioner.
- Performance-data for kantrendering som en del af Page Experience-signaler.
Resumé
Core Web Vitals definerer, hvordan Google måler sideoplevelsen i den virkelige verden.
Ved at optimere til LCP, INP og CLS og understøtte dem med moderne leveringsstandarder som HTTP/3, Brotli og Priority Hints kan du forbedre både dine SEO-placeringer og din brugertilfredshed.
Performance er ikke kun teknisk - det er grundlæggende for synlighed og troværdighed i moderne søgning.
