Optimisation d'image WordPress : le guide ultime

L'optimisation des images WordPress consiste à réduire ou à compresser la taille des fichiers des images sur votre site WordPress sans impacter négativement la façon dont les images apparaissent sur les écrans. Lorsque vous faites l'effort d'optimiser les images dans WordPress, vous accélérez la vitesse de votre site Web et de vos pages, ce qui aide finalement à capturer plus de nouveaux visiteurs sur le site.

Dans ce guide, nous examinons l'optimisation des images WordPress, c'est pourquoi vous devez optimiser les images et les techniques d'optimisation d'image. Nous examinons également les plugins d'optimisation d'image WordPress, la résolution d'image et le format d'image. Enfin, nous terminerons par l'impact de l'optimisation des images WordPress sur le référencement. Allons-y!

Pour comprendre l'importance de l'optimisation de l'image, posez-vous une question simple : lorsque vous accédez à un nouveau site Web et que la page ne se charge pas rapidement, que faites-vous ?

Si vous êtes comme beaucoup de gens, vous le fermez probablement et passez à autre chose, n'est-ce pas ? À tout le moins, vous vous sentirez impatient et frustré par le temps que prend le chargement du site Web. Ou si vous restez, c'est uniquement parce que vous êtes vraiment intéressé par ce contenu particulier. Vous ne serez probablement jamais de retour sur ce site après avoir lu cet article. Le site est tout simplement trop lent.

Qu'est-ce que cette expérience a à voir avec la raison pour laquelle vous devez optimiser les images dans WordPress ? Les temps de chargement des pages sont souvent fortement influencés par la taille des images. Ainsi, l'optimisation des images WordPress entre en jeu dans une large mesure lorsqu'il s'agit d'améliorer l'expérience utilisateur et même votre classement SEO.

Qu'est-ce que l'optimisation d'image WordPress ?

Les images peuvent être optimisées de plusieurs manières pour un site Web WordPress, en utilisant différents outils et techniques. L'utilisation de fichiers de plus petite taille signifie que vous pouvez remplir votre site avec encore plus d'images sans l'alourdir ni le ralentir.

L'optimisation de toutes les images de votre site WordPress devrait figurer en tête de votre liste de priorités lorsqu'il s'agit d'optimiser votre site WordPress en général. Le processus d'optimisation de l'image rendra votre site beaucoup moins lourd et se chargera plus rapidement que jamais, capturant plus de nouveaux utilisateurs et les faisant revenir pour plus de contenu.

Après tout, peu importe la qualité de votre contenu, peu importe si les utilisateurs partent avant de le consommer.

Pourquoi devrais-je optimiser les images dans WordPress ?

Il y a quatre raisons principales pour lesquelles vous devriez optimiser les images dans WordPress.

1. Accélérer les temps de chargement des pages
2. Améliorer le référencement (optimisation des moteurs de recherche)
3. Réduire les charges du serveur
4. Réduire la taille globale du site Web afin qu'il nécessite moins de ressources
5. Restez au courant des tâches de maintenance WordPress importantes

Jetons un coup d'œil à certaines des spécificités des temps de chargement des pages en ce qui concerne l'optimisation des images WordPress.

En 2020, un site Web qui prend dix secondes ou plus à charger ne retiendra tout simplement pas l'attention d'un utilisateur. Et bien qu'il n'y ait pas de définition exacte d'une vitesse de chargement de page cible optimale, des études d'experts récentes montrent que :

1. Les dix premières secondes ont un impact considérable sur la durée pendant laquelle les utilisateurs restent sur les pages Web. Les lecteurs rebondiront sur votre page ou votre publication si tout le contenu n'est pas affiché dans ce court laps de temps.
2. Dans 79% des cas, si un utilisateur n'est pas satisfait de la vitesse du site, il ne reviendra jamais sur ce site car la vitesse est une tuerie.
3. Pire encore, 47% des utilisateurs insatisfaits non seulement rejetteront votre site personnellement, mais décourageront les autres utilisateurs en discutant avec leurs amis de leur expérience. Ils sont également plus enclins à laisser des avis négatifs sur les réseaux sociaux et Google.

