Sélectionner une page

Comment optimiser la vitesse de chargement de son site wordpress grâce au lazy load

La vitesse de chargement de votre site web est un facteur important. En effet, il peut avoir un impact direct sur la trans­for­mation de vos visiteurs à d'éventuels prospects.

Un article de GuerinDLC

16 janvier 2020

La vitesse de chargement d’un site comporte plusieurs facteurs (CMS, contenu, images, scripts, structure du code, temps de réponse du serveur….), et, il est important de faire son maximum afin de les optimiser, tant pour améliorer l’expérience utili­sateur que pour marquer des points dans son classement Google. 

Les résultats d’une mauvaise optimi­sation ? Avec un temps de chargement supérieur à 2 secondes ou plus, vos visiteurs risquent de quitter la page avant même de l’avoir chargé, résultat, un taux de rebond important, perte de trafic, expérience utili­sateur négligée. 

L’utilisation d’images à tendance à alourdir consi­dé­ra­blement vos pages web, nous vous donnons ici quelques astuces simples à appliquer afin d’optimiser leurs poids et leur chargement dans la page. 

1

Qu’est ce que le lazy load, et pourquoi l’utiliser ?

Au lieu de charger toutes les images / ressources de votre page à la fois, le Lazy load (ou chargement paresseux) consiste à charger seulement les ressources néces­saires visibles sur l’écran des utili­sa­teurs à l’instant T. 

Ce n’est que lorsque vous scrollez vers le bas, que votre site charge petit à petit les ressources qui sont désormais visibles dans la zone de visua­li­sation du navigateur.
En réalité, c’est un procédé commun que vous avez surement déjà dû croiser sans même vous en rendre compte, que ce soit sur les feeds facebook, les épingles de tableaux pinterest, ou bien encore sur twitter.

L’utilisation du lazy load vous permettra donc de proposer à vos utili­sa­teurs un site plus dynamique, et réactif, qui chargera en fonction de leurs besoins. 

2

Comment utiliser le lazy load sur wordpress.

Pour cela, il existe diffé­rents plugins, l’équipe de fière allure en a testé et sélec­tionné deux pour vous :

Mis à jour réguliè­rement et compa­tible wordpress 4.7 ou ultérieur ce plugin gratuit permet d’afficher les images d’une page uniquement lorsqu’elles sont visibles par l’utilisateur. Il en résulte une réduction du mécanisme de requêtes HTTP améliorant ainsi le temps de chargement.
Le plugin fonctionne : 
$

Sur les images dans les articles, les minia­tures ainsi que les images dans un widget texte, les avatars, les iframes et les smileys.

$

Il vous permet également de remplacer les iframes Youtube par une miniature d’aperçu afin d’accélérer davantage le temps de chargement du site.

Mis à jour réguliè­rement et compa­tible wordpress 4.0 ou ultérieur, ce plugin WordPress à est destiné à “lazy loadé” les articles, les commen­taires, etc.. Basé sur des requêtes Ajax, ce plugin est spécia­lement conçu pour un défilement infini, et est livré avec un Shortcode Builder. Les short­codes peuvent ainsi être injectés dans les pages via l’éditeur de texte wordpress ou direc­tement dans votre thème. Ce plugin est également compa­tible avec les plugins de e-commerce populaire tels que WooCommerce et Easy Digital Downloads.

3

Testez votre site

Il existe diffé­rents outils d’analyse pour votre site internet, afin de voir si votre site aurait besoin d’optimisation, ou de voir si la mise en place d’un plugin de lazy load à améliorer votre temps de chargement, vous pouvez tester : 

Estimez votre site !

Il est parfois difficile d’évaluer le coût d’un site web.

Pour vous aider à avoir une idée plus précise de l’investissement que repré­sente votre projet numérique, nous avons mis en place un outil permettant de mieux cerner vos besoins et envies.

4

Lazy load d’accord, mais comment optimiser encore plus mes images ?

Que votre site comporte beaucoup d’images ou non, nous vous conseillons de systé­ma­ti­quement compresser vos images, à diffé­rents degrés évidemment pour ne pas trop perdre en qualité.
Chez fière allure, cela est un automa­tisme avant même d’uploader nos ressources dans les médias wordpress. 

Nous utilisons :

$
OptimZilla (outil en ligne, simple et efficace qui permet de choisir son degré de compression et de compresser de multiples fichiers en simultané).

Or, si vous trouvez ce procédé fasti­dieux il est aussi possible d’utiliser un plugin qui se chargera de cela pour vous automa­ti­quement (de notre côté, nous préférons utiliser un outil en ligne et éviter au maximum la surcharge de plugins, pour garder un temps de chargement optimal) :

Mis à jour réguliè­rement, et avec plus de 200 000 instal­la­tions à son actif, Imagify est une référence dans le domaine.
Ce plugin gratuit compresse automa­ti­quement (sur 3 niveaux de compression au choix) toutes vos images téléversés dans les médias wordpress.

5

Un plugin tout en un c’est possible ?

Mis à jour réguliè­rement et compa­tible wordpress 4.7 ou ultérieur, Optimole est LA solution tout-en-un pour tous vos besoins d’optimisation d’image.

Ce plugin optimise vos images en temps réel avec un système basé sur le cloud pour accélérer votre site Web et fournir des images de haute qualité parfai­tement dimen­sionnées pour chaque appareil.

Donc, si vous cherchez un plugin qui permet le LazyLoad, avec un CDN (content delivery network) et des images parfai­tement dimen­sionnées, alors Optimole est parfait pour vous.

Le plan basic permet d’utiliser ce plugin gratui­tement si vous ne dépassez pas les 5000 visiteurs / mois. Au delà, il faudra envisager un plan payant.

Le mot de la fin

Il existe de nombreuses manières d’optimiser de temps de chargement de votre site internet, le lazy load en étant une simple à mettre en place qui permet d’améliorer consi­dé­ra­blement les performances. 

Nous espérons que cet article vous a aidé à choisir le meilleur plugin lazy load en fonction de vos besoins pour votre site web ! Si vous avez besoin d’aide afin de pousser les optimi­sa­tions de votre site web, n’hésitez pas à nous contacter !