Comment les seuils des métriques Core Web Vitals ont été définis

Recherche et méthodologie derrière les seuils des métriques Core Web Vitals

Bryan McQuade

Barry Pollard

Publié le 21 mai 2020

Les Core Web Vitals sont un ensemble de métriques sur le terrain qui mesurent des aspects importants de l'expérience utilisateur réelle sur le Web. Core Web Vitals inclut des métriques, ainsi que des seuils cibles pour chaque métrique, qui aident les développeurs à comprendre qualitativement si l'expérience sur leur site est "bonne", "à améliorer" ou "médiocre". Cet article explique l'approche utilisée pour choisir les seuils des métriques Core Web Vitals en général, ainsi que la manière dont les seuils de chaque métrique Core Web Vitals spécifique ont été choisis.

Rappel: Métriques et seuils Core Web Vitals

Les Core Web Vitals sont trois métriques: Largest Contentful Paint (LCP), Interaction to Next Paint (INP) et Cumulative Layout Shift (CLS). Chaque métrique mesure un aspect différent de l'expérience utilisateur: le LCP mesure la vitesse de chargement perçue et marque le point dans le calendrier de chargement de la page où le contenu principal de la page a probablement été chargé ; l'INP mesure la réactivité et quantifie l'expérience ressentie par les utilisateurs lorsqu'ils tentent d'interagir avec la page ; et le CLS mesure la stabilité visuelle et quantifie la quantité de changement de mise en page inattendu du contenu visible de la page.

Chaque métrique Core Web Vitals est associée à des seuils qui classent les performances en trois catégories : "Bon", "Amélioration nécessaire" ou "Médiocre" :

De plus, pour classer les performances globales d'une page ou d'un site, nous utilisons la valeur du 75e percentile de toutes les pages vues sur cette page ou ce site. En d'autres termes, si au moins 75 % des pages vues d'un site atteignent le seuil "Bon", le site est classé comme ayant de bonnes performances pour cette métrique. À l'inverse, si au moins 25 % des pages vues atteignent le seuil de "mauvais", le site est classé comme ayant des performances "mauvaises". Par exemple, un LCP au 75e centile de 2 secondes est classé comme "bon", tandis qu'un LCP au 75e centile de 5 secondes est classé comme "médiocre".

Critères pour les seuils des métriques Core Web Vitals

Dans cette section, nous allons examiner les critères d'évaluation des seuils des métriques Core Web Vitals. Les sections suivantes expliquent plus en détail comment ces critères ont été appliqués pour sélectionner les seuils de chaque métrique. Nous prévoyons d'apporter des améliorations et des ajouts aux critères et aux seuils afin de mieux mesurer les expériences utilisateur de qualité sur le Web.

Expérience utilisateur de qualité

Notre objectif principal est d'optimiser l'expérience utilisateur et la qualité de son expérience. Par conséquent, nous nous efforçons de nous assurer que les pages qui atteignent les seuils "bon" des métriques Core Web Vitals offrent une expérience utilisateur de haute qualité.

Pour identifier un seuil associé à une expérience utilisateur de qualité, nous nous appuyons sur la perception humaine et les recherches en IHM. Bien que cette recherche soit parfois résumée à l'aide d'un seul seuil fixe, nous constatons que la recherche sous-jacente est généralement exprimée sous la forme d'une plage de valeurs. Par exemple, les recherches sur la durée d'attente moyenne des utilisateurs avant de perdre leur attention sont parfois décrites comme étant d'une seconde, alors que la recherche sous-jacente est en réalité exprimée sous la forme d'une plage, allant de centaines de millisecondes à plusieurs secondes. Le fait que les seuils de perception varient en fonction de l'utilisateur et du contexte est confirmé par les données de métriques Chrome agrégées et anonymisées, qui montrent qu'il n'existe pas de durée unique d'attente pour que les utilisateurs voient le contenu d'une page Web avant d'interrompre le chargement de la page. Ces données montrent plutôt une distribution fluide et continue. Pour en savoir plus sur les seuils de perception humaine et les recherches pertinentes sur l'IHM, consultez La science derrière les Web Vitals.

Lorsque des recherches pertinentes sur l'expérience utilisateur sont disponibles pour une métrique donnée et qu'il existe un consensus raisonnable sur la plage de valeurs dans la littérature, nous utilisons cette plage comme entrée pour guider notre processus de sélection des seuils. Lorsque des recherches pertinentes sur l'expérience utilisateur ne sont pas disponibles, comme pour une nouvelle métrique telle que le décalage de mise en page cumulé, nous évaluons plutôt des pages réelles qui répondent à différents seuils candidats pour une métrique, afin d'identifier un seuil qui offre une bonne expérience utilisateur.