Toutes ces statistiques signifient qu'il est absolument essentiel de maintenir les temps de chargement des pages de votre site Web bien en deçà de dix secondes. En réalité, votre objectif devrait être inférieur à trois secondes. Et c'est là qu'intervient l'optimisation des images WordPress.

Facteurs qui affectent les vitesses de chargement des pages WordPress

Vous souhaitez que votre site WordPress se charge plus rapidement, mais vous ne savez pas exactement par où commencer. L'objectif principal aujourd'hui est l'optimisation des images, que vous aurez une compréhension approfondie d'ici la fin de cet article.

Mais dans le cadre d'un effort plus large d'optimisation de WordPress, il est important de comprendre tous les facteurs qui ont un impact sur la vitesse de votre site.

Pour un site ultra-rapide, il est important de :

1. Utilisez des images légères

L'utilisation d'images « légères » est réalisée grâce à l'optimisation de l'image. Le but est de compresser les images au maximum sans rien perdre de la qualité. Ce processus est appelé compression sans perte (nous y reviendrons plus tard) et nécessite l'utilisation d'un optimiseur d'image.

2. Optimisez la mise en cache de votre site Web

La mise en cache WordPress aide votre site Web à se charger plus rapidement en réduisant la quantité de transfert de données entre le navigateur du visiteur de votre site, la base de données WordPress de votre site et le serveur Web de votre site Web. Un plugin de mise en cache WordPress qui conservera et effacera le cache de votre site si nécessaire, à la fois manuellement et automatiquement.

3. Utilisez un hébergeur WordPress de qualité

