Redimensionner vos images!

Il existe deux façons de penser la gestion de vos images dans votre système Web :

#1 Redimensionner vos images au moment de l’upload.

Vous partez d’une image avec un format de 3000/2000 pixels et vous créer automatiquement une miniature de 150/95 et une autre de 300/200.

Un exemple avec le site www.christophgrohe.com réalisé pour Concept-Web en 2006.

Je ne vois pas vraiment d’avantage à utiliser cette solution aujourd’hui. La seule chose intéressante serait de redimensionner l’image du côté client et non côté serveur, des scripts comme www.xter.fr propose des solutions à l’aide de Flash. Je n’ai jamais testé ce genre de solution car il m’est toujours paru plus adéquat de redimensionner les images à l’affichage.

#2 Redimensionner des images à la volée

Avec cette deuxième solution, vous uplodez directement votre image source de 3000/2000 pixels. Ensuite vous gérez l’affiche des images à l’aide du PHP.

Personnellement j’utilise fréquemment la librairie phpThumb qui le fait de manière idéale. Vous obtenez des images au format que vous souhaitez, avec la possibilité de « couper » votre image ou de forcer le rapport largeur/hauteur.

Un exemple avec le site www.mcarre.ch sur lequel j’ai combiné phpThumb avec le fameux Lightbox de Prototype pour obtenir des images miniatures + des images en 800/400 pixels.

Cette solution est idéale, car elle vous permettra de faire évoluer votre site sans avoir à réimporter vos images au bon format lors de chaque refonte.

Notons aussi l’optimisation de la taille de l’image qui est envoyée au navigateur web, et donc la bande passante, en fournissant des rendus plus lisses que ceux issus du redimensionnement effectué par les navigateurs standards.

phpThumb

Cette bibliothèque logicielle pour PHP, publiée sous licence publique générale GNU, fonctionne avec la library GD et ImageMagick (si disponible). La mise en place est extrêmement rapide:

<img src="/phpThumb/phpThumb.php?src=/pictures/toto.jpg&w=400&h=300" alt="Toto" />

La liste des paramètres disponibles se trouve ici, mais voici quelques points intéressants:

• formats pris en charges: JPG, GIF, PNG, …
• possibilité de mettre les images en cache
• couper ou déformer les images
• appliquer un masque
• rotation sur les images
• watermark
• …

http://phpthumb.sourceforge.net