La réactivité d'un site web devient un critère important pour le référencement de votre site sur Google et réduire le temps de chargement représente également un gage crucial de satisfaction pour vos lecteurs ainsi que pour la planète.
Une vitesse de chargement lente affecte le nombre total de pages indexées. En fait, les robots indexent des milliards de pages chaque jour. Googlebot n'a donc pas le temps de "perdre du temps" sur des sites lents.
Si vos pages sont rapides, vous avez certainement le temps de les crawler toutes. Sinon, la vitesse d'indexation des nouvelles pages sera plus lente et votre référencement sera retardé.
Google recommande que le premier octet prenne moins de 200 ms et que le début de l'affichage (au-dessus de la ligne de flottaison) prenne moins d'une seconde. Voici mes recommandations :
Les fichiers CSS sont parfois volumineux et freinent le chargement d'une page.
► Supprimer les propriétés CSS inutiles avec Purify css.
► Utiliser la syntaxe étendue.
► Regrouper les propriétés ayant des valeurs similaires.
► Employer des données hexadécimales pour les couleurs (Ex : color:#FFF au lieu de color:white).
► Renoncez aux polices Google gourmandes en temps et en requêtes.
► Rapportez toutes vos Fonts (polices de caractères) sur votre serveur avec fontsquirrel.
► Privilégier le format woff2 pour vos polices.
► Minifier vos fichiers CSS et supprimer les commentaires.
Avant de diffuser le fichier épuré, faire une copie de l'ancien fichier.
Quelquefois, les outils de vérification et de nettoyage du code retirent une parenthèse, un point-virgule, ou d'autres caractères pouvant modifier la mise en page. Je vous souhaite bonne chance pour les identifier.
Les fichiers JavaScript sont le principal ennemi des webmasters en termes de vitesse et de référencement ; la bonne façon d'optimiser les fichiers JS est de les éviter. Certains sites Web contiennent des animations propres et puissantes, mais elles sont toutes pilotées par JavaScript, ce qui réduit considérablement la vitesse de chargement. Cela est particulièrement vrai pour WordPress et ses plugins.
En particulier, la barre de boutons de partage des médias sociaux est pilotée par JavaScript. Ces fichiers JS sont des fichiers externes hébergés sur un serveur autre que le vôtre. Vous pouvez analyser le temps de chargement de ces fichiers JS dans le "Module développeur" de votre navigateur pour voir le temps qu'ils prennent.
De plus, ces fichiers externes sont tous dotés d'un temps de mise en cache bien trop court. Nous pouvons tenter de les récupérer en interne pour attribuer votre propre temps de mise en cache, par contre tous ne le prévoient pas.
► Minifier vos fichiers Javascript et éliminer les commentaires.
Les photos sont le deuxième problème majeur du webmaster qui désire accélérer son site.
► Compressez vos images sur chaque page avec Squoosh (convertir vos images en Webp, Webp2 ou Avif).
► Redimensionnez ses images à la bonne dimension.
► Choisir le format Webp (pour vos images) et/ou SVG (pour vos illustrations et icônes).
Le navigateur devra récupérer des ressources sur votre serveur de façon à visualiser votre page. Par exemple, une image = 1 requête, un fichier CSS = 1 requête, etc. Il faut donc limiter le nombre de requêtes envoyées au serveur.
Vous devez associer vos fichiers CSS en un seul. Plusieurs fichiers impliquent plusieurs requêtes. Un seul fichier correspond à une seule requête. De cette démarche, vous épargnez les allers-retours avec votre serveur. Ce processus désengorge votre serveur et raccourcit le temps de chargement de votre page. Des outils existent pour combiner ces fichiers CSS et JS.
À titre personnel, je le fait à la main, par choix, de manière à ne perdre aucun caractère important lors de la minification avec Notepad ++.
Certains fichiers JS devront se placer en premier pour que les autres fichiers JS dirigent correctement votre page Web. On peut citer le cas du fichier Jquery.
Avant de combiner, contrôlez l'ordre de vos fichiers JS et regroupez-les dans l'ordre.
Les fichiers JavaScript entravent le rendu de la page. D’ailleurs je vous recommande PageSpeed test, à la différence de la plupart des autres outils, il teste toutes les pages de votre domaine. Vous êtes ainsi en mesure de contrôler la totalité de votre site Internet et de repérer les pages secondaires les moins rapides.
► Positionnez systématiquement vos fichiers JavaScript avant </body> .
► Tentez de régler vos JS en async ou en defer (Attention, quelques fichiers JS refuseront de fonctionner. À vous de vérifier).
► Certains fichiers externes peut être téléchargés sur votre serveur tout en fonctionnant. Il vous appartient de procéder à des tests à ce sujet également.
Les longs temps de réponse des serveurs web affectent les temps de chargement des pages. Si vous choisissez un hébergement gratuit, vous ne pouvez pas vous attendre à des performances maximales.
Choisissez un hébergement de qualité (un serveur puissant avec une bonne bande passante et une bonne mémoire). Le coût est élevé, mais il doit être rapide et efficace pour ne pas altérer les performances web de votre site.
Les serveurs écologiques, également appelés serveurs "verts", sont des fournisseurs qui utilisent des sources d'énergie renouvelables et sont encore plus respectueux de l'environnement. Le choix d'une solution d'hébergement écologique est la première étape pour rendre votre site web vert.
► O2switch : Pour ma part le meilleur ! Hébergeur 100 % écologique basé à Clermont-Ferrand avec leurs propres Data centers géré sans intermédiaires. Un hébergement illimité tout inclus et sans surprise par une seul et unique offre à 7 € HT, la Puissance d'un Hébergement Cloud, exploitez jusqu'à 12 CPU - 48go de Ram !.
Retz Création internet
Stéphane Tijou
21 Vièvre, 44640 Le Pellerin
Lundi au vendredi de 9h à 19h
sans interruption
Tél: 06 24 54 62 41