mediatheque-wordpress-medias

Comment recadrer et redimensionner une image dans WordPress ? Deux méthodes pas à pas

⏳ Temps de lecture estimé : 9 minutes

Mis à jour le 28/10/2026

Recadrer et redimensionner une image WordPress demande deux opérations distinctes. Ce tutoriel présente deux méthodes avant ou après l’importation.

Quelle différence entre recadrage, ratio et redimensionnement ?

Ces termes désignent des opérations différentes. Les distinguer évite de déformer une photographie ou de produire un fichier trop petit. Avant de modifier une image, repérer ses dimensions initiales et l’espace disponible dans la page.

Le recadrage retire une partie de l’image

Recadrer consiste à conserver une zone de l’image et à exclure le reste. Une photographie horizontale peut ainsi devenir verticale. Le sujet doit rester visible et suffisamment net dans le cadrage retenu.

Le ratio exprime les proportions

Le ratio correspond au rapport entre la largeur et la hauteur. Un carré possède un ratio 1:1. Une image de 350 × 750 pixels possède un ratio de 7:15, soit environ 0,467. Ce format très vertical n’est qu’un exemple, pas une recommandation universelle.

Le redimensionnement change les dimensions

Une image de 1400 × 3000 pixels peut être réduite à 350 × 750 pixels sans déformation, car ses proportions restent identiques. Modifier indépendamment la largeur et la hauteur d’une image dont le ratio diffère risque de l’étirer. Il faut alors recadrer avant de redimensionner.

Sur mobile, chaque ligne apparaît sous forme de carte ; le bandeau rouge indique l’opération.

Comprendre les opérations de modification d’une image
OpérationEffetExemple
RecadrerConserver une zone de l’imageIsoler un portrait dans une photo de groupe
Changer le ratioModifier les proportions du cadrePasser d’un format paysage à un cadre carré
RedimensionnerRéduire ou modifier les dimensions en pixelsPasser de 1400 × 3000 à 350 × 750 pixels
CompresserRéduire les données nécessaires au fichierExporter un JPEG ou enregistrer un webP avec un réglage de qualité adapté
Modifier l’affichageChanger la taille visible dans une pageAfficher une image à 600 pixels de large sans changer son fichier source
Illustration du recadrage d’une partie d’image puis de son adaptation au format vertical

Comment préparer une image avant son importation dans WordPress ?

La première méthode convient lorsque plusieurs images doivent adopter des proportions identiques. Elle consiste à travailler sur une copie locale avant de téléverser le résultat. Les intitulés exacts des commandes dépendent du logiciel de retouche ou du service choisi.

Conserver les originaux et vérifier les droits

Créer un dossier local « sources » pour les fichiers d’origine et un dossier « medias » pour les fichiers finalisés. Ne jamais écraser la photographie initiale. Avant de reprendre une image trouvée sur le web, vérifier sa licence et les droits autorisant son emploi.

Méthode 1 : recadrer avec un outil externe

  1. Ouvrir une copie de l’image dans un éditeur fiable, installé localement ou accessible en ligne.
  2. Déterminer l’espace visé : bannière, vignette, illustration d’article ou portrait.
  3. Choisir les proportions souhaitées. Pour l’exemple, sélectionner un ratio de 7:15.
  4. Positionner le cadre pour conserver le sujet principal.
  5. Valider le recadrage et inspecter le résultat à sa taille réelle.

Un service en ligne peut transférer l’image à un tiers. Pour des photos confidentielles, privilégier un outil local ou une solution dont les conditions de confidentialité ont été vérifiées.

Redimensionner et enregistrer la copie

  1. Lire les dimensions du fichier recadré.
  2. Réduire la largeur à 350 pixels et la hauteur à 750 pixels pour cet exemple, en conservant les proportions.
  3. Examiner la netteté du sujet et des petits détails.
  4. Choisir un format compatible avec le contenu : JPEG, PNG ou WebP selon le besoin.
  5. Exporter une copie optimisée dans « medias », avec un nom de fichier descriptif.

