Comment optimiser la taille des images WordPress pour améliorer la vitesse du site et le classement SEO

Avec l'augmentation de la concurrence pour le contenu et la diminution de la durée d'attention des utilisateurs, les éléments visuels tels que les images sont devenus plus importants que jamais. C'est pourquoi il est également important de choisir la bonne taille d'image pour WordPress.

grâce à WordPress La possibilité de modifier les tailles d'image par défaut et même d'ajouter des tailles d'image personnalisées. De plus, une variété de plugins d'optimisation d'images facilite le travail.

Dans cet article, nous verrons comment les débutants peuvent modifier la taille des images WordPress, comment régénérer les vignettes (c'est-à-dire appliquer les paramètres modifiés aux images précédemment téléchargées), des conseils d'optimisation des images, et les avantages et inconvénients des différents formats d'image.

Aperçu de la taille des images sur WordPress

Chaque fois qu'une image est téléchargée dans la médiathèque de WordPress, WordPress génère un certain nombre de tailles différentes pour cette image, telles que 700px x 400px. Cela signifie que l'imageLargeur de 700 pixels, hauteur de 400 pixels.

Grâce à cette fonctionnalité, un site web peut afficher la taille appropriée d'une image en fonction du scénario dans lequel elle sera utilisée.Amélioration de la vitesse de chargementet des effets visuels.

Ces chiffres sont souvent appelés les "tailles". En d'autres termes.Plus la taille de l'image est grande, plus il y a de pixels et plus la taille de stockage du fichier est importante..

La taille de l'image fait également référence à la quantité d'espace de stockage que l'image occupe sur le périphérique, généralement exprimée en octets, par exemple 100 Ko (kilo-octets).

Si le fichier image est trop volumineux, l'utilisateur mettra plus de temps à télécharger l'image, ce qui ralentira le site web. Par conséquent, la taille du fichier doit rester faible, tandis que la taille de l'image doit être appropriée. Nous reviendrons plus loin sur l'optimisation des images.

Comment WordPress gère-t-il les images ?

Lorsqu'un administrateur télécharge une image dans la médiathèque de WordPress, WordPress crée automatiquement des versions de l'image en plusieurs tailles. L'image originale qui est téléchargée est appelée l'image "Images en taille réelle"tandis que WordPress génère automatiquement des versions supplémentaires basées sur des dimensions prédéfinies, telles queMiniature, taille moyennerépondre en chantantgrande taille.

Ces dimensions sont définies dans les paramètres de WordPress et sont automatiquement utilisées en fonction de l'endroit où l'image est affichée sur le site (par exemple, dans les articles, les galeries ou les barres latérales).

Pourquoi WordPress fait-il cela ?WordPress s'assure que vos images sont affichées de manière optimale dans une variété de scénarios, que ce soit dans une page web ou dans un site web.une barre latérale (dans un logiciel)dans le pied de page, dans l'article ou sur la page.

Par exemple, une petite image de 100 pixels peut convenir pour l'aperçu d'un article, tandis que la même image agrandie à la taille d'une bannière conservera un bon effet visuel.

WordPress génère ces images en différentes tailles afin de répondre aux besoins réguliers des différentes zones du site, tout en évitant que les images ne soient trop étirées ou rétrécies au point de provoquer des distorsions.

Taille d'image par défaut de WordPress

Les copies d'images générées par WordPress sont les tailles d'images par défaut de WordPress. Il est possible d'ajuster ces tailles pour des besoins de conception spécifiques. Nous apprendrons à le faire dans cet article de blog :

Vignette (150 x 150 pixels) :Généralement utilisé pour les petits aperçus d'images.
Moyen (300 x 300 pixels)Image de taille moyenne, généralement affichée dans un article ou une page de blog.
Grande taille (1024 x 1024 pixels) :Principalement utilisé pour les images en vedette, les images en pleine largeur ou toute autre situation où une image plus grande est nécessaire.
Taille complète :Il s'agit de la taille originale de l'image téléchargée.

Pour visualiser ces options, téléchargez une photo sur la page du site web et cliquez dessus. Les options de taille de l'image s'affichent dans le panneau de droite.

Tailles d'images recommandées pour WordPress

Les différentes parties du site ont des besoins différents et chaque zone nécessite des tailles d'image différentes. Les recommandations suivantes sont spécifiques :

Type d'image	Taille recommandée	mise en garde
logo	200 x 100 pixels (ou plus, selon la conception)	Veillez à ce que le logo soit au format PNG haute résolution et utilisez des arrière-plans transparents dans la mesure du possible.
Image d'en-tête/bannière	1200 x 600 pixels	Les images doivent être suffisamment grandes pour occuper la largeur de l'écran, mais optimisées pour éviter un chargement trop lent.
Image en vedette (article de blog)	1200 x 628 pixels (pour le partage social) ou 800 x 450 pixels	Optimisé pour le partage sur les plateformes de médias sociaux.
vignette	150 x 150 pixels	Utilisé dans les aperçus de blogs, les pages d'archives et les widgets qui n'ont pas besoin d'être surdimensionnés.
Images de produits (WooCommerce)	Image principale : 800 x 800 pixels Miniature du catalogue : 300 x 300 pixels Vignettes de la galerie : 100 x 100 pixels	Les images de produits doivent rester carrées pour garantir la cohérence.
Image de fond	1920 x 1080 pixels	Les images doivent être suffisamment grandes pour couvrir toute la largeur de l'écran et la taille des fichiers doit être inférieure à 500 Ko pour améliorer la vitesse de chargement.
Images pour les médias sociaux	1200 x 630 pixels	Optimisé pour le partage sur des plateformes telles que Facebook et Twitter.

Optimisation des images sur WordPress

Il n'est pas nécessaire d'utiliser plus que la taille d'image requise.

Des fichiers images trop volumineux peuvent ralentir le chargement des pages, ce qui peut inciter de nombreux visiteurs à quitter le site s'ils sont impatients. Cela peut également avoir un impact négatif sur le classement dans les moteurs de recherche. (La vitesse de chargement est également un des facteurs d'inclusion)

