La vitesse de chargement d’une page est un facteur crucial pour l’ergonomie d’un site. Google considère que c’est l’un des facteurs qui influencent le plus le positionnement dans les résultats de recherche organiques et c’est également un plus d’un point de vue utilisateur. Lorsque vous avez beaucoup de concurrents dans votre secteur, la compétition pour obtenir du trafic devient de plus en plus rude et offrir une bonne ergonomie est d’autant plus crucial. Si votre site ne charge pas rapidement, vous pouvez perdre vos visiteurs en quelques secondes.
Voici 10 conseils pour vous aider à optimiser le temps de chargement de votre site :
1. Optimisez les dimensions et les formats de vos images
Les images présentes sur votre site peuvent prendre beaucoup de bande passante, ce qui affecte le temps de chargement. Réduire les dimensions de vos images en HTML ne suffit pas car cela ne changera que leur apparence et non leur taille réelle. Utilisez un logiciel de retouche d’image tel que Photoshop et modifiez la résolution à 72 dpi afin de les redimensionner.
En outre, utilisez des outils d’optimisation d’image qui pourront compresser vos images et réduire leurs dimensions :
- JPEG & PNG Stripper
- Smush.it
- Online Image Optimizer
- SuperGIF
Pour optimiser le temps de chargement de votre page, il est conseillé d’utiliser des formats d'image standards tels que JPG, PNG ou GIF.
[![essai gratuit Woorank]
2. Optimisez les dépendances
Plugins: Un site qui nécessite des plugins peut ralentir la vitesse de chargement des pages. Tous les plugins ne sont pas inutiles, les plugins de partage sur les réseaux sociaux par exemple sont incontournables de nos jours. Cela dit, il est conseillé de toujours vérifier s’il existe une meilleure alternative au plugin, comme l'utilisation d'un CMS avec plugins sociaux intégrés.
Tracking Scripts: Alors qu'il est conseillé de garder un œil sur les statistiques de trafic de votre site, il est déconseillé d'utiliser plusieurs logiciels de suivi car cela pourrait déteriorer son temps de chargement. Si vous utilisez un CMS comme WordPress, vous devriez soit permettre à WP stats d’exécuter des scripts sur votre page, soit Google Analytics, mais pas les deux.
Logiciels CMS: Si vous utilisez un CMS comme WordPress, il est recommandé de vérifier fréquemment les mises à jour dans le logiciel, mais ne les chargez pas sur un site directement. D’abord, éffectuez des mises à niveau sur un serveur distinct pour les tester. Avoir vos logiciels à jour améliore également la vitesse d'un site.
3. Évitez le code CSS et JS Inline
Il est conseillé de placer les codes JS et CSS de votre site dans des fichiers externes. Lorsque la page charge, le navigateur met en cache ces fichiers et réduit le temps de chargement sur les demandes ultérieures. De plus, avoir les codes JS et CSS dans des fichiers séparés facilite la maintenance du site.
4. Optimiser la mise en cache
Chaque fois qu'un visiteur charge un site, les fichiers d'images, les fichiers CSS et JS chargent aussi, ce qui ralentit le chargement de la page. Lorsque la mise en cache est correctement configurée, votre navigateur peut stocker ces ressources ou ces fichiers pour les demandes ultérieures. Lorsque les pages chargent de façon répétée, ces fichiers peuvent être récupérés à partir du cache plutôt que de les télécharger à nouveau à travers le réseau. Cela réduit également la bande passante et les coûts d'hébergement.
Vous pouvez utiliser des en-têtes d’expiration (en anglais “Expire Headers”) pour les composants statiques du site et des en-têtes de contrôle du cache (ou “headers Cache-Control”) pour les composants dynamiques. L'utilisation de ces en-têtes rend possible la mise en cache des différents composants d'un site, y compris les images, feuilles de style, scripts et composants Flash. Cela minimise les requêtes HTTP et améliore le temps de chargement. En utilisant les en-têtes d’expiration, vous pouvez contrôler le temps de mise en cache des composants d'une page Web, comme le montre l'exemple suivant :
Expires: Wed, 20 Apr 2015 20:00:00 GMT
Si vous utilisez un serveur Apache, vous pouvez régler l'heure pour le contenu mis en cache en utilisant la directive “ExpiresDefault”. Ceci permet de définir la date d'expiration à un certain nombre d'années à partir de la date actuelle.
ExpiresDefault “access plus 15 years”
5. Évitez les scripts qui bloquent l’affichage
Placez les fichiers javascript à la fin du code ou utilisez l’attribut HTML 'async' afin de charger les fichiers de manière asynchrone.
6. Évitez les redirections
Éviter les redirections permet de réduire le temps d'attente de vos visiteurs. Certaines redirections sont inévitables, mais souvenez-vous qu’elles déclenchent un cycle de requête-réponse HTTP supplémentaire qui augmente le temps de chargement. Vérifiez s’il existe des liens cassés et corrigez-les le plus vite possible.
7. Mettez en place un encodage G-Zip
Le principe est le même que lorsque vous compressez des fichiers sur votre PC pour réduire leur taille lors de transferts en ligne : les fichiers lourds de votre site peuvent être compressés avec ce qu'on appelle la compression gzip. Cela permet d'économiser de la bande passante, réduire le temps de téléchargement et améliorer la vitesse de chargement de vos pages. Vous devez configurer votre serveur pour qu’il autorise la compression de contenu.
8. Réduisez les requêtes HTTP
Utilisez CSS Sprites afin de réduire les requêtes d'images en combinant celles-ci en une seule image de fond, utilisez CSS background-image et background-position sur vos éléments afin de les afficher. Placez les images inline dans vos feuilles de style. De même, concaténez tous vos fichiers JavaScript et fichiers CSS dans des fichiers uniques.
9. Réduisez la taille des ressources JavaScript et CSS
Ce processus - appelé “minification” en anglais - consiste à comprésser le code en renommant les variables avec des noms plus courts, ce qui accélère le temps de chargement. Nous vous recommandons d'utiliser uglify.js pour cela.
10. Réduisez la taille des cookies
Les cookies sont utilisés par votre navigateur pour stocker des données qui pourraient être utiles par la suite. Ces données sont envoyées et conservées à chaque demande et déteriorent le temps de chargement lorsqu’il y en a beaucoup. Ainsi, en réduisant la taille des cookies, vous réduisez la taille des données qui sont stockées et vous améliorez par conséquent le temps de chargement de vos pages. Il est donc important d’éliminer les cookies inutiles ou de réduire leur taille.