Technologie

4 conseils pour optimiser le temps de chargement son site web pour le rendre plus rapide !

optimiser temps chargement

Vous souhaitez recevoir nos meilleurs articles ? 👇

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.

4 conseils pour optimiser le temps de chargement son site web pour le rendre plus rapide !
Votre avis sur cette info ?

Vous souhaitez recevoir nos meilleurs articles ? 👇

Commenter

RĂ©pondre

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

LEPTIDIGITAL est un blog vous proposant le meilleur de l'actualité digitale (SEO, Webmarketing, Social Media, SEA, Emailing, E-commerce, ...)

LA NEWSLETTER LEPTIDIGITAL

Recevez nos meilleurs articles en 1 clic !

UN PETIT LIKE ?

leptidigital facebook
haut