Google kondigt het Web Vitals-initiatief aan om ontwikkelaars uniforme richtlijnen te bieden over websiteprestaties met behulp van drie kernstatistieken.
Terug op de Chrome Developer Summit vorig jaar, Google nieuwe Chrome-ontwikkelaarstools aangekondigd om de laadtijd van de pagina te verkorten en een native app-achtige ervaring op te bouwen. Destijds besprak het bedrijf ook een initiatief om ontwikkelaars een uniforme set statistieken te bieden die ze kunnen meten bij het bouwen van websites met gebruikerservaring en prestaties in gedachten. In navolging van het oorspronkelijke idee heeft Google nu het Web Vitals-initiatief aangekondigd dat tot doel heeft dit te bieden "uniforme begeleiding voor kwaliteitssignalen die essentieel zijn voor het leveren van een geweldige gebruikerservaring op internet".
In de loop der jaren heeft Google verschillende tools aangeboden waarmee website-ontwikkelaars de prestaties van websites kunnen meten en rapporteren. Deze omvatten zaken als Vuurtoren, Chrome-ontwikkelaarstools
Kernwebvitaliteit is een subset van alle webvitaliteit die van toepassing is op alle webpagina's, moet worden gemeten door alle website-eigenaren en wordt weergegeven in alle Google-tools. Momenteel richten deze Core Web Vitals zich op drie aspecten van de gebruikerservaring – laden, interactiviteit en visuele stabiliteit – en omvatten de volgende statistieken (en hun respectieve drempels):
- Grootste inhoudsvolle verf (LCP): meet de laadprestaties. Om een goede gebruikerservaring te bieden, moet LCP plaatsvinden binnen 2,5 seconden nadat de pagina voor het eerst wordt geladen.
- Eerste invoervertraging (FID): meet interactiviteit. Om een goede gebruikerservaring te bieden, moeten pagina's een FID van minder dan 100 milliseconden hebben.
- Cumulatieve lay-outverschuiving (CLS): meet de visuele stabiliteit. Om een goede gebruikerservaring te bieden, moeten pagina's een CLS van minder dan 0,1 behouden
Om ontwikkelaars te helpen deze Core Web Vitals te meten en te rapporteren, streeft Google ernaar deze statistieken in zijn tools naar voren te brengen. Het volgende diagram geeft aan welke tools de Core Web Vitals ondersteunen:
Ontwikkelaars kunnen ook elke Core Web Vital in JavaScript meten met behulp van standaard web-API's en over elke Core Web Vital rapporteren zonder code te schrijven, met behulp van de Web Vitals Chrome-extensie. De extensie maakt gebruik van de web-vitals-bibliotheek om deze statistieken te meten en aan gebruikers weer te geven terwijl ze op internet surfen. De extensie kan ook nuttig zijn bij het begrijpen van de prestaties van uw websites, de websites van uw concurrenten en het internet als geheel. Als alternatief kunnen ontwikkelaars die deze statistieken liever meten met behulp van de onderliggende web-API's, de metrische handleidingen op de onderstaande website raadplegen voor implementatiedetails.
Naast de Core Web Vitals spreekt Google ook over andere Web Vitals die zullen dienen als proxy of aanvullende statistieken voor de Core Vitals. Deze omvatten statistieken zoals Time to First Byte (TTFB), First Contentful Paint (FCP), Total Blocking Time (TBT) en Time tot Interactive (TTI) waarmee ontwikkelaars een groter deel van de ervaring kunnen vastleggen of kunnen helpen bij het diagnosticeren van specifieke problemen problemen.
Het is vermeldenswaard dat deze Web Vitals en Core Web Vitals in de loop van de tijd zullen evolueren en dat ontwikkelaars toekomstige verbeteringen of toevoegingen aan de lijst mogen verwachten. Omdat de Core Web Vitals echter relevant zijn voor alle webpagina's en in verschillende Google-tools voorkomen, hebben eventuele wijzigingen in deze statistieken geen invloed op de definitie en drempelwaarden ervan. Ontwikkelaars worden ook vooraf op de hoogte gesteld van eventuele aankomende wijzigingen en een voorspelbaar, jaarlijks patroon. Vanwege het feit dat de andere Web Vitals context- of toolspecifiek zijn, kunnen hun definities en drempels met grotere frequentie veranderen zonder voorafgaande kennisgeving. Eventuele wijzigingen aan alle Web Vitals worden hierin gedocumenteerd openbare changelog.
Bron: web.dev