Mājaslapas ātrums: Core Web Vitals vienkāršā valodā un kā paātrināt lapu

Kāpēc ātrums ir svarīgs

Lapa, kas ielādējas lēni, zaudē apmeklētājus: cilvēks neuzgaida un atver konkurentu. Ātrums ietekmē arī pozīcijas meklēšanā, jo Google vērtē lapas pieredzi un izmanto tā saucamos Core Web Vitals. Mobilajās ierīcēs, kur savienojums mainīgs, problēma ir vēl jūtamāka, bet tieši no telefona nāk liela daļa klientu.

Trīs rādītāji, kurus vērtē Google

Core Web Vitals ir trīs rādītāji. Google orientieri tiem, lai pieredze būtu laba:

• LCP (Largest Contentful Paint) ir laiks, kad parādās lielākais satura elements (parasti galvenais attēls vai virsraksts). Labi: ne vairāk par 2,5 sekundēm.
• INP (Interaction to Next Paint) ir lapas atsaucība uz darbībām: klikšķi, pieskārieni, teksta ievade. Labi: ne vairāk par 200 milisekundēm.
• CLS (Cumulative Layout Shift) ir lapas elementu „lēkāšana” ielādes laikā: poga aizbēg tieši tad, kad uz tās klikšķināt. Labi: ne vairāk par 0,1.

Šie rādītāji tiek vērtēti pēc reāliem lietotājiem (laboratorijas rezultāti var atšķirties), tāpēc vienam testam pārāk daudz ticēt nevajag. Svarīgi, lai tendence būtu laba.

Kā pārbaudīt

1. Atveriet PageSpeed Insights un ievadiet lapas adresi. Skatieties gan mobilo, gan datora rezultātu.
2. Search Console sadaļā „Core Web Vitals” redzams, cik jūsu lapu ir labā, vidējā un sliktā stāvoklī, pamatojoties uz reāliem apmeklētājiem.
3. Atveriet mājaslapu uz sava telefona, izmantojot mobilo internetu, nevis Wi-Fi.
4. Pārbaudiet tipiskākās lapas: sākumlapu, pakalpojumu lapu, kontaktus un, ja ir, preču kartīti.

Biežākie ātruma cēloņi un ko ar tiem darīt

Smagi attēli

Visizplatītākā problēma. Fotogrāfijas pa vairākiem megabaitiem bez saspiešanas lēnina lapu. Risinājums: saspiest attēlus, izmantot modernus formātus (WebP, AVIF), norādīt pareizus izmērus un ielādēt attēlus, kad tie nonāk redzamības laukā (izņemot pirmo ekrānu). Norādiet attēlu platumu un augstumu, lai lapa neliektos (labs CLS).

Liekie skripti un sīkrīki

Čati, sociālo tīklu logrīki, analītikas skripti, reklāmas kodi, video atskaņotāji: katrs pievieno ielādes laiku. Atstājiet tikai to, kas patiešām vajadzīgs, bet pārējo noņemiet vai ielādējiet vēlāk.

Bloķējošs CSS un JavaScript

Ja lapa gaida lielus stilu un skriptu failus, pirms rāda saturu, LCP pasliktinās. Samaziniet failus, apvienojiet, atliekiet to, kas nav vajadzīgs uzreiz, un izmantojiet keša iestatījumus.

Fonti

Daudz fontu un to variantu palēnina ielādi. Izmantojiet divus trīs fontus, tikai nepieciešamos svarus, un norādiet noklusēto fontu, lai teksts parādītos uzreiz.

Hostings un serveris

Lēns serveris vai tāls datu centrs palielina pirmā atbildes laiku. Izvēlieties hostingu ar Eiropas serveriem, ieslēdziet saspiešanu un kešošanu, izmantojiet jaunu PHP versiju, ja mājaslapa uz tās darbojas.

Konstruktors vai smags saturs

Dažos konstruktoros un sistēmās ar daudziem spraudņiem lapa saņem daudz liekā koda. Individuāli veidota mājaslapa parasti ir vieglāka, jo satur tikai nepieciešamo. Salīdzinājums ir rakstā „Wix, Tilda vai individuāla mājaslapa”.

Kas ir atsaucība uz telefona

Ātrums nav tikai ielāde. Lapai uz telefona jābūt ērtai: teksts lasāms bez palielināšanas, pogas viegli nospiežamas, nav horizontālās ritināšanas un elementi neiet ārpus ekrāna. Pārbaudiet ceļu, kuru iet klients: izlasīt, piezvanīt vai pasūtīt.

Pārbaudes saraksts

1. PageSpeed Insights rādītāji mobilajai versijai ir labā diapazonā (LCP, INP, CLS).
2. Attēli saspiesti, modernos formātos, ar norādītiem izmēriem.
3. Lieki skripti un logrīki noņemti.
4. CSS un JavaScript samazināti, atlikti nevajadzīgie.
5. Mazs skaits fontu.
6. Hostings ātrs, saspiešana un kešošana ieslēgta.
7. Mobilā versija pārbaudīta uz īsta tālruņa.

Ja nevēlaties paši ar to nodarboties, mēs veicam auditu un sakārtojam ātrumu kā daļu no darba pie mājaslapas.

Biežāk uzdotie jautājumi