Core Web Vitals on kolme mittaria, joilla Google arvioi sivun käyttökokemusta. LCP mittaa latausnopeutta. CLS mittaa visuaalista vakautta. INP mittaa vastaavuutta eli sitä, kuinka nopeasti sivu reagoi.
Jokainen mittari kertoo suorituskyvystä eri puolen. Yhdessä ne antavat kuvan käyttökokemuksesta.
Largest Contentful Paint (LCP)
LCP mittaa ajan, joka kuluu pääsisällön latautumiseen. Pääsisältö on sivun suurin kuva tai tekstilohko. Etusivulla LCP on pääkuva. Artikkelissa LCP on artikkelin otsikko ja pääkuva.
LCP mitataan hetkestä, jolloin käyttäjä klikkaa linkkiä, siihen asti kun pääsisältö näkyy ruudulla. Jos LCP on yksi sekunti, käyttäjä näkee pääsisällön sekunnin klikkauksen jälkeen. Jos LCP on kolme sekuntia, käyttäjä odottaa kolme sekuntia.
Tavoite: alle 2,5 sekunnin LCP on hyvä. LCP 2,5 ja 4 sekunnin välillä kaipaa parannusta. Yli 4 sekunnin LCP on huono.
Esimerkki: etusivun pääkuva on viisi megatavua. Sen lataus kestää kolme sekuntia. LCP on kolme sekuntia. Tavoite on 2,5 sekuntia. Suorituskyky kaipaa parannusta.
Cumulative Layout Shift (CLS)
CLS mittaa visuaalista vakautta. Asettelun siirtymä tapahtuu, kun sisältö liikkuu sivun latauduttua. Esimerkki: käyttäjä alkaa lukea artikkelia. Mainos latautuu. Artikkeli siirtyy alaspäin. Käyttäjä menettää paikkansa. Ärsyttävää.
CLS kvantifioi asettelun siirtymän kokonaismäärän. Jos sisältö siirtyy kaksisataa pikseliä alaspäin, CLS kasvaa. Jos sisältö siirtyy useita kertoja, CLS kertyy.
Tavoite: alle 0,1 oleva CLS on hyvä. CLS 0,1 ja 0,25 välillä kaipaa parannusta. Yli 0,25 oleva CLS on huono.
Esimerkki: mainos latautuu sivun latauduttua. Mainos vie kolmesataa pikseliä korkeutta. Mainoksen alla oleva sisältö siirtyy alaspäin. CLS on 0,15. Kaipaa parannusta.
Interaction to Next Paint (INP)
INP mittaa vastaavuutta. Käyttäjä klikkaa painiketta. Järjestelmä käsittelee klikkauksen. Päivittää sivun. Muutos piirtyy ruudulle. INP on aika klikkauksesta visuaaliseen päivitykseen.
INP on tärkeä interaktiivisilla sivuilla (lomakkeet, painikkeet, valikot). Staattisilla sivuilla (artikkelit, blogit) se on vähemmän tärkeä.
Tavoite: alle 200 millisekunnin INP on hyvä. INP 200 ja 500 millisekunnin välillä kaipaa parannusta. Yli 500 millisekunnin INP on huono.
Esimerkki: käyttäjä klikkaa Lisää ostoskoriin -painiketta. Järjestelmä käsittelee pyynnön. Päivittää ostoskorin laskurin. INP on 300 millisekuntia. Kaipaa parannusta.
Miksi kolme mittaria yhden sijaan
Yksi mittari ei kuvaa koko käyttökokemusta. Latausnopeudella on väliä (LCP). Visuaalisella vakaudella on väliä (CLS). Vastaavuudella on väliä (INP). Sivu voi latautua nopeasti mutta olla epävakaa (korkea CLS). Tai nopea ja vakaa, mutta hidas reagoimaan (korkea INP). Kolme mittaria yhdessä mittaavat käyttökokemuksen laatua.
Käytännön esimerkki: verkkokaupan Core Web Vitals
Lähtötilanne
Verkkokaupan tuotesivun lähtötilanne:
LCP: 2,8 sekuntia (yli tavoitteen 2,5). CLS: 0,12 (yli tavoitteen 0,1). INP: 220 millisekuntia (yli tavoitteen 200).
Kaikki kolme mittaria kaipaavat parannusta.
Optimointi
LCP: optimoi pääkuva ja lataa sivun alaosan sisältö vasta tarvittaessa (lazy load). Tulos: 1,8 sekuntia.
CLS: varaa tilaa mainoksille ja lataa vähemmän tärkeä sisältö vasta tarvittaessa. Tulos: 0,05.
INP: vähennä JavaScriptiä ja optimoi tapahtumankäsittelijät. Tulos: 180 millisekuntia.
Kaikki kolme mittaria täyttävät nyt Googlen vaatimukset.
Miten Core Web Vitals liittyvät käyttökokemukseen
Hyvä LCP: käyttäjä näkee sisällön nopeasti. Sivu tuntuu reagoivalta.
Huono LCP: käyttäjä odottaa sisältöä. Sivu tuntuu hitaalta.
Hyvä CLS: asettelu on vakaa. Käyttäjä voi lukea ilman, että sisältö hyppii. Miellyttävää.
Huono CLS: asettelu siirtyy. Käyttäjä menettää paikkansa. Ärsyttävää.
Hyvä INP: käyttäjä klikkaa painiketta ja näkee vastauksen heti. Sivu tuntuu interaktiiviselta.
Huono INP: käyttäjä klikkaa painiketta ja odottaa vastausta. Sivu tuntuu jähmeältä.
Hyvät Core Web Vitals tuottavat hyvän käyttökokemuksen. Huonot Core Web Vitals tuottavat huonon käyttökokemuksen.
Core Web Vitalsin mittaaminen
Google mittaa Core Web Vitalsin oikeilta käyttäjiltä (real user monitoring). Laboratoriotestaustyökalut, kuten Lighthouse, arvioivat Core Web Vitalsia, mutta tulos ei välttämättä vastaa oikeiden käyttäjien kokemusta (verkko-olosuhteet vaihtelevat).
Tarkista Core Web Vitals Google Search Consolesta. Google kokoaa oikeiden käyttäjien dataa ja näyttää, täyttääkö sivusto vaatimukset (hyvä, kaipaa parannusta, huono).
Tarkista ne myös PageSpeed Insightsista. Se näyttää Lighthouse-pisteet sekä oikeiden käyttäjien datan Googlen tietokannasta.
Usein kysytyt kysymykset
Mikä Core Web Vitalsin mittareista on tärkein?
Kaikilla kolmella on merkitystä. LCP ja CLS vaikuttavat yleensä eniten. Jos sivu latautuu nopeasti mutta asettelu hyppii jatkuvasti, käyttökokemus on huono. Jos sivu on vakaa mutta jähmeä, turhautuminen on lievempää. LCP ja CLS ovat yleensä ensimmäinen ja toinen prioriteetti. INP on tärkeä interaktiivisilla sivuilla, mutta staattiselle sisällölle vähemmän kriittinen. Rakenna tämä suoraan verkkosivustollesi WEMASY-sivustonrakentajalla.
Miten Core Web Vitals eroavat muista suorituskykymittareista?
Core Web Vitals ovat käyttökokemukseen keskittyviä mittareita. Ne mittaavat sitä, minkä käyttäjät kokevat. Muut mittarit (TTFB, FCP) ovat teknisiä mittareita. Ne ovat hyvien Core Web Vitalsin edellytyksiä, mutta eivät mittaa käyttökokemusta suoraan. Paranna muita mittareita perustana, mutta Core Web Vitals kertovat, muuttuuko perusta hyväksi kokemukseksi.
Voiko suorituskykymittarit olla hyvät mutta Core Web Vitals huonot?
Kyllä. Sivulla voi olla nopea TTFB mutta huono LCP. Sivulla voi olla nopea FCP mutta huono CLS. Tekniset mittarit ovat tarpeen mutta eivät riitä hyviin Core Web Vitalsiin.
Pitäisikö kaikkia kolmea Core Web Vitals -mittaria optimoida yhtä paljon?
Ei. Priorisoi vaikutuksen mukaan. Mittaa nykytila. Jos LCP on neljä sekuntia mutta CLS on 0,1, paranna ensin LCP:tä. Suurimmilla puutteilla on suurin vaikutus käyttäjiin.
Ovatko Core Web Vitals ainoat mittarit, joista Google välittää?
Ei. Google mittaa myös mobiiliystävällisyyttä, HTTPS:ää, turvallista selailua ja koko ruudun välimainoksia. Core Web Vitals ovat näkyvimmät ja helpoimmin muutettavat. Koko sivukokemukseen kuuluu kuitenkin myös muita tekijöitä. Optimoi Core Web Vitals, mutta älä unohda muita sijoitustekijöitä.
Kuinka usein oikeiden käyttäjien Core Web Vitals päivittyvät Google Search Consolessa?
Päivittäin. Google kokoaa oikeiden käyttäjien dataa jatkuvasti. Core Web Vitals päivittyvät Search Consolessa päivittäin. Laboratoriotestaustyökalut näyttävät yhden ajanhetken mittauksen. Seuraa Search Consolen oikeiden käyttäjien dataa jatkuvan suorituskyvyn seurantaan.