Dans cet article, Damien Jubeau  (fondateur et CEO de Dareboost) aborde les différents pièges à éviter pour mesurer et optimiser efficacement la vitesse de vos pages Web. Vous découvrirez également 4 indicateurs de performance à retenir (TTFB, Start Render, Visually Complete et Speed Index) avec de précieux conseils pour les interpréter correctement.

“On ne peut améliorer que ce que l’on mesure”. Un adage qu’il est indispensable d’appliquer si vous souhaitez accélérer le chargement de vos pages web.

D’abord savoir ce que l’on mesure !

Commençons cette présentation des principaux indicateurs en matière de vitesse par une mise au point concernant le fameux “loadtime” ou temps de chargement. Cette notion doit en effet être considérée avec beaucoup de prudence.

En effet, tout le monde ne parle pas de la même chose en évoquant le temps de chargement ! Dans de – trop –  nombreux cas, on ne vous parlera en fait que du temps de réponse de votre serveur, ou d’autres mesures partielles. Pensez donc à vérifier les informations que vous livre l’outil de mesure que vous utilisez sur sa méthodologie et sur ce qu’il mesure exactement.

  • Chez Alexa, on apprend ainsi par exemple que le chargement des images et autres feuilles de styles n’est pas pris en compte dans les informations que le site remonte concernant la vitesse : “The load time of an individual page is how long it takes for the DOM -­ the structure of the page – to be loaded. This time doesn’t include the time to load all images and stylesheets, for example.”
  • Sur Dareboost, l’indicateur “temps de chargement” correspond au temps de chargement complet de la page, et l’outil attend pour cela que le trafic réseau lié au chargement de la page soit interrompu. Cela inclut donc évidemment le chargement des CSS, des Javascripts, etc. mais aussi de toutes les dépendances associées, comme c’est le cas pour vos visiteurs !

Quant aux outils qui ne vous livrent pas d’information sur les conditions des tests ni sur la nature des indicateurs mesurés, nous ne pouvons que vous inviter à la plus grande méfiance quant à la fiabilité des informations délivrées.

Autre réserve concernant le temps de chargement : il est rarement pertinent aujourd’hui pour rendre compte de la performance réelle de vos pages, notamment sur le terrain de l’expérience utilisateur (UX). En effet, une page web type embarque plus d’une centaine de ressources différentes. Avec de plus en plus de comportements asynchrones et de chargements progressifs. De fait, la mesure du temps nécessaire au chargement des contenus d’une page dans leur intégralité devient de moins en moins révélatrice de ce qui se passe pour l’utilisateur.  

Start Render, Visually Complete et Speed Index pour l’UX

Dès lors vers quels autres indicateurs se tourner ? Pour obtenir un aperçu aussi fidèle que possible de l’expérience utilisateur, nous vous conseillons de porter votre attention sur les 3 indicateurs suivants, issus de l’analyse vidéo du chargement de la page web :

  • Start Render : cet indicateur mesure le délai avant le début de l’affichage de votre page. Avant cela, l’utilisateur fait face à une page blanche. De fait, plus ce délai est faible, moins vos utilisateurs risquent d’être frustrés et sujets au rebond vers d’autres sites web. A noter que le début d’affichage ne signifie pas que les éléments qui se sont affichés sont pertinents ni utiles à l’internaute : quelque chose a commencé à s’afficher, cela peut aussi bien être un simple bout de texte que la quasi totalité de votre page !
  • Visually Complete : c’est le temps nécessaire à l’affichage complet de la zone située au dessus de la ligne de flottaison (partie visible à l’écran sans effectuer de scroll). Une manière de se focaliser sur ce qui est immédiatement nécessaire au visiteur !
  • Speed Index : cet indice de performance retranscrit quant à lui la vitesse d’affichage de la partie visible de la page web testée (au dessus de la ligne de flottaison). Il prend ainsi en compte la progressivité de l’affichage des différents composants de la page. Ce qui fait aujourd’hui du Speed Index l’indicateur reconnu comme le plus révélateur de l’expérience utilisateur. Repère : une page dont tous les éléments au dessus de la ligne de flottaison s’affichent en 1 seconde obtiendra un Speed Index inférieur à 1’000. Un point de référence qui correspond d’ailleurs à la recommandation de Google en la matière.

TTFB : le socle de votre performance

 

