core web vitals header image

Google maakt Core Web Vitals een belangrijk onderdeel van zijn ranking factor in 2021. Dit betekent dat uw website zal worden beoordeeld op basis van deze 3 statistieken, en uw zoekopdracht ranking dienovereenkomstig beïnvloed. Kortom, Core Web Vitals zijn een nieuwe set prestatiestatistieken die aspecten van de ontwikkeling van webpagina’s benadrukken die van invloed zijn op de gebruikerservaring (UX); deze omvatten het laden van pagina’s, interactiviteit en visuele stabiliteit. Deze statistieken zullen ook de belangrijkste maat zijn om te worden weergegeven in ‘Google topverhalen’, een carrousel met topresultaten die aan het begin van een zoekresultaat van Google worden weergegeven.

Om met deze verandering om te gaan, gaan we duiken in wat deze statistieken zijn, hoe ze uw website zullen beïnvloeden en hoe u uw SEO-strategie in 2021 benaderen.

LCP – Grootste contentful paint

LCP is hoe lang het duurt voordat een pagina wordt geladen vanuit het oogpunt van een werkelijke gebruiker.

Met andere woorden: het is de tijd van het klikken op een link naar het zien van de meerderheid van de inhoud op het scherm.

Hier volgen enkele dingen die u doen om de LCP van uw site te verbeteren:

  1. Alle scripts van derden verwijderen
  2. Uw webhost upgraden: betere hosting=snellere laadtijden in het algemeen (inclusief LCP).
  3. Lazy loading instellen: Lazy loading maakt het zo dat afbeeldingen alleen worden geladen wanneer iemand naar beneden schuift op je pagina. Dat betekent dat u LCP aanzienlijk sneller bereiken.
  4. Grote pagina-elementen verwijderen: Google PageSpeed Insights zal u vertellen of uw pagina een element heeft dat de LCP van uw pagina vertraagt.
  5. Minify uw CSS: Omvangrijke CSS kan de LCP-tijden aanzienlijk vertragen.
  6. Caching: Het opslaan van zware delen van een website, zodat deze sneller kan worden geladen. Dit kan client-side, server-side of in de browser, om laadsnelheden en gebruikerservaring te verbeteren

FID – Eerste invoervertraging

FID meet de tijd die een gebruiker nodig heeft om daadwerkelijk met uw pagina te communiceren.

Voorbeelden van interacties zijn:

  • Een optie kiezen in een menu
  • Klikken op een link in de navigatie
  • Uw e-mail invoeren in een veld
  • Het openen van “accordeontekst” op mobiele apparaten

Google vindt FID belangrijk omdat het rekening houdt met de manier waarop gebruikers in het echte leven omgaan met websites.

En net als LCP, ze hebben specifieke criteria voor wat een aanvaardbare FID.

FID meet technisch hoe lang het duurt om iets te gebeuren op een pagina. Dus in die zin is het een pagina snelheid score. Maar het gaat een stap verder dan dat en meet de tijd die het duurt voor gebruikers om daadwerkelijk iets te doen op uw pagina.

Hier zijn enkele dingen die u doen om de FID-scores van uw site te verbeteren.

Minimaliseer (of uitstel) JavaScript: Het is bijna onmogelijk voor gebruikers om te communiceren met een pagina, terwijl de browser is het laden van JS. Dus het minimaliseren of uitstellen van JS op uw pagina is de sleutel voor FID.

  1. Alle niet-kritieke scripts van derden verwijderen: Net als bij LCP kunnen scripts van derden (zoals Google Analytics, heatmaps enz.) een negatieve invloed hebben op FID.
  2. Een browsercache gebruiken: zo u inhoud op uw pagina sneller laden. Dat helpt de browser van uw gebruiker nog sneller door JS-laadtaken te blazen.

CLS – Cumulatieve lay-out Shift

Cumulatieve Layout Shift (CLS) is hoe stabiel een pagina is als het laadt (aka “visuele stabiliteit”).

Met andere woorden: als elementen op uw pagina bewegen als de pagina wordt geladen, dan heb je een hoge CLS. Wat slecht is. In plaats daarvan wilt u dat uw pagina-elementen vrij stabiel zijn naarmate deze worden op geladen. Op die manier hoeven gebruikers niet opnieuw te leren waar koppelingen, afbeeldingen en velden zich bevinden wanneer de pagina volledig is geladen. Of klik per ongeluk op iets.

Dit zijn de specifieke criteria die Google heeft voor CLS:

< Nerd alert>

Google gebruikt een statistiek genaamd “Layout Shift Score”. Deze score wordt berekend door 2 hoofdfactoren te vermenigvuldigen:

  1. Impact fractie: meet hoe instabiele elementen het viewportgebied tussen twee frames beïnvloeden: het resultaat wordt weergegeven als a
  2. Afstandsfractie: de afstandsfractie is de grootste afstand die een instabiel element in het frame heeft verplaatst (horizontaal of verticaal) gedeeld door de grootste dimensie van de viewport (breedte of hoogte, afhankelijk van welke groter is); dit wordt ook weergegeven als een %

