Websiteprestaties: Over Core Web Vitals

Leestijd 9 minuten
Core Web Vitals zijn een set van drie statistieken die de ervaring beoordelen die bezoekers hebben bij het browsen op je website. Deze statistieken meten de laadtijd, interactiviteit en visuele stabiliteit van je website.

Zoekmachines zoals Google houden rekening met Core Web Vitals bij het bepalen van de ranking van je website. Het verbeteren van deze statistieken verhoogt de zichtbaarheid van je website in zoekresultaten en verbetert ook de browse-ervaring van je bezoekers.


Wat zijn de Core Web Vitals?

Core Web Vitals zijn belangrijk omdat ze de prestaties van je website meten aan de hand van gegevens over het gebruik en de ervaring van bezoekers in de echte wereld, maar ook aan de hand van labgegevens van gesimuleerde sessies. Ze laten zien hoe je website momenteel presteert, en kunnen inzicht geven in gebieden die mogelijk verbeterd kunnen worden. 
De drie Core Web Vitals die momenteel door Google worden gebruikt, zijn de volgende:
  • Largest Contentful Paint (LCP): (Grootste weergave met content) Een indicatie van de laadtijd van een website. Meer specifiek is dit hoe lang het duurt voordat het grootste inhoudselement in de viewport van de website wordt geladen.
  • Interaction to Next Paint (INP): Een beoordeling van de responsiviteit van je website op alle klik-, tik- en toetsenbordinteracties die tijdens elk bezoek op elke pagina optreden. De uiteindelijke INP-waarde is de langste waargenomen interactie.
  • Cumulative Layout Shift (CLS): (Cumulatieve indelingsverschuiving) Een meting van onverwachte bewegingen van elementen die de opmaak van de pagina veranderen.
Deze vitale gegevens, samen met andere metingen, worden verzameld om een algemene score te geven voor de pagina's van je website.

De Largest Contentful Paint (LCP) verbeteren

De Largest Contentful Paint (LCP) meet de tijd die de browser nodig heeft om het grootste element te laden en weer te geven, met uitzondering van achtergrondafbeeldingen.

Houd rekening met de volgende informatie bij het verbeteren van je LCP:
  • Op tekst gebaseerde LCP-elementen: Voor op tekst gebaseerde LCP-elementen is prioriteit geven aan snel laden essentieel. Kiezen voor systeemlettertypen kan de prestaties aanzienlijk verbeteren. Als een aangepast lettertype echter nodig is, raden we aan om de WOFF2-indeling te gebruiken voor optimale resultaten.
    Tip: Schakel in de Studio Editor standaardlettertypen in als je LCP afhankelijk is van tekst en een aangepast lettertype bevat.
  • Op afbeeldingen gebaseerde LCP-elementen: Voor op afbeeldingen gebaseerde LCP-elementen is het het beste om afbeeldingen te uploaden in JPG- of WebP-indeling. Met name JPG's kunnen aanzienlijke bestandsgrootteverminderingen bieden, tot 10 keer lichter dan PNG's.
  • Andere tips: Om het laadproces te stroomlijnen en de ervaring van je bezoekers te verbeteren, moet je het ontwerp van je webpagina eenvoudig houden en onnodige inhoud minimaliseren. Overweeg om zware elementen zoals galerijen, video's en winkelwidgets onder de vouw te plaatsen om prioriteit te geven aan het sneller laden van kritieke inhoud. Vermijd het animeren van je LCP-elementen, omdat animaties zoals fade-in-effecten pas worden gestart als je website volledig is geladen.

De Interaction to Next Paint (INP) verbeteren

Het verbeteren van de Interaction to Next Paint (INP) omvat eenvoudige stappen om de prestaties van je website te stroomlijnen.

Om de INP van je website te verbeteren:

  1. Bekijk alle codefragmenten van derden die aan je website zijn toegevoegd. Je kunt deze fragmenten eenvoudig bekijken en beheren in de instellingen voor aangepaste code, marketingintegraties en scripts die zijn gekoppeld aan apps van derden. Overweeg om code te verwijderen die geen duidelijke waarde toevoegt aan de functionaliteit van je website.
  2. Beperk het aantal apps en widgets op elke pagina. Pagina's die overladen zijn met applicaties en widgets zijn meestal complexer en gevoeliger voor problemen. Vereenvoudig je pagina's waar mogelijk en onthoud je van overmatig gebruik van applicaties en widgets die niet essentieel zijn voor het doel van je website.

De Cumulative Layout Shift (CLS) verbeteren

Om de Cumulative Layout Shift (CLS) te verbeteren, moet je eenvoudige wijzigingen aanbrengen om de indeling van je website stabiel te houden.

