Redimensionnement d'images en ligne, gratuit

Comment redimensionner une image

1. Sélectionnez ou déposez un fichier image ci-dessus.
2. Choisissez une taille prédéfinie, ou saisissez une largeur et une hauteur personnalisées en pixels.
3. Activez l'icône de verrouillage pour conserver ou ignorer le rapport hauteur/largeur d'origine.
4. Cliquez sur « Redimensionner l'image » pour traiter l'image dans votre navigateur.
5. Téléchargez l'image redimensionnée instantanément.

Ce que « redimensionner » fait réellement à vos pixels

Redimensionner une image n’est pas la même opération que la recadrer ou la compresser. Recadrer écarte des pixels sur les bords et garde le reste inchangé. Compresser garde chaque pixel mais les encode plus serré. Redimensionner change littéralement le nombre de pixels : une image source 4000x3000 réduite à 1920x1440 doit jeter la plupart de ses pixels et en choisir de nouveaux pour représenter la même scène à un quart de la résolution. L’opération mathématique qui décide quels nouveaux pixels écrire s’appelle le rééchantillonnage, et la qualité du redimensionnement dépend presque entièrement de l’algorithme de rééchantillonnage utilisé.

Les quatre algorithmes de rééchantillonnage couramment utilisés sont le plus-proche-voisin (prendre le seul pixel source le plus proche, les bords nets sont préservés, effet de blocs à l’agrandissement, le seul bon choix pour le pixel art), le bilinéaire (mélange linéaire des 4 pixels sources environnants, rapide et médiocre), le bicubique (noyau cubique de Keys 1981 sur 16 pixels environnants, la valeur par défaut de Photoshop depuis des décennies) et Lanczos (fonction sinc fenêtrée par un noyau Lanczos, sortie la plus nette, léger ringing près des bords durs, ce qu’ImageMagick et Sharp utilisent par défaut pour la réduction). Cet outil règle imageSmoothingQuality de l’API Canvas sur « high », ce que Chrome et Firefox interprètent comme un noyau de classe Lanczos sur ordinateur et Safari comme un noyau de classe bicubique. C’est le navigateur qui choisit ; JavaScript peut demander « high » mais ne peut pas choisir le filtre exact.

La réduction et l’agrandissement ne sont pas des problèmes symétriques. La réduction écarte de l’information de manière contrôlée ; le rééchantillonneur décide quels détails conserver et un bon algorithme préserve la structure visible de la source. L’agrandissement ajoute des pixels qui n’ont jamais été échantillonnés, et la théorie de l’information (le théorème d’échantillonnage de Nyquist-Shannon) dit qu’on ne peut pas récupérer des fréquences qui n’étaient pas dans le signal d’origine. Le mieux que peut faire un rééchantillonneur classique est d’interpoler en douceur entre les échantillons connus, ce qui paraît toujours flou. Pour un véritable agrandissement, l’alternative moderne est la super-résolution par IA (Real-ESRGAN, waifu2x, Adobe Super Resolution, Topaz Gigapixel), qui hallucine des détails plausibles à l’aide de réseaux de neurones entraînés sur des millions d’images similaires. Ce n’est pas ce qu’il se passe ici. Cet outil fait une interpolation honnête.

Comment cet outil fonctionne en coulisses

Le pipeline entier est l’API Canvas 2D du HTML5. Aucune bibliothèque externe n’est chargée. Quand vous déposez une image, l’API File du navigateur passe les octets à un nouvel HTMLImageElement ; le décodeur JPEG, PNG ou WebP intégré au navigateur transforme le flux binaire en tampon de pixels. Le rapport d’aspect est calculé à partir des largeur et hauteur naturelles. Un nouvel élément <canvas> est créé en mémoire aux dimensions cibles que vous avez réglées, et ctx.drawImage(image, 0, 0, largeurCible, hauteurCible) dessine la source mise à l’échelle dans la destination. Comme la destination a des dimensions différentes de la source, le navigateur invoque son noyau de rééchantillonnage pour calculer chaque nouveau pixel.