Dus, Layout Shift Score = Impact Fractie * Afstandsfractie.

Bijvoorbeeld; als uw IF 75% was en uw DF 25% was, dan is uw Layout Shift-score:
0,75 * 0,25 = 0,1875

</Nerd alert>

Hier zijn enkele eenvoudige dingen die je doen om CLS te minimaliseren:

  1. Afmetingen van de instelgroottekenmerken gebruiken voor alle media (video, afbeeldingen, GIF’s, infographics enz.): Op die manier weet de browser van de gebruiker precies hoeveel ruimte dat element op die pagina in beslag neemt. En zal het niet veranderen on the fly als de pagina volledig laadt.
  2. Zorg ervoor dat advertentie-elementen een gereserveerde ruimte hebben: anders kunnen ze plotseling op de pagina verschijnen en de inhoud omlaag, omhoog of aan de zijkant duwen.
  3. Nieuwe UI-elementen onder de vouw toevoegen: op die manier duwen ze de inhoud niet naar beneden dat de gebruiker “verwacht” te blijven waar het is.

Tools voor testen

PageSpeed Insights

Je eerste stop meten web vitals moet PageSpeed Insights zijn. U krijgt zowel labgegevens als veldgegevens (indien beschikbaar) in één rapport. U krijgt ook verschillende andere statistieken die grotendeels verband houden met het verbeteren van falende pagina’s, met name bevindingen die van invloed zijn op de snelheid van een pagina en het downloaden van de assets.

PageSpeed Insights

Web Vitals Chrome Extension

Met de Chrome-extensie hebt u toegang tot Web Vitals bij het laden van pagina’s en zoals besproken, u communiceren met de pagina om problemen op te lossen voor het geval u problemen hebt met First Input Delay en of Content Layout Shift. Het is ook beschikbaar voor u pagina-to-page als u websites bladert.

Check out Web Vitals Chrome Extention

WebPageTest

Met deze onafhankelijke testtool u uw aanpak met verschillende voorwaarden configureren. Gebouwd door Google-technici die deel uitmaken van het Chromium-team, is de informatie net zo gezaghebbend als alles wat je van Google zelf krijgt en maakt RESTful API’s beschikbaar.

WebPageTest

Google Search Console

Als u het eigendom van uw website nog niet hebt geverifieerd om Google Search Console te gebruiken, moet u dit gaan doen om hulp te bieden bij het insinteveren in probleemgebieden met pagina’s die niet in het veld zijn, ervan uitgaande dat u in CrUX wordt weergegeven. U inzoomen om groepen pagina’s met vergelijkbare problemen te zoeken. Uiteindelijk linkt het je aan PageSpeed Insights.

Bekijk Google Search Console

Web Vitals JavaScript API’s

Gebruik JavaScript om rechtstreeks vanuit de browser toegang te krijgen tot de statistieken en ze door te sturen naar een repository naar keuze. U de test ook introduceren in uw ontwikkelingsproces en ervoor zorgen dat wijzigingen die u aanbrengt, uw scores niet negatief beïnvloeden nadat u naar productie bent drijft.

Web Vitals Javascript API

Chrome Dev Tools

Chrome zelf biedt de ultieme set tools voor het ontdekken of traceren van rugproblemen met behulp van de zeer gedetailleerde informatie die beschikbaar is in rapporten en paginabelastingopnames op het tabblad Prestaties. The extensive array of tools and endless switches and options are ideal for the most exacting optimization work.

Check out Chrome Dev Tools

Hoe beïnvloedt dit uw website?

Er zijn bepaalde richtlijnen en statistieken die traditioneel worden gebruikt in webontwikkeling om prestatieoptimalisatie en SEO-ranking te bieden. Deze zullen aanzienlijk veranderen; Als u nu een eerste pagina Google-zoekwebsite bent, is dat mogelijk niet het geval zodra Google in mei 2021 zijn Core Web Vitals-statistieken implementeert. Google’s “top verhalen” zal ook worden gebaseerd op dezelfde statistieken; meer nadruk te leggen op hoe belangrijk het is om voorbereid te zijn op deze statistieken.

Om u voor te bereiden op deze verandering in het speelveld, raden we u aan een Core Web Vitals-audit te krijgen om uw huidige score te beoordelen en te bepalen welke gebieden verbeterd moeten worden. Zodra deze gebieden zijn geïdentificeerd, is het tijd om te beginnen met het verbeteren van deze scores!

Voor meer informatie over Core Web Vitals, hoe dit uw website zal beïnvloeden, of als u wilt informeren over het krijgen van een audit, neem dan hieronder contact met ons op.