Novērst LCP kļūdu “Vairāk nekā nekā” PĢS Web Web Vitals
Saturs:
Google meklēšanā izlaida jaunu ziņojumukonsole ar nosaukumu Core Web Vitals. Šie aizstāja ātruma ziņojumus, un tos 2021. gadā uzskatīs par reitinga faktoru. Galvenie Web Vitals tiks uzskatīti par ranžēšanas faktoru kopā ar Page Speed, HTTPS. Draudzīgums mobilajām ierīcēm un citi faktori lapā.
Core Web Vital ņem vērā UX un UI elementus lapā, lai uzzinātu lapas vidējo rādītāju trim galvenajiem rādītājiem,
- LKP: Lielākā saturīgā krāsa
- FID: Pirmās ievades aizkave
- CLS: Kumulatīvā izkārtojuma maiņa
Nav konkrēta viena kodēta labojuma, ko atrisinātproblēmas, taču jūs varat optimizēt vietni, lai novērstu kļūdas. Šeit es uzskaitīšu dažas prakses, kas var palīdzēt atrisināt vislielāko saturīgo krāsu (LCP)Vairāk par' jūsu tīmekļa lapām.
↑ Kas ir LCP?
Lielākās satura krāsas (LCP) metrikas pārskatiskata portā redzamā lielākā satura elementa renderēšanas laiks. Vienkārši sakot, ir nepieciešams laiks, kad galvenais elements tiek ielādēts redzamajā ekrānā pēc lapas sākšanas.
Lai nodrošinātu labu lietotāja pieredzi, vietnēm jācenšas, lai pirmajā vietā tiktu parādīta vislielākā satura krāsa 2,5 sekundes sāk ielādēt.
↑ Kādi elementi tiek ņemti vērā LCP?
Lielākajai saturīgai krāsai paredzētie elementu veidi ir;
<img>elementi<attēls>elementi iekšpusē<svg>elements<video>elementi- Elements ar fona attēlu, kas ielādēts, izmantojot
URL ()funkciju - Bloka līmeņa elementi, kas satur teksta mezglus vai citus teksta līmeņa bērnus.
↑ Kādi ir augstas LCP cēloņi?
- Lēns servera atbildes laiks
- Renderēšanu bloķējošs JavaScript un CSS
- Lēni resursu ielādes laiki
- Klienta puses renderēšana
↑ Kā optimizēt vietni, lai novērstu augstu LCP?
Izmantojiet labu mitināšanu ar labu reakcijas laiku unzems latentuma līmenis. Pārliecinieties, ka optimizējat serverus, izmantojiet bezmaksas trešo pušu CDN, piemēram, Cloudflare, jsDelivr, Statically, lai ātri piegādātu statiskos līdzekļus. Ja strādājat ar WordPress, ir vairāki spraudņi, kas var palīdzēt paveikt darbu jūsu vietā.
Izmantojiet saspiestus attēlus ar nākamās paaudzes attēlu formātiempiemēram, JPEG XR, JPEG 2000 vai WebP. Šie modernie formāti palīdz paātrināt attēla ielādi par 50%. WordPress ir daži spraudņi, kas automātiski palīdz saspiest un pārveidot attēlus, atrodoties lidojumā. Izmantojiet arī attēlu CDN, piemēram, WP-Photon, lai samazinātu servera joslas platumu un palielinātu vietnes ātrumu.
Lai ielādētu statisku HTML, varat izmantot kešatmiņas pakalpojumuslapu, kas nemainās pēc katra pieprasījuma, kešatmiņa var novērst tās nevajadzīgu atjaunošanu. Kešatmiņas spraudņi saglabās ģenerētā HTML kopiju jūsu serverī, un, pieprasot lapu, serveris atbrīvo kešatmiņas slodzi, kas var samazināt laiku līdz pirmajam baitam (TTFB) un samazināt resursu izmantošanu.
Varat arī izmantot tādus pakalpojumus kā Cloudflare whichpalaiž servisa darbiniekus pārlūka fonā un var pārtvert pieprasījumus no servera. Viņi paņem pilnu lapas HTML kešatmiņu un vispirms apkalpo HTML lapu kešatmiņu, kas var ievērojami samazināt ielādes laiku.
Citas svarīgas lietas, kas jāņem vērā, ir vietnes optimizēšana, lai tā būtu laba
- Novērst renderēšanu bloķējošos JavaScript un CSS
- Atlikt nekritisko CSS
- Samazināt resursus
- Iepriekš ielādējiet svarīgus resursus
Jūs varat atrast detalizētāku rokasgrāmatu par to, kā optimizēt vietni, lai samazinātu LCP un padarītu jūsu lapas ātrāk ielādējamas, lai uzlabotu UX. oficiālā Web.Dev vietne.
Secinājums: Ieviešot galvenos tīmekļa vitālus PĢSun tas tiek uzskatīts par reitinga faktoru. LCP ir ļoti svarīga metrika, ko noteikt, jo tā ņem vērā laiku, kas vajadzīgs, lai ierīces skata logā tiktu ielādēts lielākais elements. Esmu sniedzis dažus provizoriskus labojumus un risinājumus, lai optimizētu vietni zemai LCP.
Triki