Leçon 1 / 15

Choisir les indicateurs à suivre

8 min Next.js — performance, SEO et mise en production Gratuit

Objectif : Sélectionner les indicateurs adaptés aux objectifs de performance du catalogue et comprendre les seuils qui permettront d’évaluer l’expérience des visiteurs.

Une page peut s’afficher rapidement tout en restant difficile à utiliser : le contenu principal tarde, les interactions répondent avec délai ou les éléments bougent pendant la lecture. Pour améliorer le catalogue de randonnées, vous devez d’abord choisir des mesures qui décrivent ces problèmes du point de vue des visiteurs. Vous pourrez ensuite comparer ces mesures dans le temps et repérer une dégradation.

Trois dimensions de l’expérience

Les Core Web Vitals sont un ensemble d’indicateurs centrés sur l’expérience réelle d’une page. Ils couvrent trois dimensions complémentaires : la rapidité d’affichage du contenu principal, la réactivité aux actions de l’utilisateur et la stabilité visuelle pendant le chargement. Pour votre catalogue, suivez ces trois dimensions plutôt qu’un unique indicateur général de « vitesse ».

LCP : le contenu principal apparaît-il assez vite ?

Le Largest Contentful Paint (LCP) mesure le temps nécessaire à l’affichage du plus grand élément de contenu visible dans la fenêtre du navigateur. Sur une page d’itinéraire, cet élément peut être une grande image ou un bloc de texte important. Le LCP répond donc à une question concrète : combien de temps le visiteur attend-il avant de voir l’élément visuellement central de la page ?

Sur le catalogue, un LCP élevé peut rendre l’arrivée sur la page pénible, même si le reste du contenu finit par apparaître. Sur une fiche, l’image principale de l’itinéraire peut contribuer fortement à cette mesure. Le seuil de référence considéré comme bon est de 2,5 secondes ou moins ; au-delà de 4 secondes, l’expérience est considérée comme mauvaise.

INP : les actions répondent-elles rapidement ?

L’Interaction to Next Paint (INP) évalue la réactivité de la page en observant le délai entre une interaction — par exemple un clic ou une pression sur une touche — et la mise à jour visuelle suivante. Une page peut sembler chargée, mais donner l’impression de ne pas répondre si une action attend longtemps avant de produire un changement. Un INP de 200 millisecondes ou moins est considéré comme bon ; au-delà de 500 millisecondes, il est mauvais.

Dans votre catalogue, les liens vers les itinéraires doivent réagir sans délai perceptible. Si vous ajoutez ultérieurement une interaction, comme un contrôle de filtre, mesurez aussi la réactivité pendant son utilisation. L’INP reflète l’ensemble des interactions observées au cours de la visite : il ne se limite pas à l’instant initial où la page s’affiche.

CLS : la page reste-t-elle visuellement stable ?

Le Cumulative Layout Shift (CLS) évalue les déplacements inattendus des éléments visibles. Par exemple, si une image se charge sans espace réservé et repousse le titre ou le texte, le visiteur peut perdre sa position ou cliquer au mauvais endroit. Le CLS ne se mesure pas en secondes : il exprime l’ampleur des changements de mise en page inattendus.

Visez un CLS de 0,1 ou moins ; une valeur supérieure à 0,25 est considérée comme mauvaise. Pour les fiches de randonnée, surveillez en particulier la stabilité de la zone média et des contenus qui apparaissent après le premier affichage. La mesure porte sur des changements inattendus : un déplacement provoqué directement par une action de l’utilisateur n’est pas interprété de la même façon.

Choisir une règle de lecture cohérente

Une valeur isolée ne décrit pas l’expérience de tous les visiteurs. Les appareils, les connexions et les conditions d’utilisation varient ; les résultats peuvent donc varier eux aussi. Pour prendre une décision, examinez la distribution des mesures et retenez comme repère le percentile 75 : au moins 75 % des visites doivent se situer au niveau du seuil visé, tandis que le quart le plus lent révèle les conditions les plus difficiles.

Appliquez cette règle séparément au LCP, à l’INP et au CLS, plutôt que de mélanger leurs unités ou de calculer une moyenne unique. Distinguez également les routes : la page du catalogue et une fiche d’itinéraire n’ont pas nécessairement les mêmes éléments principaux ni les mêmes interactions. Cette sélection vous donne une base pour fixer des objectifs vérifiables avant toute optimisation.

À retenir

  • Suivez les Core Web Vitals pour couvrir l’affichage, la réactivité et la stabilité visuelle.
  • Visez un LCP ≤ 2,5 s, un INP ≤ 200 ms et un CLS ≤ 0,1.
  • Interprétez les résultats au percentile 75 pour tenir compte de la diversité des visites.
  • Comparez séparément le catalogue et les fiches d’itinéraire afin d’identifier où agir.

Dans la prochaine leçon, vous établirez une mesure initiale de la route afin de comparer les améliorations à un état de départ documenté.

Envie d'aller plus loin ?

Les cours Enovatic sont gratuits et le resteront. Si vous cherchez un accompagnement encadré, nos formations professionnelles sont animées par les mêmes formateurs.