Utilisez-vous un plugin de slider WordPress et constatez-vous un temps de latence ? Avez-vous remarqué que le chargement du slider de votre page d’accueil est lent ? Les techniques d’optimisation suivantes peuvent être appliquées aux plugins de slider WordPress les plus populaires, notamment :
- Slider Revolution
- LayerSlider
- Soliloque
- RoyalSlider
- Glissière WD
- Smart Slider
- Glissière lisse
- Master Slider
- MetaSlider
- Glissière Huge-IT
Pourquoi mon slider WordPress est-il lent ?
Votre slider WordPress se charge lentement en raison des 5 problèmes suivants : hébergement WordPress lent, plugin de slider obsolète, version WordPress obsolète, images volumineuses non compressées et paramètres d’optimisation du slider mal configurés. Apprenez à résoudre chaque problème dans les tutoriels ci-dessous. Si vous suivez ces étapes simples, votre slider se chargera beaucoup plus rapidement, laissant une excellente première impression aux visiteurs de votre site Web. C’est parti !
1. Hébergement WordPress lent
La principale cause de la lenteur d’un site web est le choix de votre hébergeur. Quelle que soit l’optimisation de votre plugin de slider, si les JS, CSS et images proviennent d’un hébergeur lent, votre slider mettra du temps à se charger. Si vous recherchez une solution plus rapide, consultez le comparatif des hébergeurs les plus rapides. En outre, vous pouvez consulter les meilleures options d’hébergement WordPress pour une analyse plus approfondie. Si vous êtes un photographe et que vous hébergez un site Web de portfolio riche en images, consultez les meilleurs hébergeurs Web pour les photographes.
Comment réparer un hébergement WordPress lent : Inscrivez-vous auprès d’un hébergeur recommandé tel que Bluehost pour accélérer votre site Web. (à partir de seulement 2,95 $/mois)
2. Votre plugin de slider est obsolète
Slider Revolution, le plugin de slider le plus populaire de WordPress, met à jour son code plus d’une douzaine de fois par an, en moyenne. En 2017, par exemple, ils ont eu 16 mises à jour (voir le changelog ici). Certaines de ces mises à jour concernent la compatibilité et l’optimisation de WordPress, tandis que d’autres ont un impact direct sur les performances (comme l’ajout du “Moniteur de performances et de meilleures suggestions de performances”). Si votre
Comment réparer les plugins de slider périmés : Connectez-vous à votre administration WordPress. Sélectionnez Dashboard > Updates > Select All > Update Plugins. Notez que certains thèmes WordPress ont une section distincte pour les plugins recommandés dans les paramètres du thème. Si votre plugin slider a été installé avec votre thème WordPress, vous trouverez peut-être une mise à jour ici, et non dans la section standard du tableau de bord > Updates.
3. Votre version de WordPress est obsolète
Maintenant que vos plugins sont mis à jour, vous devez également vous assurer que la version de votre WordPress est à jour. La plupart des mises à jour du cadre WordPress incluent une optimisation des performances et des temps de chargement des sites Web. La mise à jour de votre version de WordPress et de vos plugins garantit des performances optimales (si vous disposez d’un hébergeur rapide).
Comment mettre à jour la version de WordPress : À partir du même écran du tableau de bord > Updates, vous remarquerez un bouton “Update Now” sur la page “Update WordPress”. Suivez les instructions pour effectuer une mise à jour en un seul clic.
4. Vos images ne sont pas optimisées
Les sliders contiennent beaucoup d’images et l’utilisation d’images non optimisées via votre plugin de slider peut avoir un impact significatif sur les performances. Saviez-vous qu’en moyenne, les images représentent 54 % de la taille des pages d’un site web ? La réduction de la taille des images est un impératif dans le monde d’aujourd’hui où les performances du web sont déterminantes !
Comment optimiser les images sur votre site Web :
- Ajustez la taille de votre image. Réduisez toujours la taille de vos images pour obtenir une dimension en pixels appropriée à la résolution web. En règle générale, j’essaie d’avoir toutes mes images d’une largeur de 1200px ou moins, car la plupart des sites web et des navigateurs redimensionnent une image de cette taille ou plus pour l’adapter à l’écran de l’utilisateur. Si vous utilisez un programme de retouche photo, tel que Photoshop, vous voudrez utiliser le format de compression d’image du logiciel. Dans Adobe Photoshop, ouvrez votre image, puis rendez-vous à l’adresse suivante : Fichier > Exporter > Enregistrer pour le Web (Legacy) > puis sélectionnez les formats de fichier “PNG-24” ou “JPEG”. Pour les fichiers PNG, vous voudrez généralement sélectionner la case “Transparence”, ainsi que “Convertir en sRGB”. Pour le format JPEG, ne cochez pas les cases “Progressive” et “Embedded Color Profile”, mais cochez les cases “Optimized” et “Convert to sRGB”. Jouez avec le curseur “Qualité” pour ajuster la résolution. Vous voudrez que la taille du fichier soit aussi faible que possible, tout en conservant une qualité suffisante. Si l’image commence à être floue ou pixellisée dans le panneau d’aperçu de l’onglet Optimisé, augmentez un peu la qualité. En règle générale, une qualité de 60 à 80 % est un bon compromis entre la taille du fichier et la qualité.
- Installez un plugin de compression d’image WordPress sur votre site Web. Cela permettra non seulement d’optimiser davantage les images déjà présentes dans votre médiathèque, mais aussi de compresser automatiquement toutes les images que vous téléchargerez à l’avenir. Mon préféré est TinyPNG, qui utilise une compression intelligente des fichiers PNG et JPEG pour réduire la taille des fichiers d’image sans nuire à la qualité visuelle. Un plugin WordPress est disponible ici. Les alternatives à TinyPNG comprennent ShortPixel Image Optimizer et WP Smush, deux excellents plugins WordPress que j’utilise aussi fréquemment.
- Téléchargez l’image sur votre site web, en remplissant les champs titre de l’image et texte alt de l’image dans votre CMS, conformément aux meilleures pratiques de référencement.
5. Votre plugin Slider n'est pas optimisé
Saviez-vous que de nombreux sliders d’images WordPress disposent d’une section d’optimisation ? Avez-vous correctement configuré le vôtre ? Slider Revolution, par exemple, possède des paramètres de chargement paresseux et de performance, qui vous permettent d’optimiser et d’accélérer le temps de chargement. Vérifiez auprès de la documentation ou de la section d’assistance de votre glisseur spécifique, pour voir s’il existe un guide spécifique pour les performances.
Comment accélérer Slider Revolution :
- Pour accélérer Slider Revolution, sélectionnez d’abord l’un des paramètres de chargement paresseux suivants, que vous trouverez sous Modifier le curseur > Paramètres du curseur > Performances et optimisation du référencement. Ici, il y a 4 paramètres ;
Tout
(charger toutes les images de la diapositive),
Smart
(charger les images de la première diapositive et précharger également les images de la diapositive suivante),
Un seul site
(charger les images des diapositives “à la demande”), et
Pas de chargement paresseux
(charger toutes les images au chargement initial de la page). Le paramètre de chargement paresseux que vous choisissez dépend de la fonctionnalité de votre curseur, de la rapidité de votre site au départ et de ce que vous devez optimiser.
2. La deuxième façon d’accélérer Slider Revolution est de passer en revue la section “Performances globales des sliders”, qui contient deux boutons : “Afficher les statistiques complètes” et “Afficher tous les problèmes”. Suivez les suggestions de performance énumérées ici pour une vitesse de glissement optimale.
3. Enfin, pour garantir les temps de réponse les plus rapides de Slider Revolution, assurez-vous que la configuration requise est respectée. Dans la section principale de l’administration du plugin, vous verrez une case “Configuration requise”, qui vous donnera un état des statistiques du serveur recommandé, et ce que vous exécutez actuellement via votre hébergeur. Sélectionnez le bouton “Vérifier maintenant” pour un rafraîchissement en direct de vos statistiques.
Conseil de pro :
Si vous constatez que vous êtes en dessous de la limite de mémoire, de la taille maximale des fichiers ou de la taille maximale des messages, contactez votre hébergeur et demandez que ces limites soient augmentées jusqu’au montant suggéré. Souvent, l’hébergeur s’exécutera, sans avoir à mettre à niveau votre formule d’hébergement ou à vous facturer des frais mensuels supplémentaires. Toutefois, si vous constatez que votre hébergeur ne répond pas aux exigences du système, et s’il n’est pas disposé à vous mettre gratuitement à niveau, vous devrez envisager de migrer vers un nouvel hébergeur tel que Bluehost. J’ai trouvé le support technique de Bluehost très accommodant en ce qui concerne les exigences du système pour les sites WordPress.
En mettant en œuvre ces cinq étapes, vous devriez constater une augmentation significative des performances de votre slider WordPress. Si votre site Web est toujours lent, vous pouvez consulter cet article sur la façon d’accélérer WordPress.