Idéalement, la taille des images WordPress devrait être inférieure à 150 Ko, mais des tailles de fichiers plus importantes peuvent être tolérées pour des images plus grandes.

Voici quelques éléments à prendre en compte pour optimiser la taille des images de WordPress :

Compresser les images de WordPress

La compression consiste à réduire la taille d'un fichier sans compromettre la qualité de l'image.

La compression des images sur un site web WordPress est l'un des moyens efficaces d'augmenter la vitesse de votre site web.

Il existe plusieurs outils en ligne qui peuvent être utilisés pour la compression :

TinyPNG
Squoosh
Imaginez
Optimizilla
Compressor.io

En compressant toutes les images JPEG (photos) et PNG (graphiques), la vitesse et l'efficacité de votre site web peuvent être considérablement améliorées.

Il existe deux principaux types de compression : avec ou sans perte.

perte de compression (dans la technologie numérique): Réduit considérablement la taille du fichier en supprimant certaines données de l'image qui peuvent ne pas être visibles. S'applique aux images web, mais peut entraîner une légère perte de qualité de l'image si elle est trop compressée.
compression sans perteLa compression sans perte : elle permet de conserver la qualité de l'image tout en réduisant la taille du fichier dans une certaine mesure. La compression sans perte est utile si vous souhaitez conserver le plus de détails possible dans l'image.

Le plugin peut grandement aider à la compression des images, nous y reviendrons plus tard.

Réglage de la taille de l'image

Le redimensionnement d'une image consiste à modifier la taille réelle (et non la taille en pixels) de l'image, y compris la largeur et la hauteur.

Les images plus grandes occupent plus d'espace disque et prennent plus de temps à charger, elles doivent donc être optimisées.

De nombreux thèmes proposent déjà une variété de tailles d'images parmi lesquelles vous pouvez choisir. Toutefois, il est toujours préférable de redimensionner les images manuellement avant de les télécharger sur votre site web.

RÉFÉRENCEMENT optimisation

L'optimisation SEO des images dans WordPress est cruciale pour le classement dans les moteurs de recherche et les performances du site web. La compression des images est une étape importante pour améliorer la vitesse de chargement et optimiser le référencement.

Des conseils efficaces pour optimiser les images

✅ Veillez à renommer l'image avant de la télécharger.Ne pas utiliser "IMG1425". N'utilisez pas "IMG1425". Donnez à l'image un nom descriptif tel que "WordPress Image Size : How to Modify and Optimise Images.jpg".