Réalisables par le contenu Web existant

De plus, pour nous assurer que les propriétaires de sites peuvent optimiser leurs sites pour atteindre les seuils "bons", nous exigeons que ces seuils soient atteignables pour les contenus existants sur le Web. Par exemple, bien que zéro milliseconde soit un seuil "bon" idéal pour le LCP, ce qui permet d'obtenir des expériences de chargement instantanées, un seuil de zéro milliseconde n'est pas réalisable dans la plupart des cas, en raison des latences de traitement du réseau et de l'appareil. Par conséquent, zéro milliseconde n'est pas un seuil raisonnable pour la métrique LCP "Bon" dans Core Web Vitals.

Lorsque nous évaluons les seuils "bons" des métriques Core Web Vitals, nous vérifions qu'ils sont atteignables, en nous appuyant sur les données du rapport d'expérience utilisateur Chrome (CrUX). Pour confirmer qu'un seuil est atteignable, nous exigeons qu'au moins 10 % des origines atteignent le seuil "bon". De plus, pour nous assurer que les sites bien optimisés ne sont pas mal classés en raison de la variabilité des données sur le terrain, nous vérifions également que le contenu bien optimisé atteint systématiquement le seuil "bon".

À l'inverse, nous établissons le seuil "mauvais" en identifiant un niveau de performances que seule une minorité d'origines ne respecte pas. Sauf si des recherches sont disponibles pour définir un seuil de "mauvais", par défaut, les 10 à 30% des origines les moins performantes sont classées comme "mauvaises".

Indique si les critères doivent être identiques ou différents pour chaque appareil.

L'utilisation des appareils mobiles et des ordinateurs de bureau présente généralement des caractéristiques très différentes en termes de fonctionnalités de l'appareil et de fiabilité du réseau. Cela a un impact important sur les critères d'"atteignabilité" et suggère donc que nous devrions envisager des seuils distincts pour chacun.

Toutefois, les attentes des utilisateurs concernant une bonne ou une mauvaise expérience ne dépendent pas de l'appareil, même si les critères d'accessibilité le font. C'est pourquoi les seuils recommandés pour les Core Web Vitals ne sont pas répartis par appareil et que le même seuil est utilisé pour les deux. Cela présente également l'avantage de rendre les seuils plus faciles à comprendre.

De plus, les appareils ne se prêtent pas toujours bien à une catégorie. Cela doit-il être basé sur le facteur de forme de l'appareil, la puissance de traitement ou les conditions du réseau ? Avoir les mêmes seuils présente l'avantage d'éviter cette complexité.

La nature plus limitée des appareils mobiles signifie que la plupart des seuils sont donc définis en fonction de la faisabilité sur mobile. Il s'agit probablement de seuils pour les appareils mobiles, et non d'un véritable seuil commun pour tous les types d'appareils. Toutefois, étant donné que la plupart des sites enregistrent une majorité de trafic sur mobile, ce problème est moins préoccupant.

Réflexions finales sur les critères

Lors de l'évaluation des seuils candidats, nous avons constaté que les critères étaient parfois en conflit les uns avec les autres. Par exemple, il peut y avoir une tension entre un seuil atteignable de manière cohérente et une expérience utilisateur de qualité constante. De plus, étant donné que les recherches sur la perception humaine fournissent généralement une plage de valeurs et que les métriques sur le comportement des utilisateurs montrent des changements graduels de comportement, nous avons constaté qu'il n'y avait souvent pas de seuil "correct" unique pour une métrique. Par conséquent, notre approche pour les Core Web Vitals a consisté à choisir les seuils qui répondent le mieux aux critères, tout en reconnaissant qu'il n'existe pas de seuil parfait et que nous pouvons parfois devoir choisir parmi plusieurs seuils candidats raisonnables. Plutôt que de nous demander "Quel est le seuil parfait ?", nous nous sommes concentrés sur la question "Quel seuil candidat répond le mieux à nos critères ?".

Choix du centile

