Laten we het eerst en vooral hebben over wat Google Core Web Vitals Zijn. Ze zijn een aantal verschillende statistieken die Google gebruikt om uw site te evalueren. Ze bevatten parameters zoals paginabehandeling, hoe interactief de pagina is, ux/ui, afleidende afbeeldingen of andere elementen, en hoeveel het ontwerp verandert tijdens het scrollen van de pagina.
Deze statistieken zijn ontworpen om het voor websitemakers gemakkelijk te maken om hun sites te verbeteren en ze gebruiksvriendelijker te maken. Dus, wat zijn de statistieken?
Tabel met inhoud
- Metrics Google gebruikt om kernwebvitals te meten
- Waarom Google Core Web Vitals ertoe doen
- Hoe u uw huidige kernwebvitals kunt testen
- Hoe u uw vitale score van het web kunt verbeteren
- Verbeter uw grootste contentful Paint (LCP) -score
- Hoe u uw eerste inputvertraging (FID) score kunt verbeteren
- Hoe u uw cumulatieve lay -outverschuivingsscore (CLS) kunt verbeteren
- Bonus: versnelling van uw WordPress Elementor -site met elementor speed -optimizer om de kernwebvitals bij te houden
- Conclusie
Metrics Google gebruikt om kernwebvitals te meten
Google gebruikt drie statistieken om uw web vitale score te bepalen: LCP, FID en CLS. Elk meet een ander aspect van uw site. Hoewel deze termen een beetje technisch kunnen lijken, zijn ze in werkelijkheid vrij eenvoudig. Nou, om te begrijpen hoe Google de kernweb vitals meet, laten we eens kijken:
LCP
LCP staat voor het grootste content -punt. Dit meet in wezen alleen de initiële laadtijd van een webpagina. In het bijzonder meet het de waargenomen belastingssnelheid van de "hoofdinhoud". Hoofdinhoud verwijst naar de grootste afbeelding of tekstblok die op de pagina zichtbaar is wanneer deze begint te laden - en niet de hele pagina.
Dit is belangrijk om te begrijpen, omdat het geen inhoud meet niet In het oog wanneer de pagina wordt geladen - bijvoorbeeld, is de tekst van een artikel dat pas zichtbaar is na het scrollen. Het meet alleen het onmiddellijk zichtbare deel van de pagina.
Fid
Fid staat voor eerste invoervertraging. Deze metriek is een beetje genuanceerder, maar verwijst eigenlijk gewoon naar UX -interactiviteit en responsiviteit. Een lagere (betere) FID -score betekent dat uw pagina reageert en snel reageert op elke gebruikersinteractie. Wanneer ze bijvoorbeeld op een knop drukken of op een link klikken, meet Fid de tijd van de Gebruikersactie aan de Procesbegin.
Uw website moet het voor de browser van de gebruiker heel gemakkelijk maken om de actie te verwerken. Als een gebruiker op een knop klikt, maar het duurt een paar seconden voordat de actie begint, zal uw FID -score erger zijn, omdat dit een negatief effect heeft op de gebruikerservaring.
CLS
Eindelijk, CLS staat voor cumulatieve lay -outverschuiving. Dit volgt hoeveel de lay -out verschuift na De pagina is volledig geladen. Dit wordt meestal veroorzaakt door een van de twee dingen:
- Elementen zoals afbeeldingen worden een aanzienlijke hoeveelheid tijd geladen nadat de pagina zelf wordt geladen (meestal asynchroon)
- De gebruiker klikt op een knop of voert een andere actie uit, waardoor de originele lay -out op een verwarrende manier verandert.
Waarom Google Core Web Vitals ertoe doen
Nu weten we wat Google Web Vitals of Core Web Vitals zijn. Maar waarom doen ze er toe? En hoe beïnvloeden ze uw website en de zoekresultaten van Google?
Belangrijk effect op SEO
De grootste impact van uw vitale webscore is op zoekmachineoptimalisatie of SEO. Om uw website te evalueren, gebruikt Google webvitals-samen met andere statistieken zoals mobielvriendelijkheid, SSL, pop-ups (of gebrek daaraan) en inhoudskwaliteit.
Als zodanig is het erg belangrijk om ervoor te zorgen dat uw webvitals -scores goed zijn als u uw SEO wilt verbeteren en hoger lijkt in zoekresultaten.
Verloren verkopen
Als u een e -commerce -website runt, wilt u ook uw webvitals verbeteren. Websites die langzaam laden, trage knoppen en UX -elementen hebben en frequente lay -outverschuivingen hebben, zullen potentiële klanten wegjagen. Een langzame site lijkt minder betrouwbaar en maakt klanten aarzelend om betalingsinformatie in te voeren.
Hoe u uw huidige kernwebvitals kunt testen
Laten we nu naar uw website gaan en praten over hoe u uw eigen vitale scores kunt testen. Afhankelijk van uw technische vaardigheden, zijn er verschillende manieren om dit te doen. De eenvoudigste manier om ze te controleren, is echter via Google Page Insights, dus we zullen ons daar meestal op concentreren.
Merk op dat het normaal is dat er kleine verschillen tussen elk tool zijn, dus maak je geen zorgen als de cijfers anders zijn. Evenzo zullen de desktop- en mobiele testresultaten variëren.
Google PageSpeed Insights
Google biedt een tool om webvitals voor u te analyseren. Het wordt gebeld Pagespeed -inzichten En het geeft u een heleboel gegevens over uw site.
Om een test uit te voeren, typt u eenvoudig de URL van uw website in de bar en drukt u op Analyseren. Zodra de test is voltooid, ziet u de resultaten. Het eerste item behandelt kernweb vitals.
Als de scores niet bevredigend zijn, is de balk rood. U kunt ook klikken Bekijk de weergave voor meer informatie. U moet ook de instelling naar desktop schakelen om ervoor te zorgen dat uw scores daar ook goed genoeg zijn.
Laten we nu kort een paar andere opties behandelen om uw vitale scores te testen of kijken waar u staat volgens de kernwebvitals van Google.
Google Search Console
De Google Search Console is een tool die u kunt instellen met uw website om feedback en tips te krijgen voor het verbeteren van de prestaties van uw Google -zoekresultaten. In tegenstelling tot PageSpeed Insights, moet u verifiëren dat u het domein bezit door een TXT -record toe te voegen aan uw DNS -bevestiging.
Zodra u dit doet, kunt u zich aanmelden bij het Google Search Console Admin -paneel en vervolgens het tabblad Core Web Vitals op de linker zijbalk vinden.
De Web Vitals Extension
Als u de Google Chrome -browser gebruikt, is er nu een extensie die u kunt installeren om uw vitale scores in de browser te controleren. Het wordt gebeld Web Vitals En u kunt het downloaden van de Chrome Web Store.
Nadat u de extensie hebt geïnstalleerd, navigeert u eenvoudig naar de URL van uw website, klikt u op de knop Extensions in de bovenste navigatiebalk en vervolgens op de extensie Web Vitals. Na een moment ziet u de resultaten van de webvitalen:
Chrome Devtools en vuurtoren
Een andere optie voor Chrome -gebruikers is de Devtools Suite van Web Development Tools, die in de browser zelf is ingebouwd. Een van deze tools wordt LightHouse genoemd en hiermee kunt u de scores van de Web Vitals -scores controleren.
Navigeer naar uw website om vuurtoren te openen en klik vervolgens met de rechtermuisknop op de pagina. Uitkiezen Inspecteren en kies vervolgens de Vuurtoren Tab bovenaan:
Eenmaal daar, klik op Genereer rapport En wacht even tot het rapport is opgesteld. Dit rapport bevat scores voor toegankelijkheid, SEO, prestaties en andere statistieken.
Hoe u uw vitale score van het web kunt verbeteren
Dus je hebt de bovenstaande tests uitgevoerd en zie een behoefte aan verbetering. Laten we het hebben over het repareren van uw scores!
Het maakt niet uit welke methode u hierboven hebt gebruikt, u zou moeten als er problemen zijn. Sommige van de testmethoden (bijvoorbeeld paginaspeed -inzichten) geven u een lijst met verbeteringen rechtstreeks in de testresultaten. Maar er zijn ook enkele andere acties die u kunt ondernemen om uw scores te verbeteren.
Aangezien elk van de drie statistieken voor verschillende aspecten van uw site is, is het zinvol om de oplossingen afzonderlijk te organiseren. Voor de meeste websites is het onwaarschijnlijk dat u tegelijkertijd een probleem hebt met LCP, FID en CLS.
Verbeter uw grootste contentful Paint (LCP) -score
Laten we beginnen met de LCP -score. Zoals hierboven vermeld, meet deze score de initiële laadtijd van de hoofdinhoud op een pagina.
Wat een ideale score is
Wat is een ideale LCP -score? Volgens de Officiële Google Guide, U moet een LCP van 2,5 seconden of minder hebben. Over het algemeen laadt hoe sneller uw site beter is, hoe beter, dus probeer dit aantal zo laag mogelijk te maken.
Als uw LCP -score 2,5 seconden of hoger is, wat moet u dan doen? Laten we een paar oplossingen bespreken.
Gebruik een betere gastheer
Misschien is de gemakkelijkste oplossing om uw gastheer te upgraden. Hosts van hogere kwaliteit (zoals Convesio) zullen uw LCP -score verbeteren zonder dat u zelf veel hoeft te doen. De verbetering zal vooral merkbaar zijn als u momenteel een gedeeld hostingplan of een cloudhosting met één rij gebruikt.
Convesio is gebouwd met snelheid, schaalbaarheid en beveiliging in gedachten. Op basis van krachtige Google Compute-servers met containerized omgevingen en het uitvoeren van CloudFlare Enterprise voor snelheid en beveiliging, kunt u er zeker van zijn dat uw website met veel verkeerszaken stabiele pagina-laadtijden heeft.
PAGINA CACHING
De meeste hosts zullen hun eigen caching -oplossingen implementeren, maar u kunt ook een pagina -cache -plug -in zoals WP Rocket of WP Super Cache gebruiken. Deze plug -ins verminderen de hoeveelheid tijd die nodig is voordat uw site wordt geladen.
Verwijder ongebruikte JS en CSS & Verwijder of wijzigen de grootte van grote afbeeldingen
JavaScript- en CSS -bestanden zijn vaak enkele van de grootste bestanden, dus het betaalt zeker om ze te minimaliseren. Er zijn nogal wat verschillende manieren om dit te doen, variërend van een plug -in zoals WP Super Minify tot een meer handmatige oplossing zoals UglifyJS.
Evenzo wilt u misschien overwegen om alleen maar onnodige JavaScript- en CSS -code volledig te verwijderen. De meeste websites hebben nogal wat oude, ongebruikte code, dus het loont om een kijkje te nemen en te kijken of u iets kunt verwijderen.
Afbeeldingen zijn meestal de grootste bestanden op een website, vooral als ze niet zoveel mogelijk worden geoptimaliseerd en gecomprimeerd. Het is ook gebruikelijk om afbeeldingen te uploaden die onnodig breed zijn.
Als u afbeeldingen kunt verwijderen zonder de kwaliteit van uw inhoud te beïnvloeden, raden we dit aan. Zo niet, probeer dan uw afbeeldingen alleen breed genoeg te maken als dat nodig is. Voor de meeste apparaten betekent dit maximaal 2500 px breed. Alles wat groter is dan dit is meestal onnodig en heeft waarschijnlijk een negatieve invloed op de kernwebvitalen.
Gebruik een Content Delivery Network (CDN)
Een CDN- of content -leveringsnetwerk is een gedistribueerd netwerk van servers die uw website sneller helpen laden op basis van de locatie van de bezoeker. Als een bezoeker bijvoorbeeld in Europa is, laadt een CDN uw site van een server in de buurt en niet uit Noord -Amerika, Azië of waar anders uw huis ook is.
Verwijder ongebruikte plug -ins en thema's
Ten slotte is het altijd een goed idee om ongebruikte plug -ins en thema's te verwijderen. We raden aan periodiek door je geïnstalleerde thema's en plug -ins te gaan en er een te verwijderen die je al een tijdje niet meer hebt gebruikt.
Hoe u uw eerste inputvertraging (FID) score kunt verbeteren
Laten we nu eens kijken naar Fid. Als u zich uit de vorige sectie herinnert, houdt Fid zich bezig met interactiviteit en de vertraging tussen wanneer Er wordt een actie ondernomen En Het proces begint. Als u bijvoorbeeld op een knop klikt en vervolgens een actie heeft uitgevoerd.
Wat een ideale score is
Een goede FID -score moet volgens 100 milliseconden of minder zijn Google's Web.Dev -website.
Dus, als uw score meer dan 100 milliseconden is, wat kunt u dan doen om deze te verlagen? Voor het grootste deel is FID gerelateerd aan JavaScript -code, omdat JS wordt gebruikt in de meeste interactieve elementen.
Als zodanig is de beste manier om uw FID -score te verbeteren, uw JavaScript -code te optimaliseren en alles te verwijderen dat u niet gebruikt. Je moet ook een lichter front-end en minder zwaar thema hebben:
- Gebruik async om JavaScript te laden of uit te stellen.
- Controleer de WordPress Customizer om te zien of u een onnodige JavaScript -code hebt ingevoegd.
- Uw thema kan ook een apart gedeelte hebben om JS toe te voegen. Controleer het om ervoor te zorgen dat de code nog steeds in gebruik is.
- Verminder afhankelijkheden, indien mogelijk. Hoe meer afhankelijkheden uw code heeft, hoe meer u moet laden.
- Minify uw JavaScript met behulp van een plug -in zoals WP Super Minify of direct met behulp van UglifyJS.
Hoe u uw cumulatieve lay -outverschuivingsscore (CLS) kunt verbeteren
Laten we ten slotte kijken naar CLS, die meet hoeveel de lay -out verschuift.
Wat een ideale score is
Als we door Google naar de officiële web.dev -site kijken, wordt een goede score gedefinieerd als 0,1 of minder. Dit aantal wordt op een vrij complexe manier berekend, maar komt in wezen neer op het berekenen van de beweging van onstabiele elementen.
Als uw CLS -score boven 0,1 is, wat kunt u dan doen om deze te verbeteren? U hoeft meestal alleen bepaalde dimensies op te geven voor eventuele "flexibele" elementen. Dat wil zeggen, als de grootte of vorm van het element is gebaseerd op de schermgrootte van de gebruiker of een actie, zoals op een knop klikken.
- Afbeeldingen. Eerst moet u specifieke afmetingen maken voor alle afbeeldingen op uw site. Dit betekent dat u geen enorme afbeelding moet hebben (5000 px of meer) die de lay -out van de site aanzienlijk verandert op basis van het apparaat.
- Dynamische advertenties. Als u dynamische advertentieruimtes op uw site hebt, zorg er dan voor dat u een specifieke breedte en hoogte instelt voor het weergavevenster. Dit is vooral belangrijk omdat u anders meestal geen controle hebt over de grootte en vorm van de weergegeven advertenties.
- Insluit en iframes. Zorg er ten slotte voor dat ingebedde elementen (bijvoorbeeld YouTube -video's) specifieke afmetingen hebben ingesteld.
Andere tips en trucs
Ten slotte zijn hier ook een paar andere tips die waarschijnlijk uw scores zullen verbeteren. Hoewel u waarschijnlijk uw webvitals niet dramatisch zal verbeteren door deze te doen, zijn ze toch een goed idee. Deze kunnen een beetje pushen om Google Core Web Vitals -statistieken beter te ontmoeten.
Gebruik geoptimaliseerde lichtgewicht plug -ins en thema's
Helaas kunnen veel WordPress -thema's en plug -ins worden opgeblazen met onnodige of slecht geschreven code, externe functies en andere elementen. Deze maken uw site langzamer en kunnen soms de browser verstoren. Dit resulteert in lagere web vitale scores.
Houd plug -ins en thema's bijgewerkt
Het is altijd een goed idee om thema's en plug -ins bij te houden naar de nieuwste versie. Dit wordt meestal aanbevolen om beveiligingsredenen, maar er moet ook worden opgemerkt dat updates ook (normaal gesproken) de plug -in efficiënter maken. Naarmate ontwikkelaars verbeteren, zal dit ook uw vitale scores van het web verbeteren!
Bonus: versnelling van uw WordPress Elementor -site met elementor speed -optimizer om de kernwebvitals bij te houden
Elementor is een van de pioniers van pagina -bouwers in de WordPress -industrie. Het biedt enkele van de meest verbazingwekkende widgets en functies om in een korte tijd een professionele website te maken. Met zijn geweldige functies worden mensen gek en gebruiken ze een groot aantal widgets en functies om hun websites te maken.
En ten slotte eindigen ze met een website die traag is en niet op tijd wordt geladen. Daarom hebben ze een plug -in nodig die hun WordPress -sites zal versnellen.
De plug -in Snelheid Optimizer heeft veel interessante functies die het een van de beste speedbooster -plug -ins maken. De functie omvat,
Blacklist -modus
U kunt specifieke pagina's of berichten blokkeren van het laden van elementor -activa. Activeer de plug -in en u vindt opties om elke pagina te bekijken en op uw site te posten om hun extra activa te blokkeren voor het laden. U kunt ook maximaal 20 items op de gratis versie beperken (10 voor pagina's en berichten elk).
WooCommerce -booster
Elke seconde in uw WooCommerce -winkel kan beslissen tussen het verkrijgen of verliezen van een potentiële verkoop. U moet dus ervoor zorgen dat u klaar bent met de juiste WooCommerce -snelheidsoptimalisatiehulpmiddelen. In tegenstelling tot andere WordPress -cacheplug -ins, blokkeert een enkele klik van de plug -in allemaal allemaal onnodig Elementor -activa van het laden in uw WooCommerce -winkel.
Premium Elementor add-ons ondersteuning
Bovenop de Builder van Elementor Page ondersteunt deze plug-in de meest populaire Elementor-add-ons. Deze lijst bevat
- Elementskit voor elementor
- Essentiële addons voor elementor:
- Premium addons voor elementor
- Happy addons voor elementor.
- Power Pack addons voor elementor
Beperking van één klik
U kunt alle pagina's/berichten blokkeren van het laden van onnodige activa (caches, bestanden of query's) met een enkele klik in de blacklist -modus. Welkom bij de toekomst van WordPress -optimalisatie!
Verbeterde SEO -score
Met de juiste Google Page -snelheidsoptimalisatie via de plug -in, zal uw organische rangorde aanzienlijk verbeteren naarmate uw website sneller wordt geladen. Ook zal uw site mobielvriendelijker zijn. Dientengevolge zullen Google Core Web Vitals -statistieken zoals de grootste contentful verf (LCP), totale blokkeringstijd (TBT) en cumulatieve lay -outverschuiving (CLS) worden verbeterd.
Verbeterde prestatiescores
U kunt eenvoudig het verschil zien in uw pagina -laadtijd door uw URL online te testen. Er zijn veel vertrouwde online bronnen waar u dat kunt doen, inclusief GTMetrix en de Google Page Speed Tool.
Conclusie
In dit bericht hebben we alles behandeld wat je moet weten over Google Core Web Vitals. Eerst hebben we het gehad over de drie statistieken die Google gebruikt (LCP, FID en CLS) en hoe u uw eigen scores kunt ontdekken. Vervolgens liepen we door verschillende oplossingen om ze te verbeteren, waarvan de meeste gelukkig vrij eenvoudig zijn.