Avant l’appel à drawImage, l’outil règle ctx.imageSmoothingEnabled = true et ctx.imageSmoothingQuality = « high ». Le premier drapeau active le lissage (plus-proche-voisin désactivé) ; le second indique au navigateur d’utiliser son filtre de plus haute qualité. La spécification canvas du WHATWG laisse le filtre exact à l’implémentation. Chrome et Firefox sur ordinateur utilisent des noyaux de classe Lanczos en « high » ; Safari utilise un noyau de classe bicubique ; les builds mobiles peuvent rétrograder vers le bilinéaire sous pression mémoire. Rien de tout cela n’est visible depuis JavaScript. Après le dessin, canvas.toBlob(mimeType, qualité) sérialise le canvas vers un Blob dans le format de sortie choisi : PNG (DEFLATE sans perte, l’argument qualité est ignoré), JPEG (DCT avec perte à qualité 0,92) ou WebP (avec ou sans perte à qualité 0,92). Le Blob devient une URL d’objet téléchargeable.

Aucun octet ne quitte l’onglet. L’image est décodée dans votre navigateur, rééchantillonnée dans votre navigateur et ré-encodée dans votre navigateur. Le fichier téléchargé est généré localement et enregistré sur votre appareil par le mécanisme de téléchargement normal du navigateur. Le seul trafic réseau est le chargement initial de la page et le petit script image-resizer.js (quelques kilo-octets). Passez votre navigateur en mode avion après le chargement de la page et le redimensionneur continue à fonctionner sur n’importe quelle image locale que vous sélectionnez. Ouvrez l’onglet Réseau des outils de développement pendant un redimensionnement : il y a zéro requête transportant des données d’image. L’architecture entière est volontairement minimaliste parce que l’API Canvas est déjà assez puissante pour ce travail ; ajouter une bibliothèque n’ajouterait que des octets et de la complexité sans changer la sortie.

Bref historique du rééchantillonnage d’image

• Agrandisseurs optiques, l’ère pré-numérique. Avant la photographie numérique, « agrandir » une photo signifiait projeter un négatif à travers un agrandisseur optique sur une feuille de papier sensible à la lumière. L’objectif faisait le rééchantillonnage de façon continue, sans quantification, mais avec les limites optiques de l’objectif lui-même. Les premiers agrandisseurs commerciaux datent des années 1860. Le rééchantillonnage en tant qu’opération mathématique n’est devenu une question pertinente qu’une fois que les images ont existé en grilles de pixels plutôt qu’en émulsion continue.
• Interpolation bicubique, 1973-1981. Robert G. Rifman a publié un algorithme de rééchantillonnage d’image bicubique par splines chez TRW Defense and Space Systems en 1973, écrit pour le redimensionnement d’imagerie satellite. La formulation canonique est venue de R. G. Keys en 1981 : « Cubic Convolution Interpolation for Digital Image Processing » dans IEEE Transactions on Acoustics, Speech, and Signal Processing. Toute bibliothèque d’imagerie qui dit « bicubique » aujourd’hui veut dire le noyau cubique de Keys évalué sur un voisinage 4x4.
• Filtre de Mitchell-Netravali, 1988. Don P. Mitchell et Arun N. Netravali ont publié « Reconstruction Filters in Computer Graphics » au SIGGRAPH ’88, présentant une famille paramétrée de filtres cubiques réglables par deux coefficients B et C. Le filtre canonique « Mitchell » (B=C=1/3) sacrifie un peu de netteté pour un ringing très faible et est devenu un défaut standard pour la réduction dans des bibliothèques d’imagerie haut de gamme comme libvips.
• Filtres sélectionnables d’ImageMagick, années 1990. John Cristy a publié ImageMagick (originellement 1987, public en 1990) avec des filtres de rééchantillonnage sélectionnables comme fonctionnalité de premier ordre. Au milieu des années 1990, photographes et professionnels de la PAO pouvaient comparer Lanczos, Mitchell, Catmull-Rom, Hermite et Gaussien sur la même image source, en choisissant selon l’usage. L’option -filter Lanczos d’ImageMagick reste une recette courante dans les pipelines de production.
• Redimensionnement Canvas HTML5, 2008-2017. La spécification canvas du WHATWG a standardisé drawImage() avec une mise à l’échelle implicite en 2008, et la forme à 9 arguments (celle utilisée ici) est dans tous les navigateurs depuis. L’attribut imageSmoothingQuality (low / medium / high) a été livré plus tard, Chrome 54 en 2016, Firefox 51 en 2017, Safari 11.1 en 2018. Avant cela, le redimensionnement côté navigateur était en pratique uniquement bilinéaire sur toutes les implémentations, même quand l’outil demandait de la « haute qualité ».
• Super-résolution par IA, 2018-2021. ESRGAN (Wang et al., 2018) a démontré que les réseaux adversaires génératifs pouvaient synthétiser des détails crédibles pour les photos agrandies. Real-ESRGAN (Wang et al., 2021) a rendu la technique praticable pour les entrées du monde réel ; waifu2x (nagadomi, 2015) avait plus tôt accordé une variante basée CNN à l’art animé. Adobe Camera Raw a ajouté Super Resolution en 2021. Ces outils ne remplacent pas le rééchantillonnage classique pour la réduction ; ils visent le cas où l’on souhaite spécifiquement des détails hallucinés plutôt qu’une interpolation lisse.