Comme indiqué précédemment, pour classer les performances globales d'une page ou d'un site, nous utilisons la valeur du 75e percentile de toutes les visites de cette page ou de ce site. Le 75e percentile a été choisi sur la base de deux critères. Tout d'abord, le percentile doit s'assurer qu'une majorité de visites sur une page ou un site ont atteint le niveau de performances cible. Deuxièmement, la valeur au centile choisi ne doit pas être trop affectée par les valeurs aberrantes.

Ces objectifs sont quelque peu contradictoires. Pour atteindre le premier objectif, un percentile plus élevé est généralement préférable. Toutefois, avec des percentiles plus élevés, la probabilité que la valeur obtenue soit affectée par des valeurs aberrantes augmente également. Si quelques visites d'un site se produisent sur des connexions réseau instables, ce qui entraîne des échantillons LCP excessivement importants, nous ne voulons pas que la classification de notre site soit déterminée par ces échantillons atypiques. Par exemple, si nous évaluons les performances d'un site avec 100 visites à l'aide d'un centile élevé tel que le 95e, il ne faudra que cinq échantillons d'écarts pour que la valeur du 95e centile soit affectée par les écarts.

Étant donné que ces objectifs sont un peu contradictoires, après analyse, nous avons conclu que le 75e percentile représentait un équilibre raisonnable. En utilisant le 75e centile, nous savons que la plupart des visites sur le site (3 sur 4) ont atteint le niveau de performances cible ou mieux. De plus, la valeur du 75e centile est moins susceptible d'être affectée par des valeurs aberrantes. Pour reprendre notre exemple, pour un site avec 100 visites, 25 de ces visites devraient générer des échantillons d'écarts importants pour que la valeur au 75e percentile soit affectée par des écarts. Bien que 25 échantillons sur 100 puissent être des valeurs aberrantes, cela est beaucoup moins probable que pour le 95e centile.

Largest Contentful Paint

Les seuils de LCP ont été définis en tenant compte des considérations suivantes sur la qualité de l'expérience et la faisabilité.

Qualité de l'expérience

Une seconde est souvent citée comme la durée d'attente d'un utilisateur avant qu'il ne commence à perdre son attention sur une tâche. Après examen approfondi des recherches pertinentes, nous avons constaté qu'une seconde est une approximation pour décrire une plage de valeurs, allant d'environ quelques centaines de millisecondes à plusieurs secondes.

Deux sources couramment citées pour le seuil de 1 seconde sont Card et al. et Miller. Card définit un seuil de "réponse immédiate" de 1 seconde, citant les théories unifiées de la cognition de Newell. Newell définit les réponses immédiates comme "des réponses qui doivent être apportées à un stimulus dans un délai d'environ une seconde (c'est-à-dire entre environ 0, 3 et 3 secondes)." Cela fait suite à la discussion de Newell sur les "contraintes en temps réel sur la cognition", où il est indiqué que "les interactions avec l'environnement qui évoquent des considérations cognitives se produisent de l'ordre de quelques secondes", qui varient d'environ 0,5 à 2 à 3 secondes. Miller, une autre source couramment citée pour le seuil de 1 seconde, note que "les tâches que les humains peuvent et vont effectuer avec les communications machine changeront sérieusement de caractère si les délais de réponse sont supérieurs à deux secondes, avec une extension possible d'une seconde environ."

La recherche de Miller et Card décrit la durée d'attente d'un utilisateur avant de perdre la concentration comme une plage, allant d'environ 0,3 à 3 secondes, ce qui suggère que notre seuil de LCP "bon" devrait se situer dans cette plage. De plus, étant donné que le seuil "bon" existant pour First Contentful Paint est de 1 seconde et que le Largest Contentful Paint se produit généralement après First Contentful Paint, nous limitons davantage notre plage de seuils LCP candidats, de 1 seconde à 3 secondes. Pour choisir le seuil de cette plage qui répond le mieux à nos critères, nous examinons ensuite la faisabilité de ces seuils candidats.

Atteignabilité

À l'aide des données de CrUX, nous pouvons déterminer le pourcentage d'origines sur le Web qui atteignent nos seuils de "bon" pour le LCP candidat.

Bien que moins de 10% des origines atteignent le seuil de 1 seconde, tous les autres seuils de 1, 5 à 3 secondes répondent à notre exigence selon laquelle au moins 10% des origines doivent atteindre le seuil "bon". Ils sont donc toujours des candidats valides.

