Mennyire létfontosságúak az alapvető webes vitálok?

Vizsgáljuk meg, hogyan használhatja a Lighthouse-t a pontos kérdések megtalálásához.

Nézd meg a világítótorony Core Web Vitals-ját

A Lighthouse megnyitásához kattintson a jobb gombbal a weboldal bármely pontjára, és válassza a lehetőséget Ellenőrizze.

Nike.com

Menj a Világítótorony jelentést és keresse meg a Lehetőségek felsorolja. Ezekből kiderül, hol lehet optimalizálni az oldal sebességét a fejlesztés révén.

Mennyire létfontosságúak az alapvető webes vitálok?

Az LCP ellenőrzése

Görgessen lefelé, és keresse meg, hol található Eredeti nyomkövetés megtekintése. Ezzel eljut az idővonalra, ahol megtalálhatja a Core Web Vitals naplózását.

Mennyire létfontosságúak az alapvető webes vitálok?

Az alábbi képernyőképen az FP (első festék), az FCP (első tartalmas festék) és az LCP látható az időzítésben.

Mennyire létfontosságúak az alapvető webes vitálok?

Ha bekerült az idővonalra, nagyíthat a képernyő megtekintéséhez. Ez segít megérteni, hogy a Lighthouse melyik elemet jelöli a legnagyobbnak.

Ebben az esetben ez egy nagy kép helyőrzője. Ez a helyőrző jó gyakorlat az LCP optimalizálásához.

Az alábbiakban még egy példa az LCP vizsgálatára. Figyelje meg, hogy mennyi ideig tartott a kép betöltése – ez gyenge LCP mutatót eredményezett.

Mennyire létfontosságúak az alapvető webes vitálok?Edition.cnn.com

A Lighthouse ismét megmutatja az ajánlott lehetőségeket és a webhely teljesítményének diagnosztikáját, hogy megtalálja a módját az LCP fejlesztésének

Mennyire létfontosságúak az alapvető webes vitálok?

Ez egy jó hely, ahol képernyőképet menthet a fejlesztője számára, és megoszthatja az ajánlásokat.

Performance Insights a Semrush-tól

Egy másik hely, ahol ötleteket szerezhet, Semrush.

A Site Audit eszközből a A webhely teljesítménye jelentés betekintést nyújt a feltérképezés során észlelt sebességgel kapcsolatos problémák megoldásába.

Minden kérdésnél láthatja, hogy pontosan hol történt, és ötleteket kaphat arról, hogyan javíthatja az LCP mutatóit.

Itt jelentést készít minden olyan kérdésről, amely JavaScript-et, lassú oldalbetöltési sebességet és optimalizálható HTML-t tartalmaz.

Mennyire létfontosságúak az alapvető webes vitálok?

Ha nem vagy olyan hozzáértő technikához, mint a fejlesztői csapat, akkor nehéz lehet eldönteni, hogy mit javítson ki először.

Egy jó út az, ha minél több konkrét információt gyűjtünk és megadunk a fejlesztőknek, hogy megoldást kínálhassanak az ő szempontjukból.

FID / TBT ellenőrzése

Ezután itt az ideje megvizsgálni az első beviteli késést – mennyi időbe telik, mire a felhasználó interakcióba lép az oldallal.

A Google web.dev cikke szerint „A hosszú első beviteli késések általában az Első tartalmas festék (FCP) és az Interaktív idő (TTI) között következnek be.”

Ennek szimulációval történő mérése érdekében az olyan eszközök, mint a Semrush és a Lighthouse, a teljes blokkolási időt (TBT) használják, amelyet a Google a FID helyettesítésére ajánl.

A TBT méri az Első tartalmas festék (FCP) és az Interaktív idő (TTI) közötti teljes időtartamot, és korrelál a FID-szel, rögzítve azokat a kérdéseket, amelyek befolyásolják az interaktivitást és laboratóriumi körülmények között beszerezhetők.

Az ellenőrzéshez megnézhetünk egy példát egy lassan betöltődő képre a Teljesítmény fülre a Dev konzolban. Rákattinthat Eredeti nyomkövetés megtekintése a Világítótorony jelentésben.

Ezután kapcsolja be a Web Vitals beállítást, hogy lássa, mikor Hosszú feladatok több mint 50 ms.

Mennyire létfontosságúak az alapvető webes vitálok?

Ezeken az eseteken lehet dolgozni a FID-en.

A Lighthouse néhány ajánlása, amely segíthet a FID-ben, a következők:

  • Kerülje a hosszú feladatokat.
  • Minimalizálja a főszál munkát.
  • A kérések száma alacsony legyen, az átviteli méretek pedig kicsiek legyenek.

Segíthet annak megnézésében, hogy mely JavaScript-szkriptek okozhattak hosszú feladatokat az oldalad számára.

CLS ellenőrzése

A kumulatív elrendezéseltolás az a mutató, amely alapvetően megmondja, hogy az oldal mennyire ugrik és változik a képekkel, betűtípusokkal és dinamikus elemekkel, például az előugró ablakokkal kapcsolatos problémák következtében.

Megtudhatja, hogy az oldal mely része váltott műszakot:

  • Lépjen a Teljesítmény fülre (kattintson a kattintásra Eredeti nyomkövetés megtekintése világítótorony jelentésében).
  • Lásd a Tapasztalat nyomon követni, hogy mikor történt műszak.
  • Nagyítás és keresés Elrendezés váltások megnézni, hogy az oldal melyik része hajtotta végre ezeket a váltásokat a betöltés során.

Mennyire létfontosságúak az alapvető webes vitálok?

Néhány javaslat a Világítótoronyban, amely segíthet az elrendezésváltások kezelésében:

Következtetés

Bár senki sem tudja, mekkora hatással lesz a Core Web Vitals a Google ranglistájára, mindig jobb, ha felkészült és tisztában van azzal, hogy hol készítheti el weboldalát gyorsabban, és jobb élményt nyújt.

Ezért javasoljuk a Semrush Site Audit és a Lighthouse használatát, hogy minden szükséges információt megszerezzen, hogy világos útmutatásokat nyújtson a fejlesztői csapatnak ezen életerők javításához.

Ne felejtsük el, hogy a Google maga is hangsúlyozta, hogy a „nagyszerű, releváns tartalomnak” továbbra is az elsődleges prioritásnak kell lennie – a kezdeti cél mellett az oldalélmény is hozzáadott tényező.

Leave a Reply

Your email address will not be published. Required fields are marked *