Tailles d'image courantes

• 1920 x 1080 · Full HD, standard pour les arrière-plans web et les miniatures YouTube.
• 1080 x 1080 · Publications Instagram (format carré).
• 1080 x 1350 · Publications Instagram au format portrait (occupent plus de place dans le fil).
• 1280 x 720 · HD, idéal pour les en-têtes de blog et les présentations.
• 800 x 600 · Taille web classique, idéale pour les newsletters par e-mail.
• 400 x 400 · Photos de profil et avatars.
• 16 x 16 / 32 x 32 · Tailles de favicon pour sites web.

Flux de redimensionnement du monde réel

• Dimensionnement pour les réseaux sociaux. Chaque plateforme sociale a des dimensions préférées pour les publications de fil, les stories, les bannières et les vignettes. Téléverser à la mauvaise taille signifie que la plateforme recadre ou ajoute des bandes noires à votre place, souvent mal. Cibles courantes en 2026 : Instagram fil 1080x1080 (carré) ou 1080x1350 (portrait, actuellement le format fixe à plus fort engagement parce qu’il occupe environ 25 % de plus d’écran vertical sur mobile), Instagram Stories et Reels 1080x1920, vignette YouTube 1280x720, carte Twitter/X 1200x675, aperçus de liens Facebook et LinkedIn (Open Graph) 1200x630, épingle Pinterest standard 1000x1500, TikTok 1080x1920. Redimensionner une fois avant le téléversement garantit le résultat voulu ; téléverser des photos brutes laisse le choix à la plateforme.
• Optimisation web et Core Web Vitals. L’audit « Properly size images » de Lighthouse échoue pour toute image dont les dimensions naturelles dépassent largement les dimensions affichées. Une image héros affichée à 1200 pixels de large mais servie à 4000 pixels gaspille de la bande passante et nuit au Largest Contentful Paint, le Core Web Vital le plus visible. La correction consiste à redimensionner la source à environ la taille d’affichage, ou à 2x pour les écrans Retina, et à servir différentes tailles à différents viewports via l’attribut moderne srcset. Redimensionner une seule image héros de 4000 à 1920 pixels coupe généralement la taille du fichier de 60 à 80 % et le score LCP suit directement.
• Pièces jointes d’e-mail. Gmail, Outlook et Apple Mail plafonnent tous les pièces jointes à 25 Mo par message. Un dossier de photos de téléphone à pleine résolution peut atteindre ce plafond avec seulement cinq ou six images. Redimensionner le bord long à 1920 pixels coupe généralement chaque photo à moins de 1 Mo tout en restant parfaitement consultable sur n’importe quel écran d’ordinateur portable ou de téléphone. Vingt photos à 1920 pixels tiennent confortablement dans un seul message ; les mêmes vingt à pleine résolution nécessiteraient trois ou quatre envois ou un lien de partage cloud.
• Photos de profil et avatars. La plupart des plateformes sociales veulent 400x400 à 800x800 pixels pour les photos de profil et les affichent en cercle. Redimensionner localement avant le téléversement vous permet de contrôler le recadrage carré (combiné au Recadreur d’image de cet outil) et le nombre exact de pixels, plutôt que de laisser la plateforme recadrer arbitrairement. La règle empirique pour les écrans Retina est de téléverser au double de la taille d’affichage, donc un avatar de 200 pixels devrait avoir une source d’au moins 400x400.
• Génération de favicons et d’icônes d’application. Les navigateurs modernes veulent 16x16 (onglet) et 32x32 (onglet haute densité), les icônes Apple Touch veulent 180x180, les tuiles Windows veulent 270x270, et les manifestes Progressive Web App incluent généralement 192x192 plus 512x512. Redimensionner une source carrée bien conçue (typiquement 512x512 PNG sans détails fins) vers chacune de ces cibles est le flux canonique pour produire des icônes nettes sur toutes les plateformes.
• Préparation à l’impression. Un tirage photo 4x6 pouces à 300 DPI nécessite 1200x1800 pixels de résolution source. Une affiche 16x20 pouces nécessite 4800x6000. Un tirage 8x10 pouces à 240 DPI (qualité journal) nécessite 1920x2400. Redimensionner la source au bon nombre de pixels pour la taille d’impression prévue signifie que le laboratoire d’impression n’a pas besoin de rééchantillonner automatiquement à votre place, ce qui évite des choix de filtres imprévisibles et des réglages de qualité inconnus. Associez le nombre de pixels redimensionné aux bonnes métadonnées DPI dans votre boîte de dialogue d’impression et le résultat correspond à ce que vous avez vu à l’écran.

