8 outils gratuits pour tester les performances de votre site Web

Ça y est, vous avez fini de créer votre site et il est tel que vous le vouliez en termes de design et de contenus. Mais, avez-vous pensé à tester les performances de votre site Web ?

Tester les performances d’un site est une étape obligatoire pour visualiser ce qui prend trop de temps à charger afin d’apporter les corrections adéquates.

En effet, avoir un site lent, c’est dire adieu à l’espoir d’un bon référencement et bonjour à un taux de rebond élevé.

Dans cet article, vous découvrirez donc l’importance des tests de performance pour les sites Web ainsi que 8 outils gratuits qui vous permettront de les réaliser.

(Article publié le 30/06/2021 et mis à jour le 21/09/2023 avec suppression de Dareboost et de web.dev measure qui n’existent plus et ajout de GiftOfSpeed, un outil de test performances tout aussi sympa.)

Pourquoi tester les performances de votre site ?

Pour être bien classé par Google et les autres moteurs de recherche

Il faut savoir que si vous voulez être bien classé par les moteurs de recherche comme Google, des contenus de qualité ne suffisent pas.

Il est également nécessaire que votre site soit performant en terme de vitesse d’affichage, d’interactivité et de stabilité visuelle.

En effet, mister Google a fait de l’expérience utilisateur un facteur de classement officiel avec ses Core Web Vitals.

Et qui dit Core Web Vitals, dit métriques essentielles, dont :

👉 Le Largest Contentful Paint (LCP), qui évalue le temps de chargement nécessaire à la page pour afficher les éléments principaux sur l’écran de l’utilisateur.

👉 Mais aussi, le First Input Delay (FID), qui mesure le temps écoulé entre le moment où un visiteur interagit pour la première fois avec votre site en cliquant sur un bouton, un lien ou autre jusqu’au moment où le navigateur répond à cette demande.

👉 Et enfin, le Cumulative Layout Shift (CLS), qui répertorie les changements de mise en page inattendus qui peuvent perturber le visiteur comme un contenu qui se déplace brusquement.

En bref, pour être considéré comme performant aux yeux de Google, votre site devra donc avoir un LCP inférieur à 2,5 secondes, un FID inférieur à 100 ms et un CLS inférieur à 0,1. 😮

Pour limiter le taux de rebond

Le taux de rebond c’est le pourcentage de visiteurs qui viennent sur votre site et repartent après avoir visité une seule page.

Il parait même que la probabilité de rebond augmente de 32 % à mesure que le temps de chargement de la page passe de 1 seconde à 3 secondes et pire encore par seconde(s) supplémentaire(s). (Source : Google/SOASTA Research, 2017)

Alors, avouez que ce serait ballot que vos visiteurs et potentiels acheteurs quittent votre site avant même d’en avoir exploré son contenu.

Avec quel outil tester les performances de votre site ?

Il existe pas mal de sites gratuits que vous pouvez utiliser.

Pour la plupart, il suffit de mettre l’URL de votre site pour que le résultat s’affiche. Néanmoins, pensez à faire les tests en mode incognito afin que rien ne vienne polluer les résultats.

Pour vous donner une idée des infos que vous pouvez obtenir, j’ai fait le test pour vous avec la page d’accueil de mon blog.

Vous trouverez donc, pour chaque outil, le résultat du test. Et aussi, le détail de ce que l’on peut consulter gratuitement.

⚠️ Ne vous focalisez pas trop sur la note obtenue. Gardez à l’esprit que ces outils vous servent uniquement à analyser les performances de votre site en vue de les améliorer.

GTmetrix

GTmetrix a été développé par Carbon60, une société qui fournit des services de cloud. Il s’agit d’un outil assez complet pour tester les performances de votre site Web.

Il est à noter que GTmetrix utilise Lighthouse comme méthode d’analyse, que son interface est en anglais et qu’il existe des limitations en mode gratuit.

En effet, en mode gratuit, vous ne pouvez pas tester les performances mobiles de votre site et le serveur de test est celui de Vancouver au Canada. De plus, vous êtes limité en nombre de tests par jour.

Les résultats du test de performances avec GTmetrix

