Le temps de chargement des pages d’un site internet est un élément très important à prendre en considération, pour de multiples raisons dont certaines tiennent au référencement naturel (SEO) et d’autres plus à de la logique d’expérience utilisateur, et donc au final de commerce au sens large. Optimiser le temps de chargement des pages de son site internet est donc un objectif à la fois critique, et assez lourd en termes d’implications techniques, tant les améliorations sont nombreuses.
Pour autant, l’optimisation du temps de chargement est un facteur de plus en plus déterminant d’un point de vue SEO. Cela fait déjà plusieurs années que l’on sait – ou que l’on suppose, parfois – que la vitesse de chargement fait partie des critères de l’algorithme de Google, et le moteur de recherche mène de fréquents et réguliers chantiers dans ce secteur : la vitesse de chargement des pages web est un cheval de bataille de Google, qui multiplie les efforts et les annonces dans ce domaine. PageSpeed et le format AMP ne sont que quelques exemples des efforts menés par le moteur de recherche pour amener les développeurs et les décideurs à accentuer leur travail d’optimisation.
Speed Update : la mise à jour Google pour le mobile
En janvier 2018, Google a officiellement annoncé que la vitesse de chargement des pages allait bientôt être de nouveau sous le feu des projecteurs. Alors que le moteur de recherche reconnaissait que ce critère était depuis longtemps un signal (parmi d’autres) de la qualité d’une page web pour les recherches “desktop”, l’annonce de janvier a posé les bases d’un élargissement de ce critère au format mobile. Google annonce la sortie en juillet 2018 d’une mise à jour intitulée “Speed Update”, qui intégrera le temps de chargement des pages web dans les facteurs de classement des pages mobiles.
Bien évidemment, il ne s’agira là que d’un facteur parmi d’autres, et Google tient à préciser que la pertinence de chaque page par rapport à une requête restera déterminante. Autrement dit, face à une recherche déterminée, une page web même peu optimisée pourra néanmoins remonter haut dans le classement des pages de résultats si son contenu correspond très précisément à ce que cherche l’internaute. Seules les pages extrêmement lentes pourront être légèrement pénalisées, aucun bonus spécial n’étant attendu pour les sites particulièrement rapides sur mobile.
Optimiser le temps de chargement des pages
Optimiser le temps de chargement de ses pages est un chantier potentiellement très gourmand en ressources, mais il existe heureusement de très nombreuses pistes d’optimisation assez simples à mettre en oeuvre. L’expérience montre que, aussi simples que soient ces mesures, beaucoup restent à réaliser sur de nombreux sites internet. Petit tour d’horizon des “quick wins” sur votre temps de chargement.
Les fichiers statiques
Les images : les images sont des fichiers statiques, dont le poids et les dimensions ont une grande incidence sur le temps de chargement des pages. Il faut s’assurer que chaque image soit correctement optimisée pour le web afin que son poids soit limité. De même, il faut aussi que les développeurs possèdent le bon format d’image sur les bonnes pages.
Par exemple, sur une liste de produits d’un site e-commerce, vous avez établi le fait que les images illustrant chaque article avaient une dimension de 200 x 200 pixels. Par conséquent, la seule bonne solution est d’avoir des images réellement à ce format, dont le poids est optimisé. Trop souvent, par méconnaissance ou désir de ne pas multiplier les formats, on a tendance à utiliser un format plus grand, que l’on réduit en HTML. C’est une erreur.
Si votre site est en responsive web design, ce point est à relativiser car bien souvent vos images seront redimensionnées à la volée (il existe cependant des techniques spécifiques au responsive, comme la balise srcset, regardez l’image plus bas pour voir le code source et vous comprendrez ^^).
Pour soulager votre bande passante, et améliorer le temps de chargement des images, il est aussi possible de stocker ces dernières sur un CDN (Content Delivery Network). Le CDN peut être d’ailleurs utilisé pour n’importe quel type de fichier statique, et certaines sociétés proposent même leur service pour des fichiers dynamiques.
Les fichiers JavaScript et CSS sont d’autres fichiers statiques, indispensables au bon fonctionnement de votre site internet, mais qu’il est possible d’améliorer pour optimiser la vitesse de chargement de vos pages. Tout d’abord, afin de favoriser la mise en cache du navigateur, il est recommandé de disposer tout le code JS et CSS dans des fichiers séparés, et pas en “inline” dans vos pages. Il est aussi possible de renforcer cette mise en cache via des directives spécifiques dans le fichier htaccess. Une autre amélioration à faire pour ces fichiers consiste à les “minifier”, c’est-à-dire retirer la plupart des retours chariot et des espaces dans les fichiers. Des outils en ligne existent pour minifier les fichiers – attention de conserver vos fichiers non “minifiés” car une fois la procédure faite, il devient très difficile de modifier la moindre ligne de code pour des raisons de lisibilité. Enfin, charger dans la mesure du possible les fichiers JavaScript en fin de code HTML (afin la fermeture de la balise body) permet d’afficher les pages plus rapidement à l’utilisateur et de diminuer la sensation de “ralentissement” qu’un internaute pourrait subir, surtout sur une connexion mobile ou peu performante en général.
D’un point de vue plus technique encore, il est possible d’agir au niveau de votre serveur de fichier en activant la compression Gzip sur votre serveur Apache. La compression Gzip indique au serveur de compresser à la volée les fichiers demandés, afin de réduire la bande passante consommée et d’améliorer la vitesse de chargement desdits fichiers. La compression Gzip n’est qu’un simple paramètre à activer, et ne consomme que quelques pourcentages de CPU sur votre serveur, c’est donc un paramètre à activer impérativement.
Tu vois, le monde se divise en deux catégories : ceux qui activent la compression Gzip, et ceux qui ont un site qui rame. Toi, tu as un site qui rame.
La mise en cache
La mise en cache, à tous points de vue, est le nerf de la guerre. Un site qui n’exploite aucun système de mise en cache est un site qui sera à coup sûr très lent à se charger. Il existe différents niveaux de mise en cache, selon que l’on parle de fichiers statiques (images, css, js par exemple), de fichiers dynamiques, ou même de la base de données.
D’un point de vue général, il faut avoir à l’esprit qu’une page web n’évolue pas en permanence au niveau des données qui la composent. Par exemple, sur un site e-commerce, une fiche produit n’a très souvent besoin d’évoluer que dans trois cas : changement de prix, changement de stock, changement d’un élément d’information (image, description, etc.). La modification de prix est souvent gérée depuis l’ERP de la société, et synchronisée via un système d’API quelconque. Le stock de son côté est géré également de façon automatique, soit depuis l’ERP (mouvement de stock entrant), soit depuis le site e-commerce (suite à une commande).
La bonne réflexion à avoir est la suivante : dans une journée classique, combien de fois cette page est-elle chargée par un internaute, et d’un autre côté combien de fois un élément important du produit est-il modifié ? Assurément, vous devriez avoir en toute logique plus de visites sur une page que de changements sur ladite page : la mise en cache est justifiée dans 99,99% des cas, et permet d’économiser parfois plusieurs centaines de requêtes par page, en fonction de leur complexité.
Optimisation de la base de données
Concernant la base de données en particulier, il existe également quelques pistes d’amélioration permettant d’accélérer drastiquement le temps de chargement de vos pages.
L’étude du fichier des “Slow Queries” permet de voir rapidement quelles sont les requêtes les plus lentes sur votre serveur, ce qui donne la possibilité de les étudier de près, de vérifier si les différentes clés utilisent bien des index, s’il est possible de simplifier les requêtes dans certains cas, etc. Si un travail d’optimisation SQL n’a jamais été mené, on trouve très souvent dans ce genre d’audit des requêtes parfois très lentes pour des raisons “historiques”, car une requête vieille de plusieurs années n’a parfois pas été imaginée en tenant compte de la progression des volumes de clients ou d’articles, et un script autrefois instantané peut désormais constituer un goulot d’étranglement pour votre site.
Conclusion
Comme vous l’avez vu, il existe de très nombreuses pistes d’optimisation pour accélérer la vitesse de chargement des pages web. Les éléments abordés dans cet article ne sont en réalité qu’une présentation très sommaire de ce qu’il est possible de faire. Dans les faits, un audit technique en profondeur permettra de définir une liste des points à régler pour optimiser la vitesse de chargement de votre site internet, et de déclencher un gros chantier technique pour les développeurs, les graphistes, les administrateurs système et DBA.
Contactez-moi si vous souhaitez que j’audite votre site internet.
0 commentaire