Pièges courants et ce qu’ils signifient

• L’agrandissement paraît toujours flou. Une vignette de 200 pixels de large agrandie à 1920 pixels paraîtra douce quel que soit le navigateur ou le réglage de qualité utilisé. L’interpolation classique (bicubique, Lanczos, Mitchell) ne peut que lisser entre les échantillons connus ; elle ne peut pas inventer les détails manquants. Le plafond théorique d’information est fixé par la fréquence de Nyquist de la source. Pour un véritable agrandissement qui produit une sortie nette, passez la source dans un outil de super-résolution (Real-ESRGAN, Topaz Gigapixel AI, Adobe Super Resolution dans Camera Raw) qui hallucine des détails plausibles à l’aide d’un réseau de neurones entraîné sur des millions d’images similaires.
• Déverrouiller le rapport d’aspect étire la photo. Avec l’icône de verrouillage désactivée et des largeur et hauteur incohérentes, la sortie est mathématiquement comprimée ou étirée. L’outil est verrouillé par défaut ; déverrouiller est une action délibérée. Si vous devez vous adapter à un rapport d’aspect cible plutôt qu’au rapport naturel de la source, le bon flux est de recadrer d’abord (utilisez le Recadreur d’image) puis de redimensionner le résultat recadré. Cela garde les proportions correctes et le sujet non déformé.
• Le pixel art est gommé par le lissage. Le lissage activé par défaut de cet outil détruit les sprites 8 bits, les icônes pixel et tout graphique où les bords durs entre cellules colorées sont l’essentiel. Le rééchantillonnage avec n’importe quel filtre lissant (bilinéaire, bicubique, Lanczos) transforme ces bords en gradients. Pour le pixel art, la bonne réponse est le redimensionnement plus-proche-voisin, qui préserve chaque bord net. Côté navigateur, réglez image-rendering: pixelated en CSS sur l’image affichée. Pour un véritable export à une nouvelle taille, utilisez un outil de bureau : -filter Point d’ImageMagick, l’interpolation « Aucune » de GIMP, ou des éditeurs spécialisés comme Aseprite.
• Redimensionner plusieurs fois dégrade JPEG et WebP. Chaque aller-retour par le canvas ré-encode JPEG ou WebP à qualité 0,92. La première passe est visuellement imperceptible ; la troisième ou quatrième introduit des artefacts visibles dans les zones plates et adoucit les détails fins. Redimensionnez toujours depuis la version maître de plus haute résolution dont vous disposez, pas depuis une copie exportée la veille. Si vous devez itérer (essayer 1920, puis 1600, puis 1280), repartez de la source originale à chaque fois plutôt que d’enchaîner les redimensionnements.
• Le DPI d’impression n’est pas la même chose que les dimensions en pixels. Beaucoup de gens s’attendent à ce qu’un champ « DPI » ou « résolution » contrôle la taille d’impression. Cet outil redimensionne uniquement par nombre de pixels. La balise DPI dans un JPEG ou un PNG est une métadonnée indicative pour les imprimantes qui indique combien de pixels-par-pouce restituer sur papier. Dimensions en pixels et DPI sont indépendants : une image 1920x1080 fait 1920x1080 pixels à n’importe quel réglage de DPI. Pour contrôler la taille d’impression, vous devez aussi régler le bon DPI dans une boîte de dialogue d’impression ou dans un outil photo de bureau (le panneau d’impression d’Aperçu, la boîte Taille de l’image de Photoshop avec « Rééchantillonnage » désactivé).
• De très grandes images peuvent faire planter un onglet de navigateur mobile. Décoder une image vers un canvas demande de la RAM proportionnelle à ses dimensions : une photo de 24 mégapixels (6000x4000 pixels) demande environ 96 Mo rien que pour le tampon de pixels RGBA source, plus un tampon distinct pour le canvas cible, plus l’espace de travail de l’encodeur JPEG ou WebP. Les appareils mobiles avec 1 à 2 Go de RAM disponibles pour le navigateur peuvent voir l’onglet terminé par l’OS avant la fin de l’encodage. Pour de très grandes photos, redimensionnez sur un navigateur de bureau, ou réduisez en étapes (50 % d’abord, puis 50 % à nouveau) pour que chaque étape tienne dans la mémoire disponible.