Un réglage de qualité comme 70 % ne donne pas le même résultat dans tous les logiciels. Comparer visuellement plusieurs exportations plutôt que retenir un pourcentage fixe. Pour les caractéristiques détaillées des formats, consulter le guide sur l’exportation web des images dans Photoshop.

Trois étapes de préparation avant l’importation WordPress : source, cadrage et exportation

Comment importer les images dans la médiathèque WordPress ?

La médiathèque regroupe les fichiers envoyés sur le site. Avant l’importation, vérifier le poids, les dimensions et le nom de chaque fichier. WordPress peut générer plusieurs tailles dérivées selon sa configuration, le thème et les extensions installées.

Importer un ou plusieurs fichiers

mediatheque-wordpress-ajouter-un-fichier-media
mediatheque-wordpress-selectionner-des-fichiers
mediatheque-wordpress-ouvrir-un-fichier-media
  1. Ouvrir l’administration WordPress avec un compte autorisé.
  2. Aller dans « Médias », puis choisir l’ajout de fichiers.
  3. Sélectionner les images du dossier « medias » ou les déposer dans la zone prévue.
  4. Attendre la fin de l’importation et vérifier la présence de chaque image.

Pour insérer ensuite une photographie dans une publication, passer par l’éditeur d’article. Le guide créer un article WordPress détaille ce parcours général.

Contrôler les informations du média

Ouvrir la fiche du fichier pour consulter son format, ses dimensions et sa taille. Ajouter un texte alternatif lorsque le rôle de l’image le demande. La légende reste facultative. Les outils disponibles dépendent du rôle utilisateur et de la configuration du site.


Comment recadrer et redimensionner une image dans WordPress ?

Dans la médiathèque, la documentation WordPress distingue l’opération de mise à l’échelle, le recadrage et la rotation. Les noms de commandes peuvent varier selon la version, la langue et les extensions. Documentation officielle des outils de modification des médias

La deuxième méthode intervient après l’importation. WordPress propose des outils de modification directement depuis la médiathèque. L’interface exacte dépend de la version et du contexte d’édition. Il faut distinguer la modification du fichier et les réglages d’affichage du bloc Image.

Méthode 2 : ouvrir l’éditeur d’image de la médiathèque

  1. Ouvrir « Médias » et sélectionner l’image concernée.
  2. Consulter ses dimensions d’origine.
  3. Choisir l’action permettant de modifier l’image, lorsqu’elle est disponible.
  4. Repérer les commandes de recadrage, de rotation et de mise à l’échelle.

Selon l’interface et le traitement effectué, WordPress peut proposer une restauration de l’original. Conserver malgré tout une copie source en dehors du site.

Recadrer selon les proportions souhaitées

mediatheque-wordpress-recadrer-appliquer-recadrage
  1. Choisir la commande « Recadrer ».
  2. Définir un cadre libre ou un rapport largeur/hauteur, selon les options de l’éditeur.
  3. Ajuster la sélection autour du sujet.
  4. Appliquer le recadrage, puis enregistrer si l’interface le demande.

Le rapport 7:15, dérivé de l’exemple 350 × 750 pixels, décrit seulement la forme du cadre. Il ne fixe pas automatiquement les dimensions finales du fichier. Pour une image de meilleure qualité, recadrer une zone source suffisamment grande.

Mettre l’image à l’échelle

mediatheque-wordpress-appliquer-nouvelles-dimensions

Dans l’éditeur classique de la médiathèque, la mise à l’échelle réduit proportionnellement le fichier. La documentation précise qu’elle ne sert pas à agrandir les images. Selon la version et les commandes disponibles, l’ordre des opérations peut varier. Vérifier les dimensions après l’enregistrement.

  1. Lire les dimensions affichées dans l’éditeur.
  2. Choisir la mise à l’échelle lorsque cette fonction est disponible.
  3. Saisir une largeur ou une hauteur cible, puis conserver les proportions.
  4. Valider et vérifier le résultat enregistré.