Om de CLS van je website te verbeteren:

  1. Overweeg om de DOM-volgorde te herorganiseren:
    • Wix Editor: De DOM-volgorde wordt automatisch gestructureerd voor scripts van links naar rechts. Als je website echter een rechts-naar-links-schrift gebruikt, zoals Arabisch of Hebreeuws, moet je de DOM-volgorde handmatig aanpassen in het Lagen-paneel.
    • Editor X: Er is geen automatische DOM-volgorde in Editor X. Je kunt wel de volgorde van je componenten bekijken en herschikken via het Lagen-paneel.
      Let op: Editor X-websites worden overgezet naar Wix Studio, waar vergelijkbare functionaliteiten van toepassing zijn.
    • Studio Editor: Wix Studio-websites hebben een automatische DOM-volgorde, met de optie om de volgorde van de componenten te bekijken en aan te passen via het Lagen-paneel.
  2. Werk advertentieplaatsingen bij om hun impact op CLS te minimaliseren. Het plaatsen van banneradvertenties bovenaan de pagina kan de stabiliteit van de indeling verstoren. Overweeg in plaats daarvan om advertentiecomponenten onder de vouw te plaatsen, zoals bij Google AdSense-advertenties, om CLS-problemen te verminderen.

Tools voor het meten van prestaties

Je kunt verschillende tools gebruiken om inzicht te krijgen in de prestaties van je website. Deze tools bevatten meestal echte bezoekersgegevens en geschatte lab-gegevens. 
Belangrijk:
We raden ten zeerste aan om je te concentreren op echte bezoekersgegevens. Je kunt deze gegevens op twee plaatsen bekijken: het 'Echte gebruikerservaring voor websitebezoeker'-gedeelte van het Wix Websitesnelheid-dashboard en het 'Core Web Vitals-beoordeling'-gedeelte van Google PageSpeed Insights. Gebruik deze statistieken om het beste te begrijpen wat bezoekers van je website ervaren wanneer ze je website laden en erop navigeren. 

Klik hieronder voor meer informatie over tools voor prestatiemeting:


Het verschil tussen mobiele en desktop-scores

Wanneer je de Core Web Vitals van je website bekijkt, ontvang je twee verschillende rapporten: één voor mobiel en één voor desktop. Het is waarschijnlijk dat de twee totaalscores verschillend zullen zijn.

Een paar factoren dragen bij aan dit normale verschil in scores tussen mobiel en desktop, waaronder:
  • Mobiele apparaten hebben meestal langzamere processors dan desktops.
  • Mobiele netwerken (zoals 3G, 4G, LTE en 5G) kunnen langzamer zijn dan wifi- of ethernetverbindingen die door desktopapparaten worden gebruikt.

Core Web Vitals en SEO

Core Web Vitals zijn cruciale indicatoren van de prestaties van je website en behoren tot de verschillende factoren die in aanmerking worden genomen voor de SEO-ranking van je website.

De prestatie-SEO-boost wordt afzonderlijk toegepast op mobiele en desktoppagina's. Elke pagina, of deze nu mobiel of desktop is, kan maximaal drie boosts ontvangen, één voor elke Core Web Vital:
  • Goed: Geeft aan dat de statistieken een volledige SEO-boost krijgen (groen).
  • Redelijk: Geeft aan dat de statistiekscores een gedeeltelijke SEO-boost krijgen (geel).
  • Slecht: Geeft aan dat de statistieken geen SEO-boost krijgen (rood).

Een mobiele pagina kan bijvoorbeeld een gedeeltelijke SEO-boost krijgen voor LCP en INP, maar een volledige boost voor CLS.
Een screenshot met een gedeeltelijke SEO-boost voor LCP en INP, maar een volledige boost voor CLS.
Ondertussen kan de desktopversie van dezelfde pagina een volledige SEO-boost krijgen voor elke statistiek.
Een screenshot die laat zien hoe de desktopversie van dezelfde pagina een volledige SEO-boost kan krijgen voor elke statistiek.
Je Core Web Vitals-beoordeling wordt weergegeven als 'Mislukt', tenzij je een 'Goed'-score krijgt voor: alle drie de Core Web Vital-statistieken. Dit betekent niet dat de pagina geen boost heeft gekregen, omdat elke statistiek afzonderlijk een boost draagt.

Google Search streeft er altijd naar om de meest relevante inhoud weer te geven, zelfs als de pagina-ervaring niet perfect is. Voor de meeste vragen is er veel nuttige inhoud beschikbaar. Een goede pagina-ervaring kan dus bijdragen aan succes in de zoekresultaten.

Inhoud blijft de belangrijkste factor bij het handhaven van je SEO-score. We raden aan de inhoud van je website te optimaliseren en de metatags van je pagina bij te werken. Lees meer best practices voor SEO.

Veelgestelde vragen

Klik hieronder voor antwoorden op de meest gestelde vragen over Core Web Vitals.

Vond je dit artikel nuttig?

|