Via PageSpeed Insights kan je zelf testen hoe je website scoort op de core web vitals. Google geeft daar ook concrete suggesties om je website te verbeteren. Maar ook Google Search Console werd geüpdatet om webbeheerders meer inzicht te geven in de prestaties van hun website.

Wat is nieuw in Google Search Console?

Tot voor kort gaf Google Search Console scores op basis van groepen URL’s. Via ‘Site Vitaliteit’ kon je voor die URL-groepen scores bekijken voor de core web vitals.

Hoewel Search Console die groepen nog steeds evalueert, kan je nu een niveau dieper duiken. Klik je op zo’n URL-groep, dan opent een nieuwe pagina waar je rechts scores ziet voor individuele URL’s.

We're improving the Core Web Vitals report 🎉 From today we'll start surfacing URL-level data in the example URLs, and we've made some textual changes to the report to make it clearer. Read more about the Core Web Vitals report at https://t.co/fz0FD2uCH3 pic.twitter.com/7c12izliQr

— Google Search Central (@googlesearchc) August 22, 2022

In het bovenstaande voorbeeld van Google zie je duidelijk welke URL’s wat meer aandacht verdienen en welke nu al een goede score hebben. Je kan kortom gerichter en efficiënter werken aan de core web vitals van specifieke URL’s.

Toch komen uitschieters waarschijnlijk niet voor, laat Google weten via de helppagina. URL’s hebben een gemeenschappelijk framework. De kans dat een slechte score voor een groep afhankelijk is van één of enkele URL’s, is dus eerder klein.

De belangrijkste vernieuwing in PSI is een duidelijker onderscheid tussen lab data en field data. In PageSpeed Insights zie je nu, aan de hand van een kort tekstje, dat de data gebaseerd zijn op echte bezoekers. Voor sommige URL’s kan het gebeuren dat Google niet voldoende gegevens heeft van echte gebruikers. In dat geval krijg je alleen gegevens onder het tabbladje ‘Oorsprong’.

In PSI zie je nu een tekstje dat duidelijk maakt dat het over gebruikersgebaseerde data gaat.

Meer nieuwigheden

Via PSI kan je ook zien of je website slaagt voor de Core Web Vitals van Google. Waar dat vroeger getoond werd aan de hand van een label bovenaan de pagina, heeft Google die beoordeling nu eigen sectie en icoontje gegeven.

Nog nieuw is de mogelijkheid om op ‘Weergave uitvouwen’ te klikken onder de evaluatie van de site-vitaliteit. Een klik daarop geeft je meer details over de prestatie.

Ook de labels die aanduiden of het over desktop- of mobiele versie van je website gaat zijn aangepast. Het onderscheid tussen beide is nu duidelijker.

Tot slot heeft Google een extra vakje toegevoegd onderaan de statistieken van de Core Web Vitals. Daarin zie je meer informatie over de data die gebruikt werd om je score te berekenen, zoals de Chrome-versies, apparaten, bezoekduur en meer.

Die Core Web Vitals zijn een verzamelnaam voor drie nieuwe factoren die Google vanaf juni zal gebruiken om de rangschikking van de zoekresultaten te bepalen: hoe snel een pagina laadt, hoe snel een pagina interactief is en hoe veel (onverwachte) lay-outverschuivingen plaatsvinden.

Wat is Jetpack Boost?

Jetpack Boost is een plugin waarmee je in een paar klikken je website kan optimaliseren voor de Core Web Vitals. Voorlopig heeft Jetpack Boost drie functies:

• Optimaliseren van CSS
• Uitstellen van niet-essentiële JavaScripts
• Lady loading van afbeeldingen

Kort gezegd helpt de plugin je website sneller te maken voor een positieve impact op SEO. Hieronder kijken we naar elk van de drie functies die Jetpack Boost biedt.

Optimaliseren van CSS

CSS, voluit Cascading Style Sheets, is de code die browsers gebruiken om je website te bouwen. In die stylesheets wordt bepaald welke kleur je lettertype heeft, hoe elementen van je website gepositioneerd worden en andere zaken die bepalen hoe je website eruitziet.

Een webpagina is pas zichtbaar wanneer de CSS volledig gedownload is door een browser. En dat neemt tijd in beslag. Jetpack Boost versnelt dat proces door critial CSS te genereren. De plugin zorgt er daarmee voor dat het belangrijkste deel van de CSS eerst gedownload wordt, zodat een webpagina sneller kan worden getoond.

Hoewel nog niet alle CSS gedownload is, is je webpagina dus wel al leesbaar voor bezoekers. Zodra de meest noodzakelijke code opgehaald is, volgt de rest.

Uitstellen van niet-essentiële JavaScripts

De tweede functie heeft te maken met JavaScript. Net zoals bij CSS, maakt Jetpack Boost een onderscheid tussen essentiële en niet-essentiële code.

Opnieuw krijgt je bezoeker de belangrijkste informatie meteen te zien. JavaScript onder de vouw van het scherm wordt pas later geladen. Een video op je website die een bezoeker pas ziet wanneer hij of zij gaat scrollen, wordt met andere woorden pas geladen als de noodzakelijke code opgehaald is.

Bezoekers krijgen dankzij die optimalisatie sneller een leesbare en interactieve website.

Lazy loading van afbeeldingen

Lazy loading houdt in dat afbeeldingen op een pagina, onder de vouw van het scherm, pas worden geladen wanneer bezoekers scrollen. Ook die derde functie in Jetpack Boost zorgt voor een snellere website.

Of die laatste functie een groot verschil maakt, is niet helemaal duidelijk. In WordPress zelf zit die functie namelijk ook al.

Handig aan Jetpack Boost is in ieder geval dat je zelf kiest welke functies je in- en uitschakelt. Lazy loading hoef je dus niet aan te zetten.

Vroege versie

Voor ervaren webdesigners of -ontwikkelaars is Jetpack Boost geen wereldschokkende nieuwigheid. Je kan ook zelf onder de motorkap van je website duiken om CSS of JavaScript te optimaliseren. Maar voor wie minder ervaring heeft, is de plugin wel de moeite waard om te proberen.

Zodra je Jetpack Boost hebt geïnstalleerd en geactiveerd, hoef je alleen nog een of meerdere functies in te schakelen. Wanneer je de CSS-functie aanzet, moet je wel even wachten tot de plugin kritieke CSS gegenereerd heeft.

Onthoud wel dat Jetpack Boost nog in de kinderschoenen staat. De plugin is pas aan zijn eerste officiële versie toe. De plugin is compatibel met de laatste WordPress-versie, maar je controleert na elke functie die je inschakelt best wel even of je website nog oogt en werkt zoals dat moet. Bij foutjes kan een functie uitschakelen of, indien nodig, de volledige plugin.

Achter de schermen werkt Automattic nog volop aan verbeteringen. En ook nieuwe functies mogen we op termijn verwachten.