D’après une récente étude de Google, 53% des utilisateurs quittent une page lorsque le temps de chargement dépasse les 3 secondes sur mobile.
Lorsque l’on sait qu’une landing page met en moyenne 22 secondes pour se charger, on comprend vite que le taux de rebond explose : un site trop lent est synonyme de perte de visiteurs et de référencement. Si la vitesse de chargement d’un site a globalement augmenté de 21% ces dernières années, c’est surtout à cause des nombreux éléments demandés par les internautes : ex : images en haute résolution, animations, vidéos, etc. Les pages sont non seulement plus lourdes mais elles sont aussi plus complètes et donc plus saturées. Optimiser le temps de chargement de son site est donc un axe de développement majeur pour les entreprises.
1- Identifier le temps de chargement moyen de votre site internet
Afin de déterminer le temps de chargement d’une page web, plusieurs outils simples d’utilisation et en ligne sont à votre disposition. Parmi ces derniers, nous pouvons par exemple citer l’outil Test My Site de Google. Pour aller plus loin dans l’anayse, nous vous conseillons toutefois de privilégier des solutions comme PageSpeed Insights, GTmetrix ou Pingdom. Ces outils ont l’avantage de vous fournir un résultat immédiat et des conseils d’optimisation avancés pour les versions mobiles et Desktop que Test My Site ne prodiguera pas.
2- Optimiser son HTML, CSS et JavaScript
Si vous avez quelques connaissances en coding, il vous est possible d’optimiser le temps de chargement de votre page en compressant vos codes JavaScript, CSS et HTML. En plaçant les fichiers Javascript et CSS au bon endroit, vous pourrez également optimiser le temps de chargement de votre site en limitant vos efforts.
- Placez le CSS dans le head de votre page et non dans le body permettra au style d’apparaitre presque instantanément comparé à un placement plus bas dans le code. Séparer les feuilles de style réduit également le temps de chargement et rend votre site plus dynamique.
- Pour les scripts Javascript, il est généralement recommandé de toujours les placer à la fin du document, avant la balise </body>.
3- Une résolution d’image adaptée au web
La résolution standard des images sur internet est de 72 dpi, de 300 dpi pour le print. Cependant, plus vous intégrez d’images en haute résolution sur une page, plus son temps de chargement sera important. Les sites e-commerce sont particulièrement sensibles à ce problème puisqu’ils ont tendance à tuliser de nombreuses photos en haute résolution dans leurs fiches produit pour optimiser au mieux l’expérience utilisateur.
Heureusement pour ces sites, il existe des techniques très simples à mettre en place afin de réduire le poids d’une image, comme la compression. Même si un article de 1&1 consacré à l’optimisation de site révèle que seuls 50% des sites d’e-commerce ont recours à cette technique, voici quelques réflexes à adopter lorsque vous souhaitez intégrer des images sur un site web et les optimiser un minimum :
- Compresser les images : facile à réaliser en ligne avec des outils comme Compressor.io par exemple, cette compression permet de réduire le poids d’une image sans pour autant perdre en qualité. Les formats JPG/JPEG, PNG, et GIF sont les mieux adaptés au web.
- Stocker les images sur un serveur externe (CDN) ou, si vous les intégrez sur votre serveur, redimensionnez-les directement avant intégration pour éviter de passer par vos fichiers CSS et ainsi intégrer des images trop lourdes qui s’afficheront ensuite dans un format plus réduit. N’hésitez pas non plus à spécifier la taille de vos images directement dans le HTML pour éviter un temps de traitement supplémentaire. Pour cela, utilisez cette balise :
- <img alt= »Image » src= »image.png » width= »100″ height= »100″ />
- Limitez le nombre d’images, de vidéos, de musiques et de fichiers PDF à charger. Souvenez-vous de privilégier la qualité à la quantité.
4- Et si votre hébergement web était en cause ?
La majorité des personnes qui créent un site web choisissent d’opter pour un hébergement mutualisé par soucis d’économie. Concrètement, cela signifie qu’ils partagent un serveur avec de nombreux autres clients. Cette option est parfaite pour les sites ayant un faible trafic et hébergeant peu de ressources, comme les petits blogs personnels et les sites vitrine de quelques pages. Avoir recours à ce type d’hébergement web ralentit toutefois significativement le temps de chargement des pages.
C’est pourquoi, il est fortement recommandé, pour les sites professionnels à fort trafic et les e-commerçant d’avoir recours à un serveur dédié. Concrètement, cela consiste à louer directement un serveur dont vous aller gérer intégralement l’administration.
Pour ceux qui ne souhaiteraient pas aller jusque là, une alternative envisageable reste également l’hébergement virtuel qui permet de louer une partie d’un serveur dédié pour un coût plus faible. Cette option vous rendra toutefois dépendant des paramètres configurés par l’hébergeur.
Ces quelques astuces, à la fois simples et faciles à mettre en œuvre sont les premières étapes à mettre en place pour optimiser le temps de chargement de son site web tout en améliorant l’expérience utilisateur et donc potentiellement, le référencement de votre site internet.
Principalement passionné par les nouvelles technologies, l’IA, la cybersécurité, je suis un professionnel de nature discrète qui n’aime pas trop les réseaux sociaux (je n’ai pas de comptes publics). Rédacteur indépendant pour LEPTIDIGITAL, j’interviens en priorité sur des sujets d’actualité mais aussi sur des articles de fond. Pour me contacter : [email protected]