De plus, pour nous assurer que le seuil choisi est toujours atteignable pour les sites bien optimisés, nous analysons les performances du LCP pour les sites les plus performants sur le Web afin de déterminer les seuils qui sont toujours atteignables pour ces sites. Plus précisément, nous cherchons à identifier un seuil qui peut être atteint de manière cohérente au 75e centile pour les sites les plus performants. Nous constatons que les seuils de 1,5 et 2 secondes ne sont pas toujours atteints, tandis que le seuil de 2,5 secondes l'est.

Pour identifier un seuil "mauvais" pour le LCP, nous utilisons les données CrUX pour identifier un seuil atteint par la plupart des origines:

Pour un seuil de 4 secondes, environ 26% des origines de téléphone et 21% des origines d'ordinateur seraient classées comme médiocres. Ce résultat se situe dans la fourchette cible de 10 à 30 %. Nous concluons donc que 4 secondes est un seuil acceptable pour "mauvais".

Nous concluons donc que 2,5 secondes est un seuil "bon" raisonnable et que 4 secondes est un seuil "mauvais" raisonnable pour le LCP.

Valeur INP

Les seuils d'INP ont été définis en tenant compte des considérations suivantes sur la qualité de l'expérience et la faisabilité.

Qualité de l'expérience

Les recherches concluent de manière relativement cohérente que les retards de retour visuel pouvant aller jusqu'à environ 100 ms sont perçus comme étant causés par une source associée, telle qu'une entrée utilisateur. Cela suggère qu'un seuil d'interaction "bon" idéal pour la peinture suivante serait proche de celui-ci.

L'article Response Times: The 3 Important Limits (Temps de réponse : les trois limites importantes) de Jakob Nielsen, couramment cité, définit 0,1 seconde comme limite pour que l'utilisateur ait l'impression que le système réagit instantanément. Nielsen cite Miller et Card, qui cite The Perception of Causality (La perception de la causalité) de Michotte, publié en 1962. Dans la recherche de Michotte, les participants à l'expérience voient "deux objets sur un écran. L'objet A se met en route et se dirige vers l'objet B. Il s'arrête au moment où il entre en contact avec B, tandis que ce dernier démarre et s'éloigne de A." Michotte varie l'intervalle de temps entre l'arrêt de l'objet A et le début du mouvement de l'objet B. Michotte constate que, pour des retards allant jusqu'à environ 100 ms, les participants ont l'impression que l'objet A provoque le mouvement de l'objet B. Pour les retards allant de 100 ms à 200 ms environ, la perception de la causalité est mitigée. Pour les retards de plus de 200 ms, le mouvement de l'objet B n'est plus considéré comme ayant été causé par l'objet A.

De même, Miller définit un seuil de réponse pour "Réponse à l'activation de la commande" comme "l'indication d'action donnée, habituellement, par le mouvement d'une touche, d'un bouton ou d'un autre élément de commande qui signale qu'il a été activé physiquement. Cette réponse doit être perçue comme faisant partie de l'action mécanique induite par l'opérateur. Délai temporel: pas plus de 0,1 seconde", puis "le délai entre l'enfoncement d'une touche et le retour visuel ne doit pas dépasser 0,1 à 0,2 seconde".

Plus récemment, dans Towards the Temporally Perfect Virtual Button, Kaaresoja et d'autres chercheurs ont étudié la perception de la simultanéité entre le toucher d'un bouton virtuel sur un écran tactile et le retour visuel indiquant que le bouton a été touché, pour différents délais. Lorsque le délai entre l'appui sur le bouton et le retour visuel était de 85 ms ou moins, les participants ont indiqué que le retour visuel apparaissait simultanément avec l'appui sur le bouton dans 75% des cas. De plus, pour des retards de 100 ms ou moins, les participants ont signalé une qualité perçue de la pression sur le bouton constamment élevée, avec une qualité perçue diminuant pour des retards de 100 ms à 150 ms et atteignant des niveaux très bas pour des retards de 300 ms.

Compte tenu de ce constat, nous concluons que les recherches indiquent que 100 ms est un seuil "satisfaisant" pour l'Interaction to Next Paint dans les métriques Web Vitals. De plus, étant donné que les utilisateurs ont signalé des niveaux de qualité faibles pour des retards de 300 ms ou plus, il s'agit idéalement du seuil de qualité "médiocre".

Atteignabilité

À l'aide des données de CrUX, nous avons déterminé que la majorité des origines sur le Web atteignent le seuil de 200 ms pour l'INP "bon" au 75e percentile:

