Tri meritve in njihove meje
Vsaka meritev ima mejo za »dobro« in »slabo«. Stran je uspešna, ko je dobra pri 75. percentilu resničnih obiskov, ločeno za mobilne naprave in namizje.
- Largest Contentful Paint (LCP): dobro do 2,5 s, slabo nad 4 s. Označuje trenutek, ko se izriše največja slika ali besedilni blok v vidnem delu.
- Interaction to Next Paint (INP): dobro do 200 ms, slabo nad 500 ms. Meri zamik med dotikom, klikom ali pritiskom tipke in naslednjo vidno spremembo, skozi ves obisk.
- Cumulative Layout Shift (CLS): dobro do 0,1, slabo nad 0,25. Sešteje nepričakovane premike postavitve, na primer ko besedilo poskoči, ker se slika ali pasica naloži pozno.
INP je marca 2024 kot Core Web Vital nadomestil First Input Delay (FID). Orodje ali poročilo, ki vas še vedno ocenjuje po FID, je zastarelo.
Podatki resničnih uporabnikov in laboratorijske meritve
Podatki resničnih uporabnikov prihajajo od uporabnikov brskalnika Chrome prek poročila Chrome UX Report (CrUX), zbrani za zadnjih 28 dni. Te uporablja Google. Manjše strani jih pogosto nimajo, ker nimajo dovolj obiska, da bi jih Google objavil.
Laboratorijske meritve dobimo z enim simuliranim nalaganjem v orodju Lighthouse, običajno na upočasnjenem telefonu srednjega razreda. So ponovljive in odlične za iskanje vzrokov, ne morejo pa izmeriti INP, ker strani nihče dejansko ne uporablja. Lighthouse zato poroča Total Blocking Time (TBT), ki se dobro ujema s težavami pri INP.
Laboratorijske meritve uporabite za iskanje vzrokov, podatke resničnih uporabnikov pa za potrditev, da je popravek res pomagal obiskovalcem. Ti se spreminjajo postopoma, saj se mora 28-dnevno obdobje najprej v celoti obnoviti.
Kako izboljšati LCP
Počasen LCP ima največkrat enega od štirih vzrokov: počasen odziv strežnika, CSS ali skripto, ki blokira izris, glavno sliko, ki jo brskalnik odkrije prepozno, ali preprosto prevelika slikovna datoteka.
- Odzivni čas strežnika (TTFB) naj bo kratek: pomagata predpomnjenje strani in CDN.
- Glavne slike ne nalagajte z zamikom (lazy-load). Dodajte ji
fetchpriority="high", če je nastavljena v CSS, pa jo prednaložite. - Glavno sliko ponudite v sodobnem formatu (AVIF ali WebP), v velikosti, v kateri se prikaže, z
srcsetza različne zaslone. - Ključni CSS vstavite v stran ali pa naj bo glavna datoteka CSS majhna, skripte, ki niso potrebne za prvi prikaz, pa naložite z zamikom.
- Drsnike in samodejne videe v glavi strani, kjer je mogoče, zamenjajte z eno močno statično sliko.
Kako izboljšati INP
Slab INP skoraj vedno pomeni, da je glavna nit brskalnika zasedena, ko uporabnik klikne. Najpogostejši vzrok je težek JavaScript, velik del tega pa so pogosto skripte tretjih oseb.
- Odstranite skripte, ki jih ne uporabljate več, predvsem ostanke starih aplikacij, vtičnikov in poskusov v upravitelju oznak.
- Klepetalnike, toplotne karte in pripomočke za ocene naložite šele, ko je stran interaktivna ali ko jih uporabnik odpre.
- Dolge naloge razdelite na krajše, obdelava klikov pa naj bo čim lažja, da lahko brskalnik po vsakem dejanju hitro izriše spremembo.
- Izogibajte se ogromnim drevesom DOM: zelo veliki meniji in mreže izdelkov upočasnijo vsako posodobitev.
Kako izboljšati CLS
Premiki postavitve nastanejo, ko brskalnik ne ve, koliko prostora bo nekaj potrebovalo, dokler se to ne naloži.
- Vsaki sliki, videu in elementu iframe nastavite
widthinheight(aliaspect-ratio). - Rezervirajte prostor za oglasne površine, pasice s piškotki in vdelave, da ob prikazu ne potisnejo vsebine navzdol.
- Uporabite
font-display: swapz nadomestno pisavo podobne velikosti ali prednaložite glavno spletno pisavo, da se besedilo manj premika. - Nad obstoječo vsebino nikoli ne vstavljajte nove, razen če jo je uporabnik zahteval.
Kaj pokaže poročilo Sitequiry
Sitequiry zažene Google PageSpeed Insights za mobilne naprave in namizje ter prikaže LCP, FCP, TBT in CLS na lestvicah z zgornjimi mejami, skupaj s filmskim trakom nalaganja in težo strani po vrstah virov. Kadar ima Google za URL ali domeno podatke CrUX, jih poročilo prav tako uporabi. Kadar PageSpeed ni na voljo, poročilo to jasno napiše in oceno hitrosti označi kot približek, namesto da bi si izmislilo številke.
Pogosta vprašanja
Ali so Core Web Vitals dejavnik uvrstitve?
So del Googlovih signalov izkušnje na strani. Ustrezna in koristna vsebina šteje bistveno več; dobre meritve najbolj pomagajo, ko so rezultati sicer podobni, in neposredno vplivajo na to, koliko obiskovalcev ostane.
Zakaj se ocena PageSpeed razlikuje med meritvami?
Laboratorijski test je odvisen od omrežja, obremenitve strežnika in skript tretjih oseb v tistem trenutku. Nekaj točk razlike je normalno; spremljajte trend in posamezne meritve, ne ene same ocene.
Moja stran nima podatkov resničnih uporabnikov. Je to težava?
Ne. To samo pomeni, da ni dovolj obiska iz Chroma, da bi CrUX objavil številke. Težave poiščite in odpravite z laboratorijskimi meritvami; podatki se pojavijo sami, ko obisk zraste.
Naj najprej optimiziram za telefon ali namizje?
Za telefon. Google indeksira mobilno različico strani, telefoni so počasnejši, večina obiskovalcev manjših podjetij pa pride prav s telefonom.
Preverite svojo stran v približno minuti
Brezplačna analiza na vašem URL-ju preveri točke iz tega vodiča in pokaže, kaj popraviti najprej.