Confidentialité : les images ne quittent jamais votre appareil

Chaque redimensionneur d’image basé sur le cloud (iLoveIMG, ResizeImage.net, ResizePixel, BeFunky, Fotor, le point de redimensionnement de Pixlr, les dizaines de services « redimensionner image en ligne ») téléverse votre fichier sur les serveurs de l’opérateur, exécute son algorithme de redimensionnement et renvoie l’image plus petite en téléchargement. Les implications pour la confidentialité ne sont pas triviales parce que les photos contiennent régulièrement du contenu identifiable : visages, adresses visibles en arrière-plan, captures d’écran d’interfaces internes ou de documents confidentiels, photos d’enfants, photos prises dans des espaces privés, scans de documents contenant des informations personnelles. La plupart des opérateurs publient des politiques de confidentialité s’engageant à supprimer les téléversements dans une heure ou deux et à chiffrer en transit, et les plus gros détiennent la certification ISO/IEC 27001. Ils ont de fortes raisons commerciales d’honorer ces politiques. Mais « supprimé dans l’heure » n’est pas « jamais vu ». Pendant cette heure, le contenu de l’image se trouve dans l’infrastructure de l’opérateur, accessible à tout processus ou personne disposant des accès appropriés, et visible dans les journaux et sauvegardes selon la politique de rétention applicable.

Ce redimensionneur ne téléverse jamais rien. Tout le pipeline (sélection du fichier, décodage de l’image, redimensionnement canvas, encodage, téléchargement) s’exécute dans votre onglet de navigateur à l’aide de JavaScript et de l’API Canvas HTML5. Aucun téléversement, aucune requête réseau transportant des données d’image, aucune entrée de journal. Vous pouvez vérifier en ouvrant les outils de développement du navigateur sur l’onglet Réseau avant de redimensionner : aucune requête ne part avec du contenu d’image. Le seul trafic réseau est le chargement initial de la page et un petit script image-resizer.js. Passez le navigateur en mode avion après le chargement de la page et le redimensionneur continue à fonctionner sur n’importe quel fichier local que vous sélectionnez, la preuve empirique la plus forte que rien n’est téléversé. Pour les photos contenant quoi que ce soit de sensible (visages, lieux, captures d’écran internes, documents d’identité), le compromis côté navigateur vaut évidemment la peine d’être fait.

Quand un autre outil est le bon choix