Nous avons également accordé une attention particulière à la possibilité de transmettre l'INP pour les appareils mobiles d'entrée de gamme, qui représentent une part importante des visites sur les sites. Cela a confirmé l'adéquation d'un seuil de 200 ms.

Compte tenu du seuil de 100 ms, confirmé par des recherches sur la qualité de l'expérience et les critères d'accessibilité, nous concluons que 200 ms est un seuil raisonnable pour une bonne expérience.

Pour identifier un seuil "mauvais" pour le LCP, nous utilisons les données CrUX afin d'identifier un seuil atteint par la plupart des origines:

Cela suggère que nous pouvons définir un seuil "faible" de 300 ms.

Toutefois, contrairement au LCP et au CLS, l'INP présente une corrélation inverse avec la popularité. Les sites les plus populaires sont souvent plus complexes, ce qui augmente la probabilité d'obtenir un INP plus élevé. Si nous examinons les 10 000 sites les plus populaires, qui représentent la grande majorité de la navigation sur Internet, un tableau plus complexe se dessine:

Sur mobile, un seuil de 300 ms classerait la majorité des sites populaires comme "médiocre", ce qui étirerait nos critères d'accessibilité, tandis que 500 ms correspondrait mieux à 10 à 30% des sites. Notez également que le seuil de 200 ms pour une bonne métrique est également plus difficile à atteindre pour ces sites. Toutefois, 23% d'entre eux atteignent toujours ce seuil sur mobile, ce qui correspond à notre critère de taux de réussite minimal de 10 %.

C'est pourquoi nous concluons qu'un seuil de 200 ms est un seuil "bon" raisonnable pour la plupart des sites, et qu'un seuil supérieur à 500 ms est un seuil "mauvais" raisonnable.

Cumulative Layout Shift

Les seuils de CLS ont été définis en tenant compte des considérations suivantes sur la qualité de l'expérience et la faisabilité.

Qualité de l'expérience

Cumulative Layout Shift (CLS) est une nouvelle métrique qui mesure le décalage du contenu visible d'une page. Étant donné que le CLS est nouveau, nous ne connaissons aucune étude pouvant directement informer les seuils de cette métrique. Ainsi, pour identifier un seuil conforme aux attentes des utilisateurs, nous avons évalué des pages réelles avec différents degrés de décalage de mise en page afin de déterminer le degré maximal de décalage perçu comme acceptable avant de provoquer des perturbations importantes lors de la consultation du contenu de la page. Lors de nos tests internes, nous avons constaté que les niveaux de décalage de 0,15 et plus étaient systématiquement perçus comme perturbateurs, tandis que les décalages de 0,1 et moins étaient perceptibles, mais pas trop perturbateurs. Par conséquent, bien que le décalage de mise en page nul soit idéal, nous avons conclu que les valeurs allant jusqu'à 0,1 sont des seuils CLS "bons" potentiels.

Atteignabilité

D'après les données CrUX, près de 50% des origines ont un CLS de 0,05 ou moins.

Bien que les données CrUX suggèrent que 0,05 puisse être un seuil de CLS "bon" raisonnable, nous reconnaissons qu'il existe certains cas d'utilisation où il est difficile d'éviter les changements de mise en page perturbateurs. Par exemple, pour les contenus intégrés tiers, tels que les contenus intégrés sur les réseaux sociaux, la hauteur du contenu intégré n'est parfois pas connue avant la fin du chargement, ce qui peut entraîner un décalage de mise en page supérieur à 0,05. Nous concluons donc que, bien que de nombreuses origines atteignent le seuil de 0,05, le seuil CLS légèrement moins strict de 0,1 offre un meilleur équilibre entre la qualité de l'expérience et la faisabilité. Nous espérons que, à l'avenir, l'écosystème Web identifiera des solutions pour résoudre les changements de mise en page causés par les éléments intégrés tiers, ce qui permettrait d'utiliser un seuil de CLS "bon" plus strict de 0,05 ou 0 dans une future itération des Core Web Vitals.

De plus, pour déterminer un seuil "mauvais" pour le CLS, nous avons utilisé les données CrUX pour identifier un seuil atteint par la plupart des origines:

Pour un seuil de 0,25, environ 20% des origines de téléphone et 18% des origines d'ordinateur seraient classées comme "médiocres". Ce résultat se situe dans la plage cible de 10 à 30 %. Nous avons donc conclu que 0,25 était un seuil "mauvais" acceptable.