Core Web Vitals är en av Googles senaste rankingfaktorer och syftar till att förbättra användarupplevelsen för besökare av dina webbsidor. I den här guiden får du lära dig mer om Core Web Vitals och hur du optimerar för Core Web Vitals för att förbättra din SEO och ranking hos sökmotorer.
Vad är Core Web Vitals?
Under sommaren 2021 uppdaterades Googles algoritm med ett nytt set av rankingsignaler som är extra viktiga för en bra användarupplevelse (UX) på en hemsida. Faktorer som Google anser vara extra viktiga är:
- Laddtid (tiden det tar för innehåll att komma upp i webbläsaren)
- Interaktivitet (hur snabbt reagerar sidan på användarinteraktion)
- Visuell stabilitet (rör sig eller hoppar innehåll runt på skärmen medans sidan laddas?)
För att mäta dessa tre aspekter av användarupplevelse, har Google tagit fram tre mätvärden – det som kallas Core Web Vitals:
LCP – Largest Contentful Paint:
Detta mäter hur lång tid det tar för det största innehållet att laddas in och visas på skärmen. Detta kan vara en bild eller ett textblock. Ett bra betyg ger användare känslan av att sidan laddas snabbt. En långsam sida kan leda till frustration.
FID – First Input Delay:
Detta mäter hur lång tid det tar för webbplatsen att reagera på den första interaktionen. Detta kan till exempel vara ett tryck på en knapp. Ett bra betyg här ger användaren en känsla av att en webbplats är snabb att reagera på input och därför responsiv. Långsamt, återigen, leder till frustration.
CLS – Cumulative Layout Shift:
Detta mäter den visuella stabiliteten på din webbplats. Med andra ord, rör sig saker på skärmen medan den laddas – och hur ofta händer det? Inget är mer frustrerande än att försöka klicka på en knapp när en annons som laddar långsamt visas på den platsen.
Core Web Vitals – en del av Page Experience
Den här uppdateringen är en del av Googles övergripande syn på användarupplevelse och sidupplevelese – det så kallade ”Page Experience”.
Övriga rankingsignaler som varit en del av ”paketet” Page Experience sedan längre tid är:
- Mobil användarvänlighet
- Säker surf
- Https-certifikat
- Intrusive interstitials (påträngande annonser)
Hur mäts Core Web Vitals?
De olika delarna graderas enligt följande:
- Grön är lika med Bra. Sidan är godkänd.
- Gul, sidan behöver förbättringar.
- Röd, sidan får ett dåligt resultat och är inte godkänd.
Här nedan ser du vad Google kräver för att få grönt, dvs godkänt i testet.
För att få en boost i rankingen behöver alla tre värden vara gröna, men tänk på att även om Core Web Vitals är en viktig rankingsignal, så är innehållet på din sida ännu viktigare.
Att tänka på: En sida med bra innehåll är den starkaste faktorn och det är först när man adderar bra innehåll med andra rankingsignaler som du kan få uppleva en riktig boost i rankingen.
Hur klarar sig min sajt i Core Web Vitals?
Det finns idag flera verktyg online för att mäta hur optimerad din sajt och dina webbsidor är för Core Web Vitals:
Google Search Console
I verktyget Google Search Console hittar du en egen sektion för just web vitals. Den talar om för dig på vilka sidor, vilket content som har eventuella problem.
Page Speed Insights
PageSpeed Insights är ett bra verktyg som mäter prestandan på din hemsida.
Lighthouse
Web Vitals extension for Chrome
Det här är ett tillägg till Google Chrome webbläsare. Du kan ladda ned den här
Hur optimerar jag Core Web Vitals?
Vad ska du då göra för att förbättra dessa tre delar av användarupplevelsen?
Att optimera för Core Web Vitals faller inom området teknisk SEO och just denna del är på många sätt likt sättet att optimera en sida för hastighet och prestanda.
Här går vi specifikt in på de detaljer som påverkar just dessa rankingsignaler.
Lyckas du väl med din optimering kommer användarupplevelsen att förbättras och då kommer Google belöna dig med en bättre ranking.
Optimering av LCP – förbättra långsam laddtid
Att optimera LCP är inte alltid enkelt. Har du en stor site eller en site med mycket funktionalitet kan det vara en utmaning.
LCP mäts i sekunder och graderas i Bra, Behöver förbättras och Dåligt.
En bra och därmed godkänd LCP är under 2 sekunder.
Här är 5 tips på hur du optimerar LCP
- Ta bort onödiga tredjeparts-script
Ex. på script från tredjepart är; Google Analytics, GTag, Google ReCaptcha, YouTube videos, Facebook-kopplingar m. fl. - Se över din hosting
Bättre hosting ger överlag snabbare laddtid - Aktivera Lazy Loading
Lazy loading gör så att bilderna laddas först när besökaren scrollar nedåt på sidan. Detta ökar chanserna att nå LCP målet snabbare. - Ta bort stora sidelement
Exempelvis Google Page Speed Insight talar om för dig om din sida har element som drar ned på din laddtid och din LCP. - Komprimera din CSS
Tunga CSS-filer kan fördröja LCP
Optimering av FID – förbättra sidans interaktivitet
Av de tre mätvärdena är denna enklast att åtgärda. I många fall så behöver du inte göra någonting.
Men om du inte får godkänt här finns det ändå saker att göra för att åtgärda problemet.
FID mäts i millisekunder och ett bra resultat för FID ligger på under 100 ms.
3 tips på hur du optimerar FID
- Komprimera och skjut upp inläsning av JavaScript (JS)
Att interagera med en sida som laddar JS är nästan omöjligt, så se till att minimera och skjuta upp inläsningen av JS. - Ta bort ej kritiska tredjeparts-script
Som med LCP, kan tredjeparts-script (så som Google Analytics, ReCaptcha med flera) påverka FID negativt. - Använd browser caching
Browser caching hjälper till att ladda innehållet på din sida snabbare.
Optimering av CLS – förbättra sidans visuella stabilitet
Cumulative Layout Shift (CLS) mäter hur stabil din sida är under uppladdning (visuell stabilitet).
Om delar av din sida hoppar runt medans sidan laddar, har du en hög CLS och det är inte bra.
Man mäter antalet oväntade förskjutningar på sidan och summan av dessa ger dig ett mätetal.
En bra CLS poäng ska vara 0,1 eller mindre.
3 tips för hur du optimerar CLS
- Ange storlek och dimensioner för all media (bilder, video, infographics m.m)
Genom att definiera dimensioner/storlekar för bilder och övrig media så vet användarens browser exakt hur mycket plats varje element behöver på sidan och onödiga förflyttningar av innehållet under laddning undviks. - Om du använder annonser, se till att de har en reserverad plats på din sida
Om annonserna inte har en reserverad plats kan de dyka upp vart som helst under laddning av sidan och trycka undan annat innehåll. - Förladda Google typsnitt
Du kan välja att förladda Google typsnitten eller spara typsnitten lokalt på din egna server.
- Lägg nästa block av element ”below the fold”
Genom att lägga nästa viktiga element på sidan (bilder, text) under det som är synligt på skärmen, så trycks inte innehåll som användaren förväntar sig ska ligga stilla ned.
Sammanfattning I första hand ska du fokusera på ett bra innehåll på din webbplats. Innehåll som är optimerat för dina viktigaste sökord. Core Web Vitals är en rankingfaktor som du bör vara medveten om och som tillsammans med bra innehåll, bättre hastighet och prestanda kan ge din webbplats en rejäl boost i rankingen. Mycket av optimeringen för CWV är samma eller liknande som det är när du ska optimera för hastighet och prestanda. Ta gärna en titt på vår guide 10 tips för en snabbare WordPress hemsida för att få mer hjälp på vägen mot en väl optimerad hemsida.