Core Web Vitals den ultimata guiden

Google uppdaterar kontinuerligt sina mätpunkter och algoritmer. Ibland kommer det nyheter som vi som jobbar med SEO behöver anpassa oss till.
En sådan nyhet som flugit lite under radarn är Core Web Vitals. Det kan du nyttja till din fördel jämfört med konkurrenter. Om du och din webbsida ligger i framkant leder det till en bättre användarupplevelse som i sin tur leder till högre ranking på Google. Detta dessutom med ganska små medel.
I den här guiden går vi igenom vad det är och vad du kan göra för att påverka din ranking genom att optimera för CWV.

Vad är Core Web Vitals?

Från och med 15 juni 2021 är Core Web Vitals en rankingfaktor på Google. Det är en uppsättning mätvärden som bedömer användarupplevelsen utifrån kriterier som laddningsprestanda, tiden det tar från att en användare interagerar med sidan tills webbläsaren ger en respons och visuell stabilitet, dvs hur stabilt sidan laddar eller om objekt ”hackar” fram på skärmen. Det är värdefulla mätvärden för användarupplevelsen och i den här guiden får du lära dig mer om hur det fungerar och hur du optimerar för det.

Core Web Vitals fokuserar på 3 aspekter

Laddningshastighet

Hur fort laddar sidan?

Interaktion

Tiden det tar innan besökare interagerar med sidan

Stabilitet

Laggar bilder och hoppar länkar när sidan laddas?

loading - LCP - Largest contentful paint. Barometer som visar värden för bra, okej eller dåliga Core Web Vitals värden.
Largest Contentful Paint

LCP mäter hur lång tid det tar för det största innehållet att visas på skärmen. Detta kan vara en bild eller ett textblock. Ett bra betyg ger användarna känslan av att sidan laddas snabbt. En långsam sida kan leda till frustration.

First Input Delay

FID 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.

Interactivity - FID - First Input Delay. Barometer som visar okej eller dåliga Core Web Vitals värden.
Visual Stability - CLS - Cumulative Layout Shift. Barometer som visar värden på okej eller dåliga Core Web Vitals värden.
Cumulative Layout Shift

CLS 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.

Hur kan Core Web Vitals hjälpa din SEO?

Genom att hålla din sida på de gröna nivåerna enligt bilden ovan får du bra ranking av Google. Det är inte bara faktumet att du håller dig på grönt som påverkar. Sidinläsningstiden har mycket stor påverkan på användarupplevelsen (och därför användarbeteendet) på webbplatsen. En längre sidinläsningstid resulterar i en högre avvisningsfrekvens. Avhopp ökar med 32% när inläsningstiden för en sida går från 1 sekund till 3 sekunder. När sidinläsningstiden går från 1 sekund till 6 sekunder ökar avvisningsfrekvensen med 106%. På hjälpsidan för Core Web Vitals delar Google med sig av insikter från användartester.

Verktyg för att mäta dina värden

Ikoner på PageSpeed Insights, Lighthouse scorung calculator och Google Search console

Google PageSpeed Insights, mäter din webbplats hastighet.

Lighthouse mäter prestandan, tillgängligheten, SEO och andra kvalitetsindikatorer för bästa praxis på dina webbsidor.

Google Search Console är en webbtjänst från Google som gör det möjligt för webbansvariga att kontrollera indexeringsstatus, sökfrågor, genomsökningsfel och optimera synligheten för sina webbplatser.

Tips som kan hjälpa dig få förbättrade resultat

Undersök webbplatsen för uppenbara problem med Core Web Vitals. Identifiera vilken av de 3 kategorierna som är mest problematisk och använd det som utgångspunkt för förbättring. Vilka element påverkar webbplatsens prestanda negativt?
Baserat på de insikterna skapas en to do lista med konkreta aktiviteter som ska genomföras.
Kanske hänger det på att bilder laddas i föråldrade förmat som till exempel PNG och JPG som kräver mycket resurser för att ladda. Eller så tar det för lång tid för sidan att svara på användarens aktivitet. Orsakerna kan vara flera, därför är det viktigt att göra en ordentlig analys.
Nedan följer en lista med konkreta tips på förbättringar:

Svart pil med glödlampa i för ide
  • Javascript ska laddas när de behövs
  • Använd lazy load på bilder
  • Ladda bara det som är nödvändigt för sidan (autospela ej videos)
  • Minimera CSS påverkan. Tex använd inte CSS för resizing av bilder. Använd rätt bildstorlek på en gång
  • Ladda CSS tidigt
  • Ha annonsutrymme ledigt

Förstå din sidans prestation

Lär dig hur Core Web Vitals ger webbutvecklare mätpunkter, verktyg och vägledning de behöver för att kunna leverera en fantastisk webbupplevelse för varje användare. Genom att förstå detta kommer du kunna bidra enormt mycket genom att dels utföra själv, men också bli en bra ”beställare” till webbutvecklarna.
Klippet visar en tydlig guide från Google Chrome developers.

Core Web Vitals, en summering

Core Web Vitals är en komplex uppsättning av mätetal som signalerar hur din webbsida upplevs av besökarna. Google bedömer hur väl din hemsida presterar på ett tekniskt plan. Du behöver inte vara kodexpert för att kunna utföra de förbättringar du kommer fram till efter en analys av CWV. Vissa saker kan du säkerligen ha nytta av att vara god vän med webbutvecklarna på ditt företag, men generellt sett så är det så kallade ”low code” lösningar som krävs. Det finns stora mängder gratis tutorials att ta del av online så förutsättningarna för att du ska lyckas med de åtgärder som krävs är goda, men det kan vara en god idé att ta höjd för att det kan ta lite tid innan du når de mål du satt upp för din sida, men det är mödan värt! När du har nått i mål med de förbättringar du vill göra kommer din webbsida att leverera en god användarupplevelse med ett smidigt flöde utan att sidan laggar. En annan positiv aspekt är att med dina förbättringar kommer du sannolikt också att förbättra andra SEO-rankande aktiviteter på sidan. Om din arbetsgivare dessutom har en UX-utvecklare anställd kommer ni framöver att kunna hitta ett riktigt bra samarbete då dina kunskaper om rankinghöjande aktiviteter kombinerat med UX kan bilda en riktigt stark duo som tillsammans kan bygga en användarupplevelse av yttersta klass!
För dig som vill lära dig mer rekommenderas varmt support.google.com.

This website uses cookies. By continuing to use this site, you accept our use of cookies.