Modifier le cadrage dans Gutenberg

Dans l’éditeur de blocs, sélectionner un bloc Image. La barre d’outils comporte une commande de recadrage. Les réglages de proportion et de dimensions d’affichage peuvent également être proposés dans la colonne latérale. Les choix « Couvrir » et « Contenir » modifient la manière dont l’image occupe son cadre.

Attention : modifier la largeur affichée ou le ratio du bloc ne signifie pas nécessairement modifier le fichier stocké dans la médiathèque. Pour une image présente dans plusieurs articles, cette distinction mérite un contrôle avant modification.


Comment vérifier la qualité et résoudre les problèmes d’image ?

Le résultat doit rester net à la taille réellement affichée. Une image correctement cadrée peut devenir floue si la zone source manque de pixels. Une taille de fichier élevée peut également ralentir le chargement sans améliorer la qualité perçue.

Éviter l’étirement et la pixellisation

Ne pas imposer simultanément une largeur et une hauteur incompatibles avec les proportions de l’image. Pour changer sa forme, recadrer d’abord. Si le sujet devient flou après réduction, vérifier les paramètres de compression et la netteté du fichier source.

Vérifier les dimensions et le poids

Comparer les dimensions obtenues avec l’espace prévu dans le contenu. Le poids du fichier se mesure en octets, kilooctets ou mégaoctets. Il ne se confond pas avec ses dimensions en pixels. Tester le rendu réel plutôt que se fier uniquement à un seuil de poids.

Sur mobile, chaque ligne devient une carte avec un bandeau rouge indiquant le problème.

Corriger les problèmes fréquents des images WordPress
ProblèmeCause possibleVérification ou correction
Image étiréeLargeur et hauteur incompatibles avec le ratioConserver les proportions ou recadrer
Image floueZone source trop petite ou compression excessiveReprendre une source mieux définie, ajuster l’exportation
Image trop lourdeDimensions ou compression inadaptéesAdapter dimensions et format à l’usage
Cadrage coupéRatio du bloc ou option CouvrirDéplacer le point focal ou choisir Contenir
Mauvaise versionImage dérivée, cache ou ancien média sélectionnéContrôler le fichier affiché et vider le cache si nécessaire

Quelles bonnes pratiques appliquer aux images WordPress ?

Google recommande un texte alternatif utile et descriptif, adapté au contexte de la page. La répétition artificielle de mots-clés ne remplace pas une description pertinente. Recommandations officielles Google sur les images

Une image adaptée au web doit servir le contenu, s’afficher correctement et rester identifiable. Le choix des dimensions dépend de son emplacement et du thème. Il n’existe pas de largeur unique adaptée à toutes les images WordPress.

Nom de fichier, texte alternatif et légende

Avant l’importation, adopter un nom descriptif, par exemple portrait-equipe-atelier.webp. Rédiger un texte alternatif qui décrit l’information portée par l’image dans son contexte. Une photographie décorative peut nécessiter un attribut alt vide. La légende apporte un complément visible lorsqu’il est utile.

Images responsives et dimensions d’affichage

WordPress génère généralement des images de plusieurs tailles et peut produire des attributs HTML comme srcset pour adapter les fichiers envoyés au navigateur. Le résultat dépend du thème, des tailles enregistrées et des extensions. Contrôler la page sur plusieurs largeurs d’écran.

Quand employer une extension ?

Une extension peut aider à compresser des images en lot, régénérer des tailles dérivées ou organiser la médiathèque. Elle n’est pas indispensable pour recadrer une image isolée. Vérifier sa compatibilité, son suivi et son impact avant installation.


FAQ, glossaire et sources.

FAQ : recadrage et dimensions dans WordPress

Pourquoi une image de 350 × 750 pixels peut-elle sembler floue ?