• Automatisation par lot sur des centaines de fichiers. Utilisez sharp dans Node.js (la bibliothèque côté serveur de référence pour les images, bâtie sur libvips), ImageMagick ou GraphicsMagick en ligne de commande, ou Pillow en Python. Ces outils gèrent des milliers de fichiers sans les limites mémoire du navigateur, exposent chaque noyau de rééchantillonnage comme option explicite, et tournent depuis des tâches CI, des hooks de déploiement ou des tâches cron.
• Super-résolution par IA pour un véritable agrandissement. Pour un agrandissement net qui ajoute réellement du détail, utilisez un agrandisseur par réseau de neurones. Real-ESRGAN (open source, tourne localement via ChaiNNer ou la ligne de commande), waifu2x (open source, démos web gratuites disponibles), Topaz Gigapixel AI (commercial, bureau) ou Adobe Super Resolution dans Camera Raw ou Lightroom. Ces modèles hallucinent des détails plausibles plutôt que de les récupérer ; les résultats paraissent nets sur les visages et les textures naturelles parce que le modèle a vu beaucoup d’images similaires pendant l’entraînement.
• Redimensionnement de pixel art qui préserve les bords durs. Utilisez un outil qui expose explicitement le rééchantillonnage plus-proche-voisin : -filter Point d’ImageMagick, l’interpolation réglée sur « Aucune » dans GIMP, ou des éditeurs spécialisés en pixel art comme Aseprite. Cet outil lisse toujours parce que le drapeau imageSmoothingEnabled de l’API Canvas est activé ; le désactiver dégraderait tous les autres usages, donc le compromis est en faveur des photos plutôt que des sprites.
• Flux qualité-impression avec contrôle du DPI. Adobe Photoshop, Affinity Photo ou Lightroom exposent dimensions en pixels et DPI comme réglages indépendants, prennent en charge les flux à gestion des couleurs (préservation de profil ICC, simulation d’épreuves, sortie CMJN), et conservent un historique non destructif des redimensionnements. Un redimensionnement Canvas côté navigateur ne peut garantir aucun de ces points parce que Canvas opère en sRGB et peut écarter les profils colorimétriques intégrés lors du ré-encodage.

Questions fréquentes

Le redimensionnement réduit-il la qualité de l'image ?

La réduction préserve bien la qualité. L'agrandissement (rendre une image plus grande que son original) entraîne un certain flou, car de nouveaux pixels doivent être interpolés. Pour de meilleurs résultats, partez de l'image source la plus haute résolution dont vous disposez.

À quoi sert le « verrouillage du rapport hauteur/largeur » ?

Lorsqu'il est verrouillé, modifier la largeur ajuste automatiquement la hauteur (et inversement) pour conserver les proportions d'origine de l'image. Déverrouillez-le si vous devez étirer ou compresser l'image à des dimensions précises.

Mon image est-elle envoyée à un serveur ?

Non. L'intégralité du redimensionnement se fait localement dans votre navigateur, via l'API Canvas HTML5. Votre image ne quitte jamais votre appareil.

Puis-je changer le format de sortie ?

Oui. Vous pouvez exporter l'image redimensionnée en JPEG, PNG ou WebP, quel que soit le format d'origine. C'est pratique pour convertir le format tout en redimensionnant.

Autres questions fréquentes

Quelle est la différence entre DPI, PPI et dimensions en pixels ?

Les dimensions en pixels (largeur par hauteur en pixels) décrivent ce que l’image contient réellement. Le PPI (pixels par pouce) décrit la densité avec laquelle ces pixels sont affichés sur un écran, une propriété du matériel d’affichage, pas du fichier. Le DPI (dots per inch) décrit combien de points de sortie d’imprimante seront déposés par pouce de papier quand l’image est imprimée. La balise DPI intégrée dans un JPEG ou un PNG est une métadonnée indicative pour les imprimantes ; elle ne change pas les données de pixel. Une image 1920x1080 fait 1920x1080 pixels à n’importe quel réglage de DPI. Pour réduire une impression, soit réduisez le nombre de pixels (cet outil), soit augmentez la métadonnée DPI avant l’envoi à l’impression (la boîte de dialogue d’impression d’un outil de bureau ou la boîte Taille de l’image de Photoshop avec « Rééchantillonnage » désactivé).

Pourquoi mon image agrandie paraît-elle floue ?

