Core Web Vitals är Googles sätt att mäta hur en sida upplevs av besökaren, och de tre måtten går att förbättra på ett WordPress-sajt med konkreta, kontrollerbara steg. Det handlar inte om en enda hastighetssiffra, utan om tre olika saker: hur snabbt det största innehållet syns, hur snabbt sidan svarar på klick, och hur mycket layouten hoppar medan den laddar. Den här guiden förklarar vad LCP, INP och CLS faktiskt mäter, vad du bör mäta dem med, och vilka ändringar som brukar flytta nålen. Inga påhittade resultat, bara metoden och de vanliga orsakerna.
De tre måtten, i klartext
- LCP (Largest Contentful Paint) mäter hur lång tid det tar innan det största elementet i vyn syns, ofta en hjältebild eller en rubrik. Det är besökarens känsla av ”nu har sidan laddat”.
- INP (Interaction to Next Paint) mäter hur snabbt sidan svarar när besökaren klickar, trycker eller skriver. INP ersatte det äldre FID och tittar på svarstiden genom hela besöket, inte bara första klicket.
- CLS (Cumulative Layout Shift) mäter hur mycket innehållet flyttar sig medan sidan laddar. Det är den irriterande upplevelsen när du ska trycka på en knapp och den hoppar iväg för att en bild eller annons laddat in ovanför.
Mät på fältdata, inte bara i labbet
Ett vanligt misstag är att bara köra ett labbtest och tro att det speglar verkligheten. Labbverktyg som Lighthouse kör under kontrollerade förhållanden och är bra för att felsöka, men Google rankar på fältdata: hur riktiga besökare faktiskt upplever sidan, sett över tid. Så här mäter du rätt:
- Titta på fältdata i Google Search Console under rapporten Core Web Vitals. Det är den data Google faktiskt använder.
- Använd PageSpeed Insights för att se både fält- och labbdata för en enskild adress.
- Mät flera sidtyper: startsidan, en artikel, en produktsida. De har olika problem.
- Mät i mobil, eftersom det oftast är där måtten är sämst och där Google väger tyngst.
Core Web Vitals belönar inte tricks utan verklig upplevelse. En sida som laddar sitt viktigaste innehåll tidigt, svarar direkt på klick och inte hoppar omkring klarar måtten nästan av sig själv. Målet är en sida som känns lugn att använda.
Förbättra LCP
LCP handlar mest om hur snabbt servern svarar och hur tungt det största elementet är. De vanliga åtgärderna:
- Slå på sidcache, så att HTML serveras direkt utan att PHP startar. Det sänker tiden till första byte, som LCP bygger vidare på.
- Optimera hjältebilden: rätt storlek, modern komprimering, och ladda den tidigt i stället för att skjuta upp den.
- Undvik att lat-ladda just det element som är LCP. Lat inladdning är bra under sidan, men inte för det första man ser.
Förbättra INP
INP handlar om JavaScript. När sidan är upptagen med att köra skript kan den inte svara på klick, och det syns i måttet. Titta på hur mycket JavaScript dina plugins och ditt tema lastar in, och ta bort det du inte använder. Tunga skript från tredje part, som chattwidgetar och spårningskoder, är vanliga bovar. Ju mindre skript som körs, desto snabbare svarar sidan.
Förbättra CLS
CLS är ofta det enklaste att fixa, eftersom orsakerna är få och konkreta. Ange alltid bredd och höjd på bilder och video, så att webbläsaren reserverar plats innan de laddat. Reservera utrymme för annonser och inbäddat innehåll. Ladda teckensnitt så att texten inte hoppar när det riktiga typsnittet byter ut reservtypsnittet. När varje element vet hur stort det ska vara innan det laddar, slutar sidan hoppa.
Servern spelar roll för alla tre
En snabb server hjälper LCP direkt genom lägre TTFB, och ger INP luft genom att inte tvinga besökarens webbläsare att vänta på långsamma svar. Sidcache, en modern PHP-version och en server som inte är överbelastad är därför en del av grunden för goda värden. På Celestio är full sidcache med regler du styr en del av plattformen, tillsammans med per-site PHP. Vill du förstå cachelagren var för sig har vi skrivit en genomgång av cache, och om du undrar varför sajten är trög i grunden finns en guide om just det.
De flesta av de här ändringarna går att göra själv, ett mått i taget. Vill du stå på en plattform där servergrunden redan är på plats, läs mer om vår plattform eller starta ett konto och flytta över sajten.