Les propriétaires de sites WordPress sérieux n'exécutent pas leurs sites Web sur un plan d'hébergement de 4 $/mois pour une raison. Bien que ceux-ci puissent fonctionner correctement pour les personnes qui gèrent des blogs personnels qui utilisent très peu de ressources (et n'obtiennent pas beaucoup de trafic), ils ne le coupent pas pour les propriétaires de sites qui ont une charge plus élevée et exigent des vitesses de site plus rapides.

Passez du temps à trouver un fournisseur d'hébergement géré de qualité qui possède des centres de données répartis dans plusieurs régions. Comparez également les temps de réponse au niveau du serveur lorsque vous recherchez un hôte. Ces facteurs auront certainement un impact sur la rapidité avec laquelle votre site se charge pour vos utilisateurs.

4. Optimiser le code

Le code qui alimente votre site Web doit également être optimisé afin d'accélérer les temps de chargement des pages. Optimiser le code sur votre site WordPress, en général, signifie :

• Utiliser des plugins et des thèmes de qualité
• Garder vos thèmes et plugins à jour avec la dernière version
• Ne pas utiliser de plugins qui se chevauchent dans les fonctionnalités ou les fonctionnalités
• Désinstaller/supprimer tous les plugins ou thèmes inutilisés.

Les développeurs doivent réduire le code en :

• Suppression de la mise en forme et des commentaires
• Se débarrasser des espaces supplémentaires
• Supprimer les virgules et le code qui n'est pas utilisé

Il est important de minimiser le code dans toutes vos ressources, y compris HTML, JavaScript et CSS. Pour minifier votre HTML, un outil puissant est HTMLMinifier. Pour JavaScript, essayez UglifyJS. Le compilateur de fermeture mérite également d'être examiné. En ce qui concerne votre CSS, CSSNano est un bon choix.

5. Réduisez les redirections

Il y a des moments où il est nécessaire de configurer des redirections afin d'éviter ces mauvaises erreurs 404. Mais si possible, évitez toujours ce qu'on appelle les "redirections à usages multiples".

Cela signifie que vos redirections vont de, par exemple, example.com > example.com/sous-domaine > example.com/sous-domaine/redirect.html. Il serait très difficile pour la page cible de se charger en trois secondes ou moins avec ces multiples redirections en cours d'exécution.

Une redirection est acceptable. Plus d'un ne l'est généralement pas.

Maintenant que vous avez compris les facteurs supplémentaires qui ont un impact sur la vitesse de votre site, concentrons-nous sur l'optimisation de vos images WordPress.

En fin de compte, l'optimisation des images WordPress est un processus que vous voudrez mettre en œuvre, que vous gériez un site de petite entreprise ou que vous gériez plusieurs sites WordPress pour plusieurs clients.

WordPress compresse-t-il automatiquement les images ?

Oui et non. Avec la sortie de WordPress 5.3, le noyau de WordPress a introduit une prise en charge améliorée des images haute résolution téléchargées. Il s'agit notamment des images que vous avez prises avec un appareil photo de haute qualité ou votre smartphone.

• La fonction de compression d'image introduite dans WordPress 5.3 détecte lorsqu'une grande image est téléchargée, puis génère automatiquement des versions optimisées pour le Web de l'image.
• Lors du téléchargement, les images sont automatiquement redimensionnées à 2560 pixels, la nouvelle taille complète de WordPress.
• Lorsqu'une image que vous téléchargez est redimensionnée, le mot « redimensionné » est ajouté au nom de votre fichier.
• Si un redimensionnement automatique de l'image échoue en raison d'un délai d'attente sur le serveur, WordPress réessayera continuellement jusqu'à ce que l'image optimisée soit produite.

Cette mise à jour du noyau WordPress était importante pour les développeurs qui n'avaient peut-être pas réalisé à quel point leurs gros fichiers image ralentissaient leurs sites Web. Cependant, l'optimisation d'image intégrée fournie par WordPress n'est pas une excellente solution globale et n'est pas adaptée à chaque développeur WordPress individuellement. C'est un bon premier pas, mais pour maximiser pleinement l'optimisation de votre image, vous devez aller plus loin.

Comment optimiser les images dans WordPress ?

L'optimisation complète de vos images dans WordPress n'est pas une tâche trop délicate.

Il existe trois manières principales d’optimiser les images de votre site WordPress :

1. Plugins d'optimisation d'image WordPress qui vous permettent de faire le travail directement à partir de votre tableau de bord d'administration WordPress.
2. Logiciel/application d'optimisation d'image de pré-téléchargement - Ces applications peuvent être soit un logiciel open source comme un optimiseur d'image ou, au minimum, un éditeur de photos, ou des applications payantes qui offrent des capacités d'ajustement de la taille de l'image. Photoshop est un exemple d'application logicielle premium qui vous permet d'ajuster la résolution de l'image pour compresser les images pour une utilisation Web.
3. Services en ligne gratuits qui compressent et optimisent vos images avant de les télécharger sur WordPress.

Utilisation d'un optimiseur d'image de pré-téléchargement

Généralement, optimiser une image signifie la compresser . Un optimiseur d'image, ou compresseur, est un logiciel que vous installez sur votre appareil personnel ou accédez en ligne via votre navigateur Web.

Pour utiliser un optimiseur d'image, il vous suffit de télécharger une image et de permettre au programme d'apporter de légères modifications aux pixels. Ces charges ne peuvent pas être détectées à l'œil nu, c'est pourquoi le processus est parfois appelé compression sans perte.

Le même type de technique est appliqué lorsque vous compressez un fichier audio en MP3. Dans ce processus, les hautes fréquences sont stratégiquement réduites de manière à ce que l'oreille ne puisse détecter aucun changement.

Options de l'outil d'optimisation d'image de pré-téléchargement

Vous disposez de plusieurs options pour les outils qui compresseront et optimiseront vos images avant de les télécharger sur WordPress.

1. Un éditeur de photos de bureau

Si vous êtes un utilisateur régulier de Photoshop, vous n'avez probablement pas besoin de compresser davantage vos images. C'est parce que vous pouvez exporter vos images nouvellement créées dans n'importe quelle résolution que vous souhaitez.

Le même principe vaut pour la plupart des autres éditeurs de photos de bureau. Mais en réalité, si vous n'utilisez pas déjà Photoshop pour créer les images de votre site, vous ne prendrez probablement pas le temps d'apprendre un programme aussi compliqué dans le seul but de compresser des images.

Cependant, les éditeurs de photos de bureau comme Photoshop sont une option autonome pour compresser et optimiser les images.

2. Applications mobiles et éditeurs de photos en ligne

Les applications de retouche photo et les éditeurs de photos en ligne (comme Fotor et Pixlr) sont conçus pour effectuer des retouches photo de base. Beaucoup de ces outils incluent également des options pour optimiser vos images avant de les télécharger sur WordPress.

Cependant, tout comme l'utilisation de Photoshop pour effectuer ce travail, l'utilisation de ces types d'outils semble presque exagérée. Certaines de ces solutions auront un prix et vous n'utiliserez peut-être pas la plupart de leurs autres fonctionnalités.

3. Compresseurs d'images Web

Si vous souhaitez optimiser vos images avant de les télécharger sur WordPress, un logiciel Web dédié est probablement votre meilleure solution.

Recherchez simplement le terme « compresseur d'images en ligne » sur Google et choisissez celui qui porte le nom le plus intéressant. La plupart fonctionnent exactement de la même manière.

Après avoir choisi celui que vous aimez, tout ce que vous avez à faire est de télécharger votre image et de sélectionner le type de compression que vous souhaitez appliquer.

De plus, de nombreux services Web offrent des options d'optimisation en masse qui fonctionnent très bien si vous devez optimiser un grand nombre de fichiers.

Plugins d'optimisation d'image WordPress

Si vous souhaitez un optimiseur d'image WordPress qui fonctionne directement dans votre système de gestion de contenu WordPress, un plugin d'optimisation d'image est la voie à suivre.

Avec un plugin d'optimisation d'image WordPress, il vous suffit de télécharger votre image sur WordPress et le plugin la compressera automatiquement selon les paramètres que vous avez prédéfinis. Vous pouvez également compresser et optimiser chaque image manuellement si vous préférez.

Dans le référentiel de plugins WordPress, vous trouverez des dizaines de plugins pour optimiser les images. Certaines des meilleures options de plugins d'optimisation d'image WordPress sont :

Choisissez celui avec lequel vous travaillez le plus facilement et personnalisez-le en fonction de vos besoins.

Remarque : nous vous recommandons d'utiliser uniquement UN de ces plugins d'optimisation d'image WordPress. Comme nous l'avons mentionné précédemment, il est préférable de ne pas doubler les plugins avec des fonctionnalités similaires.

Quelle est la meilleure résolution d'image ?

En général, une bonne cible pour la résolution d'image basée sur le Web est de 72 PPI. Cependant, il n'existe pas de « résolution d'image parfaite » universellement reconnue pour les sites Web. Fondamentalement, si l'image compressée n'apparaît pas pixelisée ou déformée sur votre site après son téléchargement, la résolution de l'image est parfaitement idéale à utiliser sur votre site.

Contrairement à l'industrie de l'impression, où la résolution d'image requise est de 300 DPI (points par pouce) pour tout ce qui va être imprimé, vous devrez vérifier à quoi ressemble une image téléchargée sur un grand écran d'ordinateur avant de continuer.

Qu'en est-il du rapport taille-poids?

Les couleurs jouent un rôle majeur dans le « poids » d'une image. Une simple photo en noir et blanc de 1000×800 pixels avec très peu d'éléments peut peser environ 100 Ko. Cependant, une photo de la même taille de pixel avec des contrastes élevés et des couleurs vives pèsera parfois plus de huit fois ce montant.

Votre hébergeur peut vous limiter dans le poids maximum et vous limiter dans les tailles de fichiers que vous êtes autorisé à télécharger. Mais le rapport taille-poids dépendra toujours de la structure de l'image.

Cela dit, il n'y a pas de rapport taille-poids optimal pour les images WordPress. Faites simplement de votre mieux pour les maintenir aussi bas que possible sans sacrifier la qualité visuelle.

Quel format d'image est le meilleur pour les sites WordPress ?

La documentation officielle de WordPress sur la taille et la qualité des images vous recommande d'utiliser des fichiers JPEG ou PNG sur les sites WordPress. En tant que tels, ce sont de loin les formats d'image les plus courants publiés sur tous les sites WordPress.

Selon le contenu spécifique que vous publiez, les fichiers JPEG et PNG fonctionneront un peu différemment.

Les fichiers JPEG (ou .jpg) sont parfaits pour tout ce qui est raster (images composées de pixels plutôt que de lignes). Les photographies en particulier sont presque toujours enregistrées sous forme de fichiers JPEG.

Lorsque vous enregistrez une photo au format JPEG, elle est généralement compressée automatiquement d'un certain pourcentage. Les meilleurs éditeurs de photos vous permettent de contrôler exactement la quantité de détails supprimés par le processus de compression.

Il est toujours préférable de sélectionner ici le minimum absolu de compression, puis de compresser l'image plus tard avec l'un des optimiseurs d'image dont nous avons déjà parlé. Cela permet d'éviter la distorsion de l'image.

Les fichiers PNG sont destinés aux dessins au trait et aux photographies. Lorsque vous enregistrez une image au format PNG, elle sera compressée sans perdre aucun détail. Cependant, les fichiers PNG sont généralement beaucoup plus volumineux que les JPEG. Ce format de fichier est mieux utilisé pour les fichiers vectoriels. Ils ne seront pas déformés quelle que soit leur taille.

WordPress prend également en charge les images au format GIF. Cependant, ce n'est pas un format que nous recommandons d'utiliser car il provoque une distorsion maximale, quel que soit le soin avec lequel vous avez converti votre fichier.

Les sites WordPress bénéficient-ils de l'optimisation d'image ?

La réponse facile à cette question est un oui retentissant. Par exemple, votre site comporte-t-il votre logo exclusif en haut de chaque page et est-il publié sur votre site ? Vous pourriez ne pas croire à quel point ce fichier image peut être lourd, ou combien cela seul peut ralentir les performances de votre site. Essayez de l'optimiser et de vérifier la différence qu'il fait dans la vitesse et les performances du site.

Téléchargez-vous de nouvelles images sur votre blog presque tous les jours ? Gérez-vous actuellement une boutique de commerce électronique avec des centaines d'images de produits ? Si c'est le cas, n'oubliez pas d'installer un plugin sur WordPress qui optimisera automatiquement les nouvelles images que vous téléchargez ainsi que les images déjà présentes sur votre site.

La vérité est que la catégorie dans laquelle s'inscrit votre site Web n'a pas vraiment d'importance. Si possible, commencez à penser à optimiser sa vitesse pendant que vous concevez le site. N'attendez pas qu'il soit prêt à être lancé.

Si votre site a déjà été lancé, utilisez l'un des plugins simples référencés ci-dessus pour optimiser en bloc toutes les images de votre site.

Optimisation d'image et référencement

S'il est vrai que l'optimisation de vos images n'est pas la seule réponse pour parfaire les règles du référencement en constante évolution, la vitesse de votre site reste un facteur déterminant majeur. C'est pourquoi l'optimisation des images WordPress est si importante pour votre stratégie de référencement.

La taille de vos images peut avoir un impact négatif sur les résultats de recherche de votre site de plusieurs manières.

Taux de rebond

Nous avons déjà expliqué comment l'utilisation de fichiers image volumineux ralentirait votre site. Mais saviez-vous que les principaux moteurs de recherche comme Google mesurent en fait le temps de chargement moyen de vos pages et classent les sites qui se chargent le plus rapidement dans les résultats de recherche ?

Les moteurs de recherche mesurent également les taux de rebond (lorsqu'un utilisateur atterrit sur votre site Web mais le quitte sans visiter une deuxième page ou une deuxième publication) de chaque site Web qu'il explore. Un facteur déterminant majeur d'un taux de rebond élevé est la vitesse lente du site.

Comme vous pouvez le voir, des taux de rebond élevés feront chuter votre site au bas des résultats des moteurs de recherche. Des taux de rebond inférieurs, cependant, vous feront monter sur la liste.

Des vitesses de site plus rapides correspondent presque toujours à des taux de rebond inférieurs.

Priorisation des pages

À plusieurs reprises, Google a déclaré que la vitesse des pages est un facteur très important pour le classement des sites Web et la hiérarchisation des pages. Les images occupent en moyenne plus de 60% de l'espace de stockage de l'ensemble de votre site Web.

Si vous n'optimisez pas les images, ce nombre pourrait être considérablement plus élevé.

Encore une fois, cela signifie un site plus lent et un facteur de classement inférieur sur Google.

Et ce n'est pas bon pour les affaires.

Optimisation des métadonnées pour les images

Considérez les métadonnées comme des informations donnant plus d'informations sur d'autres informations.

Pour les images, les métadonnées sont les informations textuelles que vous écrivez et enregistrez dans votre fichier image. Ces informations sont visibles par Google et les autres moteurs de recherche.

En tant que développeur WordPress, tout ce que vous devez faire pour optimiser les métadonnées sur une image est de remplir le petit formulaire lorsque vous téléchargez l'image dans votre médiathèque.

Les zones pour lesquelles vous devrez saisir des données sont :

• Texte alternatif
• Titre
• Légende
• Limace

En appliquant le texte le plus convivial pour les moteurs de recherche dans ces champs, vos images seront beaucoup plus susceptibles d'apparaître dans une recherche Google Image.

Un classement plus élevé sur les recherches d'images Google générera plus de trafic vers votre site que vous ne le pensez.

L'optimisation des images WordPress en toute simplicité

Avant d'atterrir sur cet article, vous ne saviez peut-être pas à quel point l'optimisation des images WordPress peut améliorer tous les aspects des performances de votre site WordPress. Lorsque vous optimisez vos images à l'aide des méthodes et des conseils détaillés ci-dessus, votre site pourra fonctionner à un niveau similaire à celui des grands garçons.

Mais lorsque le trafic de votre site commence à augmenter, êtes-vous prêt à faire face aux menaces de sécurité qui peuvent en découler ? Un puissant plugin de sécurité WordPress comme iThemes Security Pro peut étouffer ces menaces dans l'œuf avant qu'elles ne deviennent des problèmes.

Si le pire se produit et que vous devez restaurer votre site après une faille de sécurité (ou autre catastrophe), vous serez heureux d'avoir un plan solide pour les sauvegardes WordPress avec un plugin de sauvegarde WordPress comme BackupBuddy. Croyez-nous, cela vous fera économiser des heures de travail et de frustration.

Maintenant, que l'optimisation de l'image WordPress commence !

Kristen Wright

Kristen écrit des tutoriels pour aider les utilisateurs de WordPress depuis 2011. Vous pouvez généralement la trouver en train de travailler sur de nouveaux articles pour le blog iThemes ou de développer des ressources pour #WPprosper. En dehors du travail, Kristen aime tenir un journal (elle a écrit deux livres !), faire de la randonnée et du camping, cuisiner et vivre des aventures quotidiennes avec sa famille, dans l'espoir de vivre une vie plus présente.