Parce que la théorie de l’information dit qu’elle doit l’être. Le rééchantillonnage classique (bicubique, Lanczos, Mitchell) ne peut qu’interpoler en douceur entre les pixels sources connus ; il ne peut pas inventer les détails qui n’ont jamais été échantillonnés. Le théorème d’échantillonnage de Nyquist-Shannon fixe un plafond dur : les fréquences au-dessus de la moitié du pas de la grille de pixels de la source sont mathématiquement irrécupérables. Agrandir une source de 200 pixels à 1920 pixels paraîtra toujours flou parce que 90 % des nouveaux pixels sont interpolés. Pour un agrandissement net, utilisez un modèle de super-résolution (Real-ESRGAN, Topaz Gigapixel, Adobe Super Resolution) qui synthétise des détails plausibles via un réseau de neurones entraîné sur des millions d’images similaires.

Faut-il redimensionner pour les écrans Retina ou HiDPI ?

Oui. Les écrans Retina d’iPhone et de MacBook et les écrans HiDPI de Windows rendent à 2x ou 3x la densité de pixels CSS logiques. Une image héros qui s’affiche à 1200 pixels logiques de large sur un écran Retina dessine en réalité 2400 pixels physiques. Servez la source 2x via l’attribut srcset HTML (la norme moderne d’images responsives) et le navigateur choisit la bonne pour l’appareil de chaque visiteur. Pour un avatar unique ou une image héros sans srcset, redimensionnez simplement à 2x la taille d’affichage : l’image sera nette sur Retina et seulement légèrement surdimensionnée sur non-Retina, ce qui coûte un peu de bande passante mais évite le flou bien plus visible d’une image sous-dimensionnée étirée sur des pixels à haute densité.

Cet outil fonctionne-t-il hors ligne ?

Oui. L’API Canvas HTML5 fait partie du navigateur lui-même, ce n’est pas une bibliothèque téléchargée, donc il n’y a pas de runtime séparé à mettre en cache. La page se charge normalement ; une fois ouverte, le redimensionneur tourne entièrement à partir du code intégré au navigateur sur n’importe quel fichier local que vous sélectionnez. Vous pouvez vérifier en passant en mode avion après avoir ouvert la page et en redimensionnant une image locale. Le résultat téléchargé est généré localement et enregistré par le mécanisme de téléchargement normal du navigateur, sans non plus la moindre implication réseau.

Faut-il recadrer avant le redimensionnement, ou après ?

Recadrer d’abord, puis redimensionner. Le recadrage règle le rapport d’aspect (16:9 pour YouTube, 1:1 pour le fil Instagram, 9:16 pour les Stories, 1,91:1 pour Open Graph) en écartant des pixels de bord indésirables. Le redimensionnement règle ensuite le nombre de pixels pour le rapport d’aspect choisi. Faire les étapes dans l’autre sens est aussi possible mais gâche du travail, vous rééchantillonneriez plus de pixels que nécessaire pour ensuite en jeter pendant le recadrage. Pour cet outil, utilisez d’abord le Recadreur d’image pour régler le rapport d’aspect, puis ce Redimensionneur d’image pour régler les dimensions cibles exactes. Beaucoup de flux spécifiques aux plateformes (vignette YouTube 1280x720, fil Instagram 1080x1080) combinent les deux étapes ; les faire en séquence avec deux outils dédiés donne une sortie plus propre que d’essayer de tout faire d’un coup avec des rapports d’aspect étirés.

Existe-t-il un équivalent de bureau ou en ligne de commande ?

Plusieurs. Pour l’automatisation par lot, sharp dans Node.js est la bibliothèque côté serveur de référence (bâtie sur libvips). ImageMagick (magick input.jpg -resize 1920x1080 output.jpg) et GraphicsMagick tournent depuis n’importe quel shell et gèrent d’énormes fichiers. Pillow en Python (Image.open(p).resize((1920, 1080), Image.LANCZOS)) est le défaut pour les flux de science des données. Pour un travail interactif ponctuel comme cet outil mais avec un contrôle explicite par noyau et plus de formats de sortie y compris AVIF, Squoosh (Google Chrome Labs, entièrement côté client) est l’alternative navigateur recommandée. Photoshop, Affinity Photo et Aperçu sur macOS (Outils, Ajuster la taille) couvrent le cas du logiciel de bureau.

Outils associés