Photoshop est un logiciel édité par Adobe destiné à la retouche, au traitement et à la création graphique. Standard en matière de gestion d’images matricielles, Photoshop est principalement utilisé pour la retouche photo. L’utilisation qui en est faite notamment pour l’amélioration de clichés à destination des magazines, l’a rendu très populaire.
Mais Photoshop offre de nombreux autres atouts : il est désigné comme étant l’outil idéal d’optimisation des images pour le Web.
Découvrez cinq fonctions essentielles :
La fonction Enregistrer pour le Web
Cet item, disponible depuis le menu Fichier de Photoshop, propose en une seule boîte de dialogue de configurer de nombreux paramètres au moment de l’enregistrement de votre image : le format de compression, la qualité, le poids, la couleur, etc.
Cette commande est essentielle pour optimiser les images et faciliter leur rendu.
Cas concret : un site Web performant doit s’afficher rapidement. Or les grandes images, comme les images de fond, exigent souvent un certain temps de téléchargement. Après avoir traité votre image de fond, utilisez la fonction Enregistrer pour le Web, vous pourrez alors optimiser son poids pour éviter d’alourdir et donc de ralentir votre site.
L’outil Tranches
Cette option permet en quelques clics de découper chacune des images de la maquette d’un site Web, puis de les exporter rapidement, afin de pouvoir les réutiliser ensuite dans les feuilles de styles CSS.
Cet outil, très simple d’utilisation, est idéal pour découper un design Web.
Cas concret : vous avez réalisé la maquette de votre page d’accueil qui se compose d’une bannière, d’un logo, et de nombreuses petites icônes. Avec l’outil Tranches, sélectionnez chacun des ces éléments puis exportez-les : vous avez ainsi créé plusieurs images à partir d’un seul fichier PSD. Ces images, que vous aurez renommées au moment de l’export, pourront être directement intégrées dans votre CSS.
La fonction Traitement par lots
Accessible depuis le menu Fichier > Automatisation, la fonction Traitement par lots fait appel à un script pour traiter en une seule fois les fichiers d’un dossier. Une douzaine de scripts pré-réglés sont disponibles par défaut dans la boîte de dialogue (vignettes, ombre portée, sépia…), mais il est bien entendu possible de créer de nouveaux scripts.
Cas concret : vous disposez d’une série d’images en couleurs qui doivent toutes figurer dans votre galerie, mais… en noir et blanc ! Il suffit simplement de sélectionner le dossier source dans lequel lesdites images se trouvent, de sélectionner le script RVB-personnaliser en niveaux de gris, d’enregistrer ! Et tadam ! Toutes vos images sont instantanément sauvegardées en noir et blanc au format de votre choix.
La fonction Processeur d’images
Cette boîte de dialogue, accessible depuis le menu Fichier > Scripts permet de redimensionner à la même taille de nombreuses images d’un même dossier, en une seule fois. En outre, elle propose l’application simultanée de scripts.
Cas concret : vous disposez d’une séries d’images de différentes tailles devant figurer dans une même galerie. Afin de rendre l’ensemble cohérent, ergonomique et esthétique, il est impératif que toutes les images soient au même format. Un petit tour par la boîte de dialogue Processeur d’images, indiquez le nouveau format, et toutes vos images sont automatiquement converties à la taille souhaitée.
La fonction Composition de calques
Cette fonction disponible dans le menu Fenêtre permet de gérer plusieurs versions d’une mise en page dans un seul fichier. Idéale pour passer d’un état à un autre de votre composition.
Cas concret : vous devez présenter à votre client la maquette de son site, en commençant par la page d’accueil. Plutôt que de cocher tous les calques (ou le groupe) figurant la page d’accueil plus le calque pour l’image de fond, plus celui du menu, plus celui du pied de page, etc. vous aurez créé une composition pour la page d’accueil et une une autre pour chacune des pages suivantes, et chaque page pourra ainsi être visualisée dans son intégralité en un seul clic !
La maîtrise de ces fonctionnalités essentielles est un basique. Photoshop pour le Web, c’est aussi des plugins pour l’intégration et le webdesign, la possibilité de créer des gifs animés, etc.
Pour en savoir plus, documentez-vous (Adobe propose un support technique complet, par exemple), testez (le Web regorge de tutoriels) et surtout formez-vous en mettant en pratique ! Le CEFii propose une formation Photoshop dédié au Web !