✅ Utiliser le texte alt. Ceci est utile à la fois pour les visiteurs (pour améliorer l'accessibilité) et pour les robots d'indexation (pour aider à comprendre le contenu de l'image et potentiellement améliorer le classement).

✅ Utilisation d'images réactivescar ils permettent de maintenir ou d'améliorer les performances sur mobile, ce qui peut être un facteur de classement dans les moteurs de recherche.

✅ Ajouter des balises de schéma à des types d'images spécifiquesEn outre, créez un sitemap d'images pour aider les moteurs de recherche à mieux indexer les images du site web.

Sélectionnez le format d'image approprié (JPEG, PNG, GIF, etc.).

Outre le redimensionnement, le choix du bon format d'image est également très important. Chaque format d'image a ses avantages et ses inconvénients.

Voici quelques formats courants et leurs avantages et inconvénients :

mise en forme	avantage	inconvénients
JPEG	Haute compression pour des images plus colorées, prise en charge d'un grand nombre de navigateurs et d'appareils	La compression avec perte réduit la qualité, ne prend pas en charge les arrière-plans transparents.
PNG	La compression sans perte préserve la qualité de l'image et prend en charge les arrière-plans transparents pour les graphiques, les logos et les images qui nécessitent de la clarté.	Fichier plus volumineux que le JPEG, ne convient pas aux photos de grande taille, prise en charge limitée dans les anciens navigateurs.
WebP	Compression supérieure, prise en charge de l'arrière-plan transparent, taille de fichier réduite, meilleure que JPEG et PNG	Prise en charge limitée dans les anciens navigateurs (par exemple Internet Explorer, anciennes versions de Safari), nécessite une plus grande puissance de traitement pour le codage/décodage, n'est pas encore universellement disponible sur toutes les plates-formes

Vous pouvez consulter l'articleTutoriel Nanny super détaillé : Apprenez à convertir des images WebP dans WordPress et accélérez votre site web.

Plugin WordPress d'optimisation de la taille des images

Les plugins sont très utiles lorsqu'il s'agit d'optimiser la taille des images de WordPress. Il existe de nombreux plugins faciles à utiliser qui répondent à différents besoins.

Pour la compression et le redimensionnement, vous pouvez utiliser les plugins suivants :

Optimiseur d'images EWWW

EWWW Image Optimizer est un plugin d'optimisation d'image populaire qui compresse automatiquement les images. Ses principales caractéristiques sont les suivantes :

Prise en charge de fichiers de taille illimitée
Prise en charge de la conversion WebP
Un service payant atteint un taux de compression de 80%
Prend en charge les fichiers PNG, JPEG, GIF, WebP et PDF.
note (du travail de l'élève): : 5/5 (1 725 évaluations)

prixPrix : Gratuit ou à partir de $8/mois

Smush

Smush est un excellent plugin pour compresser et redimensionner les images, et avec plus d'un million d'installations, il est devenu un plugin d'image WordPress très populaire. Ses principales caractéristiques sont les suivantes :

Chargement tardif des images
Prise en charge de la conversion WebP
Offre une compression gratuite sans perte
Intégration avec les blocs Gutenberg
note (du travail de l'élève): : 5/5 (6 000 évaluations)

prixPrix de départ $6/mois

Imaginez

Imagify est un autre plugin d'optimisation d'images qui permet de redimensionner et de compresser les images sans en dégrader la qualité. Ses principales caractéristiques sont les suivantes :

Prise en charge de la conversion aux formats AVIF et WebP
Optimisation des images pour les appareils mobiles
optimisation des lots
note (du travail de l'élève): : 4.5/5 (1.406 évaluations)

prixGratuit ou à partir de $4.99/mois

Modifier la taille des images par défaut de WordPress

Comme indiqué précédemment, WordPress propose déjà trois tailles d'image par défaut. Si les paramètres par défaut ne répondent pas à vos besoins, vous pouvez les modifier.

Par exemple, la taille par défaut des vignettes (150×150) est considérée comme trop grande et doit être réduite à une taille plus petite (par exemple 100×100).

Voici les étapes à suivre pour effectuer le changement :

Allez dans l'interface d'administration de WordPress.
Dans le panneau de gauche, cliquez sur Réglages > Médias.

existent Paramètres des médias vous pouvez ajuster les pixels pour chaque taille. Dans cet exemple, j'ai modifié la taille de la vignette.
frappe (sur le clavier) Enregistrer les modifications pour enregistrer les paramètres.

Attention :Les paramètres modifiés ne s'appliquent plus qu'aux fichiers nouvellement téléchargés.

Comment régénérer les vignettes

Ne vous inquiétez pas, il est facile d'appliquer de nouveaux paramètres à des images existantes. Il suffit d'utiliser la fonction Régénérer les vignettes Le plug-in fera l'affaire.

Voici la marche à suivre :

Allez dans l'interface d'administration WordPress de votre site web.
Dans le panneau de gauche, cliquez sur Plugins > Installer des plugins.

rechercher qqch. Régénérer les vignettes Plug-ins.
frappe (sur le clavier) montage.
frappe (sur le clavier) commencer à utiliser.

Une fois la fonction activée, retournez au tableau de bord et cliquez sur le panneau gauche de l'écran d'accueil. Outils > Régénérer les vignettes.

Ici, cliquez sur l'icône Générer à nouveau toutes les vignettes des pièces jointespour mettre à jour toutes les images avec les nouveaux paramètres.

Comment ajouter des tailles d'images personnalisées dans WordPress

WordPress propose trois tailles d'image par défaut, mais si vous avez besoin de plus d'options de taille d'image, vous pouvez modifier le paramètre functions.php pour ajouter des tailles d'image personnalisées.

Voici comment cela fonctionne :

1) Allez dans le backend de l'administrateur WordPress de votre site web.

2) Dans le panneau de gauche, cliquez sur Apparence > Editeur de fichier de thème.

3) Dans la partie droite, trouver functions.php Documentation.

4. en functions.php ajoutez une fonction pour définir la nouvelle taille de l'image à l'aide de la fonction add_image_size().

Exemple :

Code phpCopyadd_image_size('custom-size-name', 800, 600, true) ; // 800px de largeur, 600px de hauteur, recadré

Parmi eux :

Nom de la taille personnalisée - Un nom unique pour la taille de l'image personnalisée.
800, 600 - La largeur et la hauteur de l'image (en pixels).
vrai peut-être faux - Mode de recadrage.vrai Activer le recadrage strict (taille exacte), l'optionfaux Conserver le rapport hauteur/largeur d'origine (recadrage doux).

frappe (sur le clavier) Documents mis à jour pour enregistrer le fichier.
Pour afficher des tailles d'image personnalisées dans le thème, collez le code suivant :

Code phpCopy<?php the_post_thumbnail( 'your-specified-image-size' ); ?>

💡 Veuillez sauvegarder les données de votre site web avant d'effectuer toute modification !

Remplacez "your-specified-image-size" par le nom que vous avez défini à l'étape précédente. Par exemple, vous pouvez le remplacer par nom-de-la-taille-personnalisée.

Questions fréquemment posées

Q) Quelle est la taille des images utilisées dans WordPress ?
Les tailles courantes sont les suivantes

1200×628 px pour les images en vedette
300 x 300 px pour les vignettes
1024×768 px pour les images de contenu

Choisissez les tailles en fonction des exigences du thème et optimisez pour un chargement plus rapide.

Q) Comment redimensionner les images dans WordPress ?
entrer dans Réglages > Médias pour définir la taille par défaut, ou dans le médiathèque Sélectionnez et redimensionnez les images individuellement dans le

Q) Comment augmenter la taille de téléchargement des images dans WordPress ?
Par édition php.ini Documentation, modifications .htaccess ou ajuster les paramètres du panneau d'hébergement pour augmenter la taille du téléchargement.

Q) Comment faire pour que toutes les images de WordPress aient la même taille ?
L'utilisation d'un plugin d'édition d'images (par ex. Régénérer les vignettes) ou en ajustant les feuilles de style CSS personnalisées pour garantir des tailles d'image cohérentes sur l'ensemble du site.

Contactez nous
Vous n'arrivez pas à lire le tutoriel ? Contactez-nous pour une réponse gratuite ! Aide gratuite pour les sites personnels et les sites de petites entreprises !	Service clientèle WeChat
① Tel : 020-2206-9892
② QQ咨询：1025174874
(iii) Courriel : info@361sale.com
④ Horaires de travail : du lundi au vendredi, de 9h30 à 18h30, jours fériés.