Cette définition peut être insuffisante si l’image occupe une grande place sur un écran très dense en pixels. Une sélection trop petite dans le fichier d’origine peut aussi réduire les détails disponibles. Tester le rendu à la taille affichée.

Faut-il d’abord recadrer ou redimensionner ?

Pour obtenir un ratio précis, choisir d’abord le cadrage puis produire les dimensions finales constitue un parcours simple. Dans l’éditeur classique WordPress, la documentation conseille toutefois la mise à l’échelle avant les autres transformations. Adapter l’ordre aux outils réellement disponibles.

Le recadrage d’un bloc Gutenberg change-t-il le fichier de la médiathèque ?

Pas systématiquement. Les options de proportion, de largeur et de hauteur peuvent modifier uniquement la présentation du bloc. D’autres opérations de l’éditeur de média effectuent une modification de l’image. Vérifier la fonction choisie et le résultat.

Pourquoi les dimensions indiquées dans WordPress diffèrent-elles de celles du fichier importé ?

WordPress peut générer des fichiers dérivés à plusieurs dimensions. Le thème ou l’éditeur peut afficher l’une de ces tailles. Une largeur fixée pour l’affichage peut également être différente des dimensions du fichier réellement transféré.

Comment éviter de déformer une image verticale ?

Conserver le rapport entre largeur et hauteur. Pour passer d’une image horizontale à une composition verticale, sélectionner une zone plus étroite avant de réduire les dimensions. Ne pas remplacer indépendamment les deux valeurs sans vérifier les proportions.

Un fichier WebP est-il obligatoire après redimensionnement ?

Non. WebP convient à de nombreux usages, mais JPEG et PNG restent utiles selon l’image, les contraintes techniques et la transparence souhaitée. Comparer la qualité réelle et le poids obtenu, plutôt que choisir un format uniquement par principe.

Peut-on restaurer une image modifiée dans la médiathèque ?

L’éditeur classique propose des fonctions de restauration dans certains cas. Leur présence dépend du contexte et des versions. Conserver une copie des originaux reste la meilleure précaution, particulièrement pour les images importantes ou déjà publiées.

Comment contrôler que le bon cadrage s’affiche sur mobile ?

Prévisualiser la page sur plusieurs largeurs d’écran. Vérifier le ratio du bloc, l’option Couvrir ou Contenir et la position du sujet. Contrôler également qu’aucun texte présent dans l’image ne devient illisible.


Sources de confiance

  1. WordPress.org : Edit Media, opérations de recadrage, mise à l’échelle et restauration.
  2. WordPress.org : Image block, outils de recadrage et réglages d’affichage dans Gutenberg.
  3. WordPress.org : Media Library screen, informations des médias et outils disponibles.
  4. WordPress en français : Bloc Image, commandes et proportions.
  5. Google Search Central : bonnes pratiques de SEO pour les images, noms de fichiers et attribut alt.

Glossaire des images WordPress

Zone de recadrage

Partie de l’image sélectionnée pour constituer le visuel final.

Rapport largeur/hauteur

Relation numérique entre les deux dimensions d’une image.

Dimensions intrinsèques

Largeur et hauteur réelles du fichier image, exprimées en pixels.

Dimensions d’affichage

Taille à laquelle une image apparaît dans une page, parfois différente de celle du fichier.

Mise à l’échelle

Modification proportionnelle de la largeur et de la hauteur du fichier.

Rééchantillonnage

Calcul de nouveaux pixels lors d’un changement des dimensions d’une image.

Image dérivée

Version générée à partir d’un original pour répondre à un besoin de taille ou d’affichage.

Point focal

Position du sujet à privilégier lorsqu’une image est adaptée à un cadre.

Compression avec perte

Réduction de données pouvant retirer des détails visuels pour alléger le fichier.

Attribut srcset

Attribut HTML présentant plusieurs sources d’image possibles au navigateur selon les conditions d’affichage.

Suivre et partager

Vous aimerez peut-être aussi