Chapitre 3 : Vitesse de Chargement

Est ce que votre Site Internet empêche votre Chiffre d’Affaire de grimper ?

Imaginez.

Les beaux jours arrivent.

Vous êtes passé à côté de ce restaurant au bord de la plage.

Vous vous imaginez déjà laisser vos problèmes quotidiens à l’entrée du restaurant, vous affaler sur un transat’, et laisser le soleil (et votre verre de vin blanc) vous aider à voir la vie du bon côté.

Le menu à l’air très bon, et les tarifs abordables, ce qui est rare en bord de mer !

Vous êtes conquis.e, votre conjoint.e aussi. Vous rentrez chez vous, et vous décidez d’une date pour y aller.

Vous tapez le nom du restaurant sur Google. Vous voyez le nom du restaurant et vous cliquez dessus.

1.

2.

3.

4.

5 secondes …

Le site est TOUJOURS en train de charger ! « Il doit avoir un problème » !

—–

C’est exactement le scénario que nous voulons éviter !

Si votre site est trop long à charger, les visiteurs vont rapidement s’impatienter, et aller chez la concurrence.

L’objectif est de supprimer les résistances que peuvent rencontrer les prospects qui souhaitent se rendre sur votre site.

Aujourd’hui, nous allons parler de 3 axes d’améliorations techniques (faciles à mettre en place) afin d’améliorer la vitesse de chargement de votre site.

Pourquoi Optimiser le temps de chargement de son site ?

Donner davantage de visibilités à vos idées et produits va passer, à un moment ou à un autre, par de la technique.

Bien entendu :

  • Inutile de trop prioriser cet aspect si vous n’avez pas encore un contenu intéressant à partager
  • Inutile de viser chaque semaine une baisse du temps de chargement de votre site

Nous y reviendrons, l’objectif à avoir en tête, c’est que si vos pages sont trop longue à charger (3 secondes max), alors vous devez en faire une priorité.

Deux études ont été faites afin de mettre en avant l’impact direct du temps de chargement sur l’expérience utilisateur … et sur les ventes !

  • 47% des internautes quittent un site au bout de 3 secondes s’il se charge mal
  • Amazon a publié une étude : 0.1 seconde en +, c’est 1% des ventes en –

Le temps de chargement sur Mobile est de plus en plus important

L’expérience utilisateur sur mobile devient prioritaire aux yeux de Google.

En Aout 2017, le nombre de recherches effectuées sur Google France sur mobile ont, pour la première fois, dépassés les recherches à partir d’un ordinateur.

Et cette tendance va se confirmer, au fil du temps.

C’est pour cette raison que votre objectif est d’avoir un site :

  • rapide 
  • agréable à consulter ( navigation simple peu importe le support )

sur ordinateur ET sur mobile.

Source : https://webmasters.googleblog.com/2018/01/using-page-speed-in-mobile-search.html

Dans les lignes qui suivent, nous allons aborder les 3 points qui dégradent le temps de chargement de la majorité des sites internet (et comment y remédier).

Comment savoir si votre site possède un temps de chargement optimal ?

Google à mis à votre disposition un outil gratuit, vous permettant d’obtenir toutes les infos qu’il vous faut.

Google Page Speed Insight

Google Page Speed Insight est un outil gratuit mis à votre disposition afin de vous expliquer simplement les axes d’amélioration de votre site, en terme de vitesse.

Google à un grand intérêt de vous fournir des outils gratuits avec des conseils pertinents puisque son but est de fournir, dans ses résultats, des sites offrants des conseils intéressants et une expérience agréable.

 

Je vous encourage à tester votre site afin d’avoir une idée de son temps de chargement.

Peut être qu’actuellement, c’est un facteur bloquant dans votre stratégie SEO, et vous ne le saviez pas …

La majorité des sites mal optimisés techniquement se retrouvent bloqués dans un de ces trois problèmes que nous allons voir dès maintenant.

Les 3 Pilliers pour améliorer sa vitesses de chargement

 

 

Ça y est, vous avez testé votre site ?

Je suis certain que si votre score n’est pas optimal, le problème vient :

  • La mise en cache de votre site
  • Des images mal optimisés
  • Du code Javascript qui empêche un chargement rapide

 

Des tonnes de plugins sur WordPress ( et sur la majorité des autres CMS ) vous permettront de pallier à ces problèmes.

Voyons comment travailler ces 3 points vont améliorer votre temps de chargement.

1/La mise en Cache

Avant la mise en cache

La majorité des personnes possèdent un site avec un CMS.

C’est un système de gestion de contenu.

WordPress, c’est un CMS.

Prestashop, c’est un CMS.

