Optimisez votre
vitesse web.
Améliorez vos conversions.

First Contentful Paint (FCP)

Pertinence dans Google Lighthouse: 15%

First Contentful Paint est la première des six mesures utilisées par Google Lighthouse pour mesurer l’optimisation de tout site web.

FCP mesure la vitesse à laquelle le navigateur rend le premier signal DOM, c’est-à-dire le premier code qui est imprimé dans le navigateur. Plus le temps de rendu est court, plus le score FCP est élevé dans Google Lighthouse. Par exemple, si le rendu web se fait en 1,5 seconde, il aura un score de 99 dans First Contentful Paint.

Cette partie est l’une des plus difficiles à optimiser et dans laquelle nous avons le plus d’expérience car elle nécessite la vitesse du serveur, du CDN, du cache, du type de connexion HTTP et de la connectivité avec la base de données entre autres.

Il est également essentiel pour ce point d’optimiser la charge de n’importe quel élément avant la partie de notre site web puisque toute charge précédente augmentera le temps pendant lequel l’utilisateur commence à voir notre site web et donc réduire la charge et l’interaction de l’utilisateur.

 

Source officielle

Speed Index (SI)

Pertinence dans Google Lighthouse: 15%

Speed Index est le deuxième point à considérer pour améliorer la qualité de notre site web. Cette métrique mesure la vitesse de visualisation du contenu lors du chargement du web. Pour ce faire, Google Lighthouse réalise une vidéo à partir du premier rendu du site et du chargement complet, ce qui permet de mesurer la vitesse de visualisation.

Pour cette section, il est essentiel de réduire et de compresser le temps d’exécution du JavaScript, de faire en sorte que le texte soit visible même si nos polices n’ont pas encore été chargées, et de minimiser le DOM du contenu central de notre site web, entre autres.

 

Source officielle

Largest Contentful Paint (LCP)

Pertinence dans Google Lighthouse: 25%

Largest Contentful Paint est une métrique importante centrée sur l’utilisateur pour mesurer le taux de chargement perçu. Il marque le point de la chronologie du chargement de la page où le contenu principal de la page est susceptible d’être chargé : un LCP rapide contribue à assurer à l’utilisateur que la page est utile. En d’autres termes, cette métrique mesure le temps de chargement du contenu utile de la page en déterminant quel contenu a été téléchargé et s’il est pertinent pour l’utilisateur.

Ce point est l’un des plus intéressants dans l’optimisation web et c’est pourquoi Google lui a donné tant d’importance puisque si le contenu qui a été téléchargé le plus rapidement s’avère ne pas être le contenu principal (navigation, logo, etc.) l’affichage du contenu que l’utilisateur qui attend la fin du téléchargement de notre site web sera d’une importance mineure.

Pour ce faire, la métrique LCP indique le temps de rendu de la plus grande image ou du plus grand bloc de texte visible dans la fenêtre d’affichage.

Pour offrir une bonne expérience à l’utilisateur, les sites doivent s’efforcer de faire en sorte que la peinture avec un contenu plus important se fasse dans les 2,5 premières secondes du début du chargement de la page.

 

Source officielle

Time to Interactive (TTI)

Pertinence dans Google Lighthouse: 15%

TTI mesure le temps nécessaire pour qu’une page devienne pleinement interactive. Une page est considérée comme pleinement interactive lorsque le web affiche l’intégralité de son contenu, que des gestionnaires d’événements ont été enregistrés pour la plupart des éléments visibles et que la page répond aux interactions de l’utilisateur dans un délai de 50 millisecondes. Il détermine également le moment où l’utilisateur peut effectuer la première saisie.

La mesure du TTI est importante car certains sites optimisent la visibilité du contenu sans tenir compte de l’interactivité. Cela peut créer une expérience utilisateur frustrante car le site semble être prêt, mais lorsque l’utilisateur essaie d’interagir avec lui, rien ne se passe.

Une page dont le temps d’interaction est de 2,2 secondes aura un score de 99 dans TTI Google Lighthouse.

 

Source officielle

Total Blocking Time (TBT)

Pertinence dans Google Lighthouse: 25%

Total Blocking Time mesure le temps total pendant lequel une page est bloquée jusqu’à ce qu’elle réponde à une entrée de l’utilisateur, telle que des clics de souris, des pressions sur l’écran ou des frappes au clavier.

Le score est calculé en additionnant la partie verrouillage de toutes les tâches longues entre le premier tableau de contenu et le temps d’interaction. Toute tâche qui s’exécute pendant plus de 50 ms est une tâche longue qui détermine une mauvaise optimisation de page. Ces durées d’exécution des tâches sont généralement dues à un chargement inefficace, à l’analyse ou à l’exécution de JavaScripts inutiles.

Pour ce faire, il est nécessaire d’optimiser les éléments du DOM qui interagissent avec Java Script et de conserver les plus nécessaires au fonctionnement de notre site web sans recharger la page d’appels JS inutiles.

 

Source officielle

Cumulative Layout Shift (CLS)

Pertinence dans Google Lighthouse: 5%

Cumulative Layout Shift mesure la somme totale de tous les scores individuels de changement de mise en page pour chaque changement de mise en page inattendu qui se produit pendant le chargement de la page.

En d’autres termes, il est envisagé que, lorsque la toile est chargée, la structure de la conception, depuis la première visualisation jusqu’à la fin du chargement, soit identique.

Cela peut être frustrant pour l’utilisateur car si vous essayez d’interagir avec le web pendant qu’il se charge et qu’au même moment, la mise en page change ou les éléments de l’écran se déplacent, l’utilisateur finira par interagir avec d’autres parties ou boutons du web qu’il ne souhaite pas utiliser.

CLS permet de quantifier la fréquence à laquelle les utilisateurs subissent des changements de conception inattendus. Un CLS faible permet donc de garantir que la page est agréable.

Pour offrir une bonne expérience utilisateur, les sites web doivent avoir un score CLS inférieur à 0,1.

 

Source officielle