En ce qui concerne les résultats, vous obtenez un score global alphabétique. Celui-ci représente une moyenne pondérée du score de performance (70%) et de celui de structure (30%).

Vous avez également les résultats pour les métriques Web Vitals : Largest Contentful Paint (LCP), Total Blocking Time (TBT – FID) et Cumulative Layout Shift (CLS).

Après GTmetrix génère un résumé avec :

• La visualisation de la vitesse de chargement de la page
• Les principaux problèmes identifiés
• Un graphique avec le détail de la page. (temps de chargement complet, taille et nombre de requêtes et ventilation par requête)

Ensuite en cliquant sur les divers onglets vous obtenez :

1 – Le détail des performances par indicateurs ainsi que les timings du navigateur pour le :

• First Contentful Paint (FCP)
• Largest Contentful Paint (LCP)
• Speed ​​Index (SI)
• Total Blocking Time (TBT)
• Time To Interactive (TTI)
• Cumulative Layout Shift (CLS)

2 – ​ La structure de la page avec les différents audits réussis ou non et les solutions à apporter

3 – Un graphique en cascade (waterfall) avec une visualisation demande par demande du chargement de la page

4 – L’historique de vos tests

D’autre part, vous pouvez comparer votre URL avec une ou plusieurs autres.

Et vous avez également l’option de partager votre rapport via Facebook, Twitter ou un lien à copier-coller.

Je vous conseille vivement de créer un compte gratuit afin de :

• Conserver les données de vos rapports pendant 3 mois
• Télécharger une version PDF des rapports GTmetrix
• Choisir un autre emplacement de test que Vancouver
• Modifier les vitesses de connexion
• Créer une vidéo du chargement de la page et la télécharger en MP4
• Obtenir le code iframe de la vidéo pour intégration
• Bloquer les Ads
• Effectuer 50 Tests hebdomadaires à la demande
• Obtenir 10 Crédits API quotidiens (sympa, si vous êtes un dev et voulez tester l’API GTmetrix)
• Surveiller une page quotidiennement
• Accéder aux graphiques d’utilisation des ressources système

Uptrends Free Website Speed Test

Free Website Speed Test est un outil créé par Uptrends, une société spécialisée dans la surveillance des sites Web.

Il est à noter que l’outil est disponible en français.

Avec le test de vitesse d’Uptrends, vous pouvez réaliser successivement un test pour mobile, puis pour ordinateur. D’autre part, vous avez le choix entre onze emplacements réseaux : Paris, Amsterdam, Beijing, Francfort, Londres, Los Angeles, Montréal, New York, Singapour ou Sydney.

De plus, pour le test ordinateur, plusieurs navigateurs sont disponibles : Chrome, Firefox, Internet Explorer ou PhantomJS.

Enfin, vous pouvez également tester les performances de votre site Web :

• Sur différents appareils pour le test mobile
• Dans différentes tailles d’écrans pour le test ordinateur
• En choisissant la limitation de la bande passante

Les résultats du test de performances avec speed test d’Uptrends

En ce qui concerne les résultats, vous obtenez un score numérique décliné sur fond vert, orange ou rouge selon votre résultat. Le temps de chargement total, la taille de la page et le nombre de requêtes sont également affichés.

Mais, Uptrends ne se limite pas à cela, il vous donne aussi :

• Des conseils pour résoudre les problèmes liés aux performances sur votre site
• Une répartition des requêtes par types et poids, codes de réponse et domaine(s) utilisé(s)
• Un graphique en cascade montrant la progression de votre chargement de page

Il est à noter que le graphique en cascade est très détaillé et qu’e vous pouvez’il est possible de filtrer les résultats par ordre de chargement ou par taille.

D’autre part, vous pouvez afficher ou masquer les URL de données et les domaines et voir les en-têtes de demande et de réponse en cliquant sur “+” à côté de la taille.

Enfin, depuis ce même graphique, vous avez accès à une visualisation de la cascade par groupes de domaines.

En plus de tout cela, Uptrends fournit un résumé des performances du chargement de votre page.

Celui-ci comprend le nombre total d’octets, le temps mis à la résolution, la connexion TCP, l’accès au HTTPS, ainsi que les temps d’envoi, d’attente et de réception.

💡 Sachez qu’il est impossible d’enregistrer votre résultat. Néanmoins, vous pouvez le partager par un lien qu’il vous suffit de copier-coller.

Pingdom Website Speed Test

Pingdom est une société de surveillance de sites Web. Sur son site, elle donne accès à son outil gratuit, Website Speed Test dont l’interface est en anglais.

Pour effectuer le test de performance, vous avez le choix entre 7 emplacements : Tokyo, Francfort, Londres, Washington, San Francisco, Sydney et São Paulo.

Les résultats du test de performances avec speed test de Pingdom

Le résultat vous indique :

• Votre score global (lettre/nombre avec un fond vert, orange ou rouge selon le score obtenu)
• La taille de la page
• Le temps passé au chargement
• Le nombre de requêtes

Ensuite, vous avez, bien sur, des conseils pour améliorer les performances de votre site (assez succincts). Vous trouvez également les codes de réponses et la taille du contenu par type de contenu.

💡 Point positif : vous avez la possibilité de partager votre analyse sur Facebook, Twitter et par email. Pour cela, il suffit de cliquer sur “share results”.

Pingdom a toutefois plusieurs points négatifs :

👉 Il plante souvent et les résultats sont tronqués. Il est par exemple, impossible de voir la taille du contenu par domaine, les requêtes par domaine et requêtes par fichier. Mais peut-être est-ce dû aux paramètres des sites que je teste ou de mon ordinateur… Alors, n’hésitez pas à l’essayer quand même, et si vous voyez ce que je viens de lister, indiquez-le-moi en commentaires.

👉 Il ne propose pas de test pour la version mobile.

👉 Enfin, si, comme moi, votre serveur utilise Brotli qui est plus performant que Gzip, alors, le test Gzip échouera car Brotli ne sera pas reconnu. Pour info, si vous ne savez pas si vous utilisez Brotli, vous pouvez faire le test sur Keycdn.

Keycdn Website Speed Test

Keycdn est un fournisseur de CDN qui met gratuitement à disposition (entre autres outils) Website Speed ​​Test.

Il s’agit d’un autre outil que vous pouvez utiliser pour évaluer les performances d’un site Web et voir les améliorations à apporter. L’interface est, une fois de plus, en anglais.

Ici, vous avez le choix entre 10 emplacements de serveurs : Francfort, Amsterdam, Londres, New York, Dallas, San Francisco, Singapour, Sydney, Tokyo et Bangalore.

Les résultats du test de performances avec speed test de Keycdn

Comme souvent, le résultat du test donne une note globale sur 100, mais vous avez en plus un grade alphabétique.

En premier lieu, vous pouvez voir le temps, la taille et le nombre de requêtes qu’il a fallu pour charger totalement la page.

Ensuite, vous avez le résultat détaillé de votre score avec les notes individuelles obtenues pour chaque niveau de performance, ainsi que des pistes d’amélioration.

Juste en dessous, vous trouvez une ventilation visuelle des requêtes par :

• Nombre de demandes et de leur statut
• Temps de chargement par type de contenu
• Nombre de demandes par type de contenu
• Taille du contenu par type de contenu
• Demandes par domaine
• Taille du contenu par domaine

Et, pour bien visualiser l’enchaînement des demandes, vous avez accès à une cascade complète (waterfall). Celle-ci inclut le détail des horaires, des en-têtes HTTP de chaque actif et des pictogrammes représentatifs.

Enfin, Website Speed ​​Test vous offre un aperçu visuel de votre site Web.

GiftOfSpeed Website Speed Test

Website Speed Test est un outil gratuit pour tester la performance des sites Web créé par GiftOfSpeed, une société néerlandaise spécialisée dans l’optimisation de la vitesse des pages Web.

Franchement, je le trouve très complet.

Avec Website Speed Test de GiftOfSpeed, vous avez le choix entre 5 serveurs de test : USA (New York), USA (San Francisco), Angleterre (Londres), Pays-Bas (Amsterdam) et Inde (Bangalore).

D’autre part, vous pouvez effectuer des tests de performances sur ordinateur et aussi sur mobile.

Les résultats du test de performances avec speed test de GiftOfSpeed

En premier lieu vous obtenez :

• Une copie d’écran de la fenêtre d’affichage de la page
• Un score en pourcentage
• Tous les résultats concernant les core Vitals
• Le temps de chargement, le nombre de requêtes et la taille de la page
• Un graphique avec répartition des ressources utilisées et au survol leurs tailles

Comme à l’accoutumée, la couleur verte indique que c’est bon, la orange que c’est à améliorer et la rouge que ça ne va pas du tout.

Ensuite, sous Breakdown, vous accédez à la visualisation du chargement avec la répartition des fichiers et des requêtes demandés en pourcentage et taille. L’outil indique aussi quelles sont les ressources locales ou externes les plus lentes.

Si vous cliquez sur l’onglet Issues, vous visualiserez alors tous les tests effectués assortis d’une note. Il vous suffira de cliquer sur la flèche pour accéder au détail des problèmes relevés.

Enfin, en cliquant sur l’onglet Waterfall, vous obtenez un graphique en cascade du chargement de la page.

Ici, il est possible de trier le graphique par sorte de fichiers : tous, documents,CSS, JavaScript, images, médias, polices, Ajax ou autre.

De plus, lorsque vous survolez les barres à droite, des informations additionnelles apparaissent. Et si vous cliquez sur le “+” de chaque fichier, alors vous aurez toutes les infos sur les en-têtes de demande et de réponse (headers).

💡 Pensez à survoler les points d’interrogations et les graphiques afin d’afficher les infos explicatives. Et si vous souhaitez mettre le résultat du test ou encore le partager, copiez-collez son URL.

WebPage Test

WebPageTest est un outil de test de performances de sites Web plutôt destiné aux développeurs. L’interface est en anglais.

Vous y trouverez un nombre phénoménal d’options et bénéficierez de rapports complexes, comme des analyses de métriques approfondies (DNS, TCP, TLS, etc.).

D’autre part, avec WebPageTest, il est possible de réaliser des tests simples ou avancés et d’effectuer une comparaison entre plusieurs URL.

💡 Je vous conseille de sélectionner les tests avancés afin de choisir le serveur de test Paris.

Les résultats du test de performances avec WebPageTest

Le test fini, le résultat sera réparti sous plusieurs onglets :

• Résumé
• Détails avec une vue en cascade
• Web Vitals
• Performance
• Contenu
• Domaines
• Traitement
• Capture d’écran
• Analyse d’image (un onglet s’ouvre et Cloudinary analyse les images)

💡 Si vous n’effacez pas le cache de votre navigateur, vous pourrez retrouver jusqu’à 30 jours d’historique de test. Et si vous créez un compte gratuit, vous bénéficierez de votre historique de tests pendant 13 mois.

PageSpeed Insights

PageSpeed Insights est un outil créé par Google. Il utilise Lighthouse pour tester les performances des pages d’un site Web en version mobile ou ordinateur et possède une interface en français.

Après avoir inséré l’URL de la page, si votre site a eu assez de trafic sur mobile et ordinateur les 90 derniers jours, une évaluation des signaux Web essentiels s’affiche. Elle comporte les scores obtenus depuis les 28 jours précédents et une indication de réussite ou d’échec

Ensuite apparait les scores que vous avez obtenu pour les performances, l’accessibilité, les bonnes pratiques et le SEO.

• 0 à 49 (rouge) : Mauvais
• 50 à 89 (orange) : Besoin d’amélioration
• 90 à 100 (vert) : Bon

Pour passer des scores mobile à ceux ordinateur, cliquez simplement sur les boutons mobile ou ordinateur.

Les résultats du test de performances avec PageSpeed Insights

En premier lieu, le score global des performances ainsi qu’une copie d’écran de la page s’affichent.

Juste en dessous, vous trouvez les statistiques des performances qui indiquent le temps de chargement pour les métriques des Core Web Vitals :

• First Contentful Paint
• Largest Contentful Paint
• Cumulative Layout Shift
• La durée pendant laquelle les tâches de plus de 50 ms bloquent la page (Total Blocking Time)
• La vitesse à laquelle le contenu s’affiche visuellement (Speed Index)

Pour avoir plus d’informations, vous pouvez cliquer sur “Développer la vue” ou encore afficher les audits concernant une métrique spécifique.

Après, PageSpeed Insights vous offre en image la visualisation du chargement de la page.

Il est à noter que lorsque vous cliquez sur le lien “Afficher la calculatrice” en dessous du score, un graphique apparait. Il vous indique la répartition de vos résultats (ordinateur ou mobile) avec la possibilité de changer la version lighthouse.

D’autre part, si vous cliquez sur “Consultez la carte proportionnelle”, vous avez accès à la visualisation des dépendances JavaScript.

Enfin et c’est le point le plus intéressant, l’audit dévoile trois sections :

• Opportunités : suggestions pour améliorer vos performances
• Diagnostics : informations concernant les bonnes pratiques Web à appliquer
• Audits réussis : liste des tests passés avec succès.

Sous opportunités et diagnostic se trouvent les listes des problèmes à résoudre triés par gravité. Cliquez alors sur chaque ligne afin d’obtenir le détail du ou des fichiers incriminés ainsi qu’un lien vers une documentation qui vous aideront à résoudre les problèmes.

Voici à titre d’exemple l’audit de la page de Pagespeed Insights 😉 :

💡Vous pouvez sauvegarder ou partager le résultat de votre test via le bouton “Copier le lien” en haut à droite.

Chrome Devtools : Lighthouse

Lighthouse est accessible via les Chrome DevTools et l’interface est disponible en français.

Pour accéder aux Chrome DevTools, allez sur le site à auditer en indiquant son URL dans le navigateur Google Chrome. Puis, faites un clic droit et cliquez sur “inspecter”.

Immédiatement les Chrome DevTools apparaissent avec à droite les outils et à gauche, la visualisation de votre site.

Cliquez alors sur “Lighthouse” dans la barre d’outils. Puis, choisissez les tests que voulez faire ainsi que la version mobile ou desktop. Enfin, cliquez sur “Analyser le chargement de la page“, ça mouline un peu, puis, votre rapport est visualisable.

Comme dans PageSpeed Insights, les scores obtenus sont répartis en 4 groupes : Performance, Accessibilité, Bonnes pratiques et SEO.

Juste en dessous se trouvent le détail des audits réussis ainsi que ceux à améliorer. Ceux-ci vous indiquent les modifications à apporter pour chacun.

💡Cet outil, peut également analyser les Progressive Web Apps.

Les résultats du test de performances avec les Chrome DevTools

En sus, d’autres informations sont disponibles à plusieurs endroits, en cliquant dessus:

Tout d’abord, le lien “View Original Trace”, vous redirigera vers l’onglet performance des Chrome DevTools. Là, vous aurez une capture visuelle des métriques de performances (FCP=First Contentful Paint et LCP=Largest Contentful Paint).

Ensuite, le lien “performance score is calculated” vous expliquera comment Lighthouse calcule votre score de performance global.

Par ailleurs, le lien “See calculator” vous amènera à la page “calcul du score lié aux performances” de PageSpeed Insights.

Et enfin, en cliquant sur les 3 points, en haut, à droite, vous pourrez télécharger le résumé/rapport détaillé en PDF. Et également, le copier/sauvegarder en Json ou en HTML.

Tester les performances de votre site et les améliorer

Tester les performances de votre site est vraiment une chose qu’il ne faut pas négliger. D’autant plus que vous disposez, maintenant, d’un éventail d’outils gratuits pour le faire.

Après, n’oubliez pas de suivre les pistes d’amélioration fournies et d’appliquer les correctifs appropriés.

En effet, bien souvent, installer un plugin d’optimisation et de cache et le paramétrer (correctement) ne suffira pas. Sachez qu’il vous faudra aussi optimiser vos images, vos polices ainsi que vos codes JavaScript et CSS.

Ensuite, il conviendra que vous pensiez aussi à améliorer l’accessibilité et, bien entendu, le SEO de votre site.

Et vous, quels outils utilisez-vous ?