Ce sont des sites préfabriqué, où vous pouvez commencer à publier du contenu & des produits sans avoir besoin de savoir coder.

En général, il y a 2 endroits où vont être stockés vos données :

  • sur un hébergeur 
  • dans une base de donnée.

L’avantage de la base de donnée, c’est que vous pouvez classer et retrouver facilement vos informations. Vous allez rapidement trouver vos articles, vos images, etc …

Le problème, c’est que quand une personne visite votre site, votre navigateur ( Chrome, Firefox, etc …) doit faire appel à tout le contenu dont il a besoin, classé sur l’hébergeur et la base de donnée.

Et c’est long.

Mais à tout problème, sa solution.

Et la mise en cache est là pour pallier à ce problème.

Après la mise en cache

L’objectif de la mise en cache est simple.

Un plugin (généralement) va créer une copie de votre page web et va tout stocker à un seul endroit.

Donc, quand une personne voudra accéder à une page de votre site internet, c’est cette copie statique qui sera chargé.

Cette copie sera mise à jour régulièrement.

D’ailleurs, si vous avez déjà utilisé un CMS comme WordPress, vous vous êtes peut être déjà fait avoir.

Vous faites une modification sur votre site, vous enregistrez, actualisez la page modifié et … rien ne se passe.

Vous pensez alors à un gros problème alors que … vous avez simplement de supprimer le cache ( la copie de votre page pré-enregistré ).

 

Optimisation des images

Ici c’est très simple :

Dans la majorité des cas, vos images sont trop lourdes.

Et, vous ne souhaitez pas diminuer leur taille / qualité puisque sinon « ça va faire moche ».

Sachez qu’avec la précision des outils d’aujourd’hui, vous pouvez diminuer la qualité de vos images sans que personne s’en rende compte.

Pourtant, ça va alléger votre page et Google va apprécier

Minification du JS, html & CSS

Dernière partie pour améliorer facilement votre temps de chargement. Attention, lisez ce paragraphe jusqu’à la fin car cette étape peut autant améliorer votre temps de chargement, que créer des bugs.

Une page Web : 

  • est constitué de lignes de codes,
  • mêle souvent plusieurs langages de programmation

Si vous cliquez sur Ctrl + u, le code source, vu par un robot, un navigateur, va apparaître. Vous verrez tout le code que cette page à besoin afin de s’afficher ainsi.

Dans tout ce code, il y a la possibilité de supprimer beaucoup d’éléments, sans altérer le bon fonctionnement de votre site internet.

Cela va alléger votre page et améliorer votre temps de chargement.

Vous allez supprimez, des éléments inutiles tel que :

  • Des espaces
  • Des commentaires
  • Des sauts de lignes
  • Etc …

 

« J’ai installé un plugin de minification et maintenant, mon site se charge mal ! »

Je vous avais dit de rester jusqu’au bout 😀

Maintenant que vous avez installé un plugin (peut importe lequel, ils ont généralement les mêmes fonctionnalités), vous allez pouvoir minifier vos codes.

Il est possible qu’après ça, votre site se charger mal. Généralement, c’est à cause d’un langage nommé Javascript.

Pour débloquer le problème, c’est simple.

Faites un clic droit > inspecter > Console, et copiez les urls des scripts mal chargé.

Généralement, vous allez pouvoir exclure des scripts de la minification.

Il vous suffira de coller les scripts qui se chargent mal dans la partie qui permet d’exclure des scripts, et le problème sera résolu.

« Pourquoi ces Problèmes apparaissent t’ils ? »

En général, ces problèmes ont 2 sources :

– Scripts JS mal appelés dans les plugins/thèmes
– Scripts JS mal codés, et créant des effets de bord lors de leur fusion

Il n’est pas question, bien sur, de vous mettre au Javascript pour corriger ces problèmes par vous même.

Les plugins de minification/fusion de Javascript, permettent en règle général d’exclure certains fichiers de cette fusion.

Il est souvent préférable d’exclure jQuery.js par exemple, afin qu’il se charge en priorité.

Puis, il faut procéder par élimination, en jouant avec l’activation/désactivation de la fonction de fusion, et exclure progressivement les fichiers javascript identifiés.

 

 

Vous avez maintenant 3 axes d’améliorations pour optimiser votre site.

Dans la majorité des cas, l’amélioration de ces 3 points va améliorer la vitesse de chargement de votre site.

Vous allez supprimer les résistances que pourraient avoir vos visiteurs quand ils souhaitent se rendre sur votre site !

Téléchargez dès maintenant ce Guide au format PDF + Audio, cliquez ci dessous

(en cours de création)

Chapitre 4 | Sommaire