Dans cet article, vous trouverez les meilleures pratiques pour optimiser la vitesse de votre site Web. À cette fin, nous vous montrerons également comment effectuer des tests de vitesse précis et efficaces avec certains des outils les plus puissants disponibles sur le marché aujourd'hui.
Pourquoi la vitesse du site web est-elle importante ?
La vitesse de votre site Web a un impact considérable sur le classement des recherches organiques. Ce n'est pas surprenant si l'on considère que le temps de chargement a un effet direct sur l'expérience de l'utilisateur. Même si vous avez un site Web complet et bien structuré, si les utilisateurs doivent attendre pour voir votre contenu, cela nuit à leur perception des performances de votre site. Un site Web lent perd rapidement de son attrait, ce qui a une incidence négative sur le taux de rebond et le nombre de pages vues par session.
Il y a plusieurs facteurs indépendants de notre volonté qui conditionnent la vitesse de chargement. Par exemple, le type d'appareil utilisé par le chercheur et son processeur, le navigateur ou la connexion Internet influent certainement sur le temps de chargement. Cependant, un utilisateur percevra une meilleure ou une moins bonne expérience en comparant la navigation entre différents sites web.
Maintenant que vous savez à quel point la vitesse du site est vitale, examinons quelques-uns des meilleurs outils gratuits de test de la vitesse des sites Web actuellement disponibles.
Outils de test de vitesse gratuits
1. GTMetrix
GTMetrix fournit des rapports détaillés sur les performances de vitesse de votre site Web en utilisant Google Page Speed et YSlow. Cet outil gratuit analyse vos pages, leur attribue un score et propose des recommandations concrètes sur la manière de les améliorer.
2. Pingdom
Grâce à Pingdom, vous pouvez vérifier instantanément les performances de vitesse de votre site en sélectionnant l'emplacement à partir duquel vous souhaitez effectuer le test. Ce service est idéal pour les experts comme pour les novices. Vous obtiendrez une évaluation globale de vos pages Web, ainsi que des suggestions pour les optimiser.
3. Web.dev
Web.dev offre des informations détaillées sur les performances, l'accessibilité et le référencement de votre site Web. Il utilise Lighthouse, un outil open-source automatisé pour vérifier la qualité de vos sites. Chaque mesure analysée est accompagnée d'un guide complet pour vous aider à améliorer votre score.
Webpagetest vous permet d'exécuter un test de vitesse à partir de plusieurs endroits dans le monde et de sélectionner n'importe quel navigateur. Vous pouvez choisir d'exécuter une analyse simple ou un test avancé, ce qui fournit l'un des diagnostics les plus riches parmi les outils de test de vitesse disponibles sur le marché.
Pagespeed insights (PSI) est un outil conçu par Google qui analyse le contenu de votre site web et vous suggère comment vous pouvez améliorer sa vitesse. Cet outil évalue vos pages de 0 à 100. Il offre de nombreux conseils pour accélérer votre site web avec des directives complètes.
6. Google Search Console (rapport Core Web Vitals)
Vous pouvez obtenir le rapport "Core Web Vitals" de la console de recherche Google pour vérifier la vitesse d'exécution de vos pages. Celui-ci se trouve dans la section "Améliorations", et il vous aide à trouver les problèmes qui ralentissent rapidement le temps de chargement de vos pages. Un avantage de l'utilisation de cet outil est que vous pouvez suivre vos données historiques sur les améliorations.
Quels sont les paramètres à suivre ?
Il existe plusieurs mesures clés que vous devez connaître lorsque vous optimisez la vitesse de votre site web. Il s'agit des paramètres que la plupart des outils prennent en compte pour évaluer les performances du site. Ils vous donnent une idée du temps d'attente des visiteurs pour recevoir votre contenu.
Récemment, Google a lancé Web Vitals, une extension chrome pour vérifier le bon fonctionnement des éléments communs des pages et la qualité de l'expérience utilisateur lors de la navigation.
Les Web Vitals quantifient l'expérience de l'utilisateur de votre site. Ils sont utilisés par Google comme signaux de qualité pour évaluer l'UX qu'offre votre site web. Google souligne que les éléments vitaux du Web sont les mesures les plus importantes que chaque site doit suivre. Il existe trois éléments vitaux du Web qui reflètent la vitesse de chargement des pages, l'interactivité et la stabilité visuelle.
- La plus grande peinture contestataire (LCP) : Il mesure la performance de chargement des pages. Afin de fournir une bonne expérience utilisateur, les sites web devraient afficher le premier "cadre" du contenu dans un délai de 2,5 secondes.
- Délai de première entrée (FID) : Il évalue la réactivité ou l'interactivité d'une page web. Il mesure la période de temps entre le moment où un visiteur interagit pour la première fois avec votre page (en cliquant sur un bouton ou un lien) et le moment où le navigateur répond à cette interaction. Google suggère un DIF de moins de 100 millisecondes.
- Cumulative Layout Shift (CLS) : Il permet de vérifier la stabilité visuelle. Il prend en compte la fréquence des changements de disposition inattendus des UX. Un CLS inférieur à 0,1 est considéré comme une bonne expérience pour l'utilisateur.
Comment effectuer correctement les tests de vitesse du site web
Vous disposez désormais de plusieurs outils de qualité pour vérifier la vitesse de votre site Web. Voyons quelques points à prendre en compte pour effectuer une analyse efficace.
Choisir le bon endroit
Sélectionnez le lieu le plus proche de votre pays cible. Vous souhaitez que les résultats de votre test soient aussi précis que possible. À cette fin, vous devez sélectionner (dans la mesure du possible) le lieu d'exécution du test le plus proche du serveur de votre site Web, qui doit également correspondre à la zone où se trouve votre cible.
L'emplacement du serveur modifie le LCP mentionné ci-dessus et la latence du réseau. La latence du réseau est le temps d'aller-retour entre le navigateur et le serveur. Vous devez toujours tester votre site depuis le même endroit afin de connaître l'évolution de vos performances en matière de vitesse.
Effectuer des tests multiples
Vous voulez exécuter le test plusieurs fois pour permettre la constitution d'un cache.
N'oubliez pas non plus que les valeurs des tests peuvent différer légèrement selon l'outil utilisé. Regardez la moyenne des scores pour obtenir une estimation proche de la réalité.
Ces pratiques garantissent la cohérence des résultats des tests de vitesse.
Tester des pages spécifiques
Il est recommandé d'effectuer des tests spécifiques sur les types de pages les plus pertinents devotre site Web. Testez la vitesse de votre page d'accueil, des pages de produits, des articles de blog, etc. De cette façon, vous serez en mesure de savoir si vous avez un problème avec un type de page particulier. Vous devrez peut-être revoir le format de présentation du contenu d'une certaine catégorie.
10 conseils pratiques pour améliorer la vitesse de vos pages
Maintenant que vous savez comment évaluer de manière concise la vitesse de vos pages, voyons quelles actions vous pouvez entreprendre pour améliorer vos performances sur le web.
1. Choisissez un hébergement adapté à vos besoins
Le choix du bon fournisseur d'hébergement peut réduire considérablement le temps de réponse du serveur. Il existe différents types de services d'hébergement. Parmi les plus populaires, citons les suivants :
- Hébergement mutualisé
- Hébergement sur serveur privé virtuel (VPS)
- Hébergement de serveurs dédiés
- Hébergement en nuage
- Hébergement géré
- Colocation
Bien que vous puissiez commencer par un hébergement partagé, qui est généralement le plus économique, vous devrez passer à un service d'hébergement plus puissant à mesure que votre trafic web augmentera.
Vérifiez régulièrement les besoins de votre site web pour vous assurer que vous disposez d'un service d'hébergement adéquat.
2. Utiliser un CDN
Un réseau de diffusion de contenu (CDN) est un réseau de serveurs géographiquement distribués qui travaillent ensemble pour accélérer la diffusion de contenu Internet.
En plus de l'hébergeur de votre site, vous pouvez envisager de faire appel à un CDN pour réduire la vitesse de chargement de vos pages. Cette pratique est particulièrement bénéfique pour les sites Web dont le volume de trafic est élevé et qui proviennent de différentes zones géographiques du globe.
Lorsqu'un utilisateur demande le contenu de votre site Web, le CDN le renvoie via le serveur le plus proche de l'emplacement de l'utilisateur, ce qui réduit la distance que les informations doivent parcourir. De cette façon, vous accélérez la livraison du contenu.
3. Gardez le poids de la page léger
La taille de vos fichiers a un impact direct sur la vitesse de votre site Web. Essayez donc de la réduire autant que possible. À cette fin, commencez par compresser vos fichiers à l'aide de Gzip, l'une des méthodes de compression les plus populaires. Cette application peut réduire considérablement la taille des fichiers HTML, CSS et JavaScript. Vous pouvez également activer GZIP avec WP Rocket ou W3 Total cache si vous utilisez WordPress.
Une autre façon d'améliorer la vitesse de chargement de vos pages est d'optimiser vos images. Vous devez les garder à la plus petite taille possible sans compromettre leur qualité.
En outre, vous pouvez utiliser le chargement paresseux pour que vos images ne se chargent pas toutes en même temps, mais au fur et à mesure que l'utilisateur navigue dans la page. Cette technique permet aux utilisateurs d'accéder plus rapidement à la page sans avoir à attendre le chargement des images.
4. Hébergez votre vidéo sur un service tiers
Bien que les vidéos constituent un support visuel incroyable pour votre site, vous ne devez pas leur permettre d'affecter le temps de chargement de vos pages.
La meilleure façon d'afficher des vidéos sur votre site est de les conserver sur un service tiers comme YouTube, Vimeo ou Wistia.
5. Activez la mise en cache du navigateur
La mise en cache est un moyen simple d'accélérer le temps de chargement de vos pages. En activant la mise en cache, vous permettez aux navigateurs de stocker les fichiers de votre site web sur l'ordinateur des utilisateurs afin qu'ils n'aient pas à les recharger lors de leur prochaine visite.
Certains des plugins de cache les plus populaires de WordPress sont W3 Total Cache, WP Rocket, ou LiteSpeed Cache.
Vous pouvez également activer la mise en cache dans votre fichier .htaccess si vous avez un site HTML statique.
6. Nettoyer les plugins inutiles
La suppression des plugins inutiles allégera votre site et vous aidera à identifier plus rapidement les problèmes lors du dépannage. Il est donc essentiel d'effectuer une maintenance régulière de vos plugins et de supprimer ceux dont le service est déjà couvert par un autre plugin ou que vous n'utilisez plus.
7. Réduire les redirections
N'oubliez pas qu'il y a une requête HTTP supplémentaire pour chaque redirection sur votre site. Quelques redirections peuvent être à peine perceptibles, mais en avoir un grand nombre nuit à la vitesse de votre site. Par conséquent, vous devez réduire le nombre de redirections au minimum possible, si vous ne pouvez pas les éliminer complètement.
Pour surveiller vos redirections, nous vous recommandons d'utiliser un outil de référencement comme FandangoSEO. L'outil répertorie vos redirections afin que vous puissiez les vérifier rapidement et déterminer si elles ont encore une utilité. Il est également utile pour identifier toute chaîne de redirection.
8. Différer le chargement de JavaScript
En différant les fichiers javascript, vous laissez les autres éléments se charger avant. Cette pratique permet d'éviter de bloquer le téléchargement d'autres éléments, ce qui pourrait nuire à la vitesse de chargement de la page.
Là encore, si vous avez un site Web WordPress, utilisez un plugin comme WP Rocket pour activer le chargement différé de JavaScript.
Si vous avez un site web HTML statique, vous pouvez utiliser la technique suivante.
Étape 1 : Copiez le code ci-dessous avant la balise dans votre HTML.
<script type="text/javascript">
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "example.js";
document.body.appendChild(element);
}
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;
</script>
Étape 2 : Remplacez example.js dans le code par le fichier script à différer.
Étape 3 : Sauvegardez les changements.
9. Optimiser les CSS et JavaScript
La réduction des CSS et JavaScript consiste à supprimer les caractères inutiles et à réduire la taille des fichiers pour accélérer leur chargement. Il s'agit d'éliminer les commentaires laissés par les développeurs (dont les moteurs de recherche ne se soucient pas), les espaces vides ou les caractères de nouvelle ligne. Vous pouvez également raccourcir les noms de variables ou combiner des règles de sélecteur CSS en double.
Bien que ce soit le travail d'un développeur, il existe des plugins de minification comme WP Rocket ou W3 Total cache qui vous permettent d'optimiser facilement vos fichiers CSS et JavaScript.
10. Effectuez constamment des tests de vitesse du site web
Le suivi de votre vitesse dans le temps vous permet de constater vos progrès et de détecter rapidement les problèmes de performance avant qu'ils ne s'aggravent. Comme vous pouvez le constater, de nombreux facteurs influencent la vitesse des sites Web, et il est nécessaire d'effectuer des audits réguliers.
Il existe différents outils sur le marché à cet effet. Vous pouvez utiliser un robot de référencement comme FandangoSEO, qui surveille les principaux paramètres du web et vous envoie des notifications par e-mail en cas de changement de paramètres, afin que vous soyez toujours à jour.
Nous espérons que cet article vous a été utile. 🙂
Faites-nous savoir si vous avez des questions ou si vous pensez à d'autres éléments pour accélérer le temps de chargement des sites Web.
Dernière mise à jour le 10 mai 2022 par Hannah Dango