En complément de ces indicateurs UX, et pour suivre cette fois-ci ses performances techniques sur la toute première étape du chargement de votre page, c’est vers le TTFB que nous vous conseillons de vous tourner. Ce Time To First Byte mesure le délai entre la requête et la réponse HTTP, c’est à dire le temps nécessaire pour que le navigateur de vos visiteurs réceptionne le début du code HTML de votre page de la part de votre application Web ou CMS. De fait, c’est cet indicateur qui vous renseignera sur les performances de vos scripts (le temps que mettra votre CMS a produire la page demandée par exemple) et de l’hébergement. Attention toutefois : pour connaître le véritable temps de traitement au niveau de votre serveur, il conviendra de retirer la latence réseau du TTFB; c’est à dire le temps que mettent les données pour transiter entre votre serveur et le navigateur web des visiteurs.

Au delà de l’indication sur les performances techniques de votre hébergement et votre application backend, le TTFB est important à observer de par son impact potentiel sur le référencement de votre site. D’autant plus si celui-ci comporte un grand nombre de page : plus votre TTFB sera haut, moins les robots Google pourront visiter de pages dans le budget-temps que le moteur de recherche vous aura imparti pour le crawl.

Même si le TTFB est important, il faut néanmoins relativiser : un excellent temps de réponse de votre serveur ne garantit aucunement la rapidité de votre site. Steve Souders, l’un des gourous de la performance web, en a même fait une règle d’or : 90% de l’attente perçue par l’internaute se trouve dans les étapes ultérieures, lors des traitements frontend. D’où l’importance de suivre en parallèle le TTFB mais aussi des indicateurs plus orientés UX tels que ceux cités précédemment.

Mesurer la vitesse : attention au contexte !

Maintenant que vous avez une idée plus claire sur les indicateurs à retenir pour surveiller les performances de votre site Internet, il vous faut désormais déterminer précisément comment réaliser ces mesures. Toute négligence sur ce point peut induire d’importants biais dans vos résultats et dans les analyses que vous en tirerez !

  • Premièrement, prêtez une attention particulière à la méthodologie employée par l’outil de mesure que vous utilisez. Comme évoqué un peu plus haut dans cet article, tous les services disponibles sur le web ne mesurent pas les mêmes indicateurs ni de la même manière ! Autant que possible, orientez vous vers des outils affichant clairement leur méthodologie et qui vous permettront de réaliser tests dans des conditions les plus proches de conditions réelles de vos visiteurs. Exemple : les tests de performance web Dareboost sont réalisés avec de véritables navigateurs grand public (Google Chrome) et non pas avec de simples robots.
  • Tous vos visiteurs ne profitent pas des mêmes conditions d’accès au web, loin de là. Consultations depuis un mobile ou un ordinateur, depuis la France ou l’étranger, via une connexion fibre, ADSL au débit plus ou moins élevé ou 3G : autant de conditions de visites différentes qui ont un impact très lourd sur la vitesse de chargement de vos pages pour vos visiteurs. En conséquence, il est essentiel pour vous de pouvoir évaluer les performances de vos pages dans différentes conditions. Et notamment celles de vos cibles stratégiques. Vérifiez bien, donc, que votre outil vous permet de faire varier ces paramètres de test afin de vous approcher au plus près des conditions d’accès de vos visiteurs.
  • Enfin, gardez à l’esprit que les performances de vos pages ne sont pas immuables ! Au gré des publications de contenus, des ajouts de fonctionnalités, des mises à jour et autres refontes, la vitesse de chargement de votre site évolue inévitablement. A vous de mettre en place une stratégie de suivi adaptée à votre cas, afin de surveiller l’évolution de vos performances et de détecter d’éventuelles régressions. En bref, passer de la mesure ponctuelle de la vitesse de votre page au monitoring de vos performances web, sur une fréquence adaptée aux enjeux de votre business.

Conclusion

Pour bien mesurer la vitesse de chargement de vos pages web:

  • réalisez vos mesures dans des contextes réalistes, stables, et représentatifs de votre audience.
  • choisissez des indicateurs adaptés. Pensez à l’expérience utilisateur, pas uniquement à la performance technique : de vous limitez pas à un seul indicateur.
  • votre site évolue, sa vitesse aussi : gardez un œil vigilant sur ce sujet, et soyez à la hauteur des enjeux de votre site.

Découvrir Dareboost, le service en ligne spécialisé dans le test de performance et l’analyse de site web

En savoir plus