Ce mois-ci, une petite astuce qui devrait vous rendre service si vous avez du mal à mettre vos photos en ligne...
Il existe diverses solutions pour rendre vos photos accessibles sur la toile. Certains sites hébergent gratuitement vos photos, d'autres vous proposent des album et des blogs dans lesquels vous pouvez les mettre et les utiliser ainsi ailleurs...
Il est néanmoins plus pratique de disposer de son propre espace web pour héberger vos fichiers (photos ou autre) mais ceci fera l'objet d'un autre article 
Aujourd'hui, ce qui nous intéresse, c'est d'adapter la taille (en pixels) et le poids (en octets) des photos qui se trouvent sur votre ordi pour qu'elles puissent être utilisées de façon optimales une fois en ligne.
Vous aurez surement remarqué que les photos qui sortent de votre appareil photo numérique ou que vous avez scannées sont très grandes et très lourdes.
Vous vous demanderez peut être pourquoi suivant le logiciel avec lequel vous les visionnez et suivant le site sur lequel vous les hébergez, elles n'ont pas la même taille visuellement. La réponse est simple : certains logiciels adaptent la taille de votre image à celle de votre écran. Idem pour certains sites qui redimensionnent tout simplement votre image à leur guise. Mais ce n'est pas toujours le cas et certains sites vous refuseront votre image parce qu'elle est trop grande et trop lourde.
Pour être sûrs que votre image passe partout, il est donc conseillé de la réduire avec un logiciel de retouche d'image.
je ne les passerait pas tous en revue, il en existe des tas. Je vais vous parler aujourd'hui de l'un d'entre eux : photoshop...
Photoshop est un logiciel payant, mais vous pouvez vous le procurer gratuitement sur le sites officiel dans sa version d'évaluation utilisable 30 jours.
Redimensionner mon image :
Une fois que vous avez ouvert votre image, allez dans le menu Image et sélectionnez "taille de l'image". Vous verrez apparaître cette fenêtre :
Vous effectuez votre changement de taille en modifiant la valeur des deux premières cases : largeur et hauteur. A droite de ces cases, sélectionnez dans les menus déroulants la valeur en pixels.
Ensuite, vérifiez bien que la case "conserver les proportions" est cochée en bas de la fenêtre.
quel valeur attribuer en pixel pour utiliser une image sur le web?
Le but de la manoeuvre est de donner à cette image une taille inférieure à celle de l'écran pour qu'elle puisse être vue dans son entier d'un seul coup d'oeil.
Sachez que la plupart des gens utilisent aujourd'hui une résolution (taille d'affichage de l' écran en pixels) de 1024*768 pixels. Bon nombre de personnes cependant utilisent encore une résolution de 800*600 pixels. Nous donnerons donc à notre photo une taille inférieure à 800*600 pixels.
En général, personnellement, j'attribue à mes photos une largeur de 450 ou 500 pixels, la hauteur se réglant automatiquement si vous avez coché "conserver les proportions de l'image"; ceci étant valable pour des images au format "paysage" (c'est à dire qui forment un rectangle plus large que haut).
Pour les images au format "portrait" (plus hautes que larges) j'attribue une hauteur de 450 à 500 pixels en laissant le logiciel calculer lui même la largeur.
Cette taille d'image me conviens car elle est assez "passe partout". C'est un avantage pour les forums par exemple, pour ne pas que la photo déforme toute la page.
Une fois entrées vos valeurs en pixel, cliquez simplement sur "ok" et votre image est maintenant redimensionnée...
Attention : l'image affichée dans photoshop peut vous paraître extrêmement petite. Regardez dans le panneau intitulé "navigateur" en haut à droite de votre logiciel dans lequel apparaît une prévisualisation miniature de votre image, et vérifiez qu'il est réglé sur 100% . En général, si votre image de départ était grande, il l'aura affichée à moins de 100% pour qu'elle apparraissent en entier...
Pour la remettre en 100%, faites glisser le petit curseur ou tapez directement la valeur "100" dans la petite case où s'affiche le pourcentage.
Si vous ne voyez pas la fenêtre "navigateur", vous pouvez l'appeler par le menu Fenêtre/navigateur.
[img]http://emakko.free.fr/mm/navigateur.jpg[img]
optimiser pour le web
Votre image est maintenant moins grande. De ce fait elle est aussi moins "lourde" mais peut être pas encore suffisament, et surtout, elle n'est peut être pas au bon format!
Allez dans le menu "fichier/enregistrer pour le web"
Une nouvelle fenêtre s'ouvre alors :
Dans cette fenêtre, vous pouvez voir votre photo telle qu'elle sera après enregistrement. Vous pouvez aussi voir votre photo avant optimisation en cliquant sur l'onglet "originale" en haut à gauche ou bien sur "2 vignettes" pour voir en même temps le résutat avant et après optimisation...
Vous remarquerez en bas à droite l'onglet "taille de l'image". Celui-ci vous permet de redimensionner votre image exactement comme nous l'avons fait précédement.
quel format d'image choisir?
Plusieurs formats d'images sont supportés sur le web. VOus pouvez les voir dans le second menu déroulant.
Deux d'entre eux sont à retenir particulièrmeent : jpeg et gif.
quelle différence entre les deux?
Le jpeg compresse votre image en formant des "groupes" de pixels sous forme de carrés. Il modifie l'information couleur de ces pixels et donc les modifie physiquement en les altérant un peu. Cependant cette altération est quasiement invisible si vous gardez une qualité de compression haute. Il est impossible de "decompresser" ensuite votre photo jpeg une fois qu'elle a été compressée, pour lui rendre son aspect d'origine. Veillez donc à toujours garder vos photos originales si vous souhaitez vous en reservir pour les imprimer par exemple...
le gif : Ce format fabrique à partir de votre image une palette de couleurs regroupant les teintes les plus utilisées dans votre image. Il ne garde au maximum que 256 couleurs sur votre photo. Ce format n'est donc pas très intéressant quand on compresse des photos car cela les altère considérablement, surtout si elles sont grandes. Le format gif est plus intéressant pour des dessins qui comportent moins de couleurs. Le plus grand intérêt du gif est qu'il gère la transparence, ce que ne fait pas le jpg. C'est ainsi que vous pouvez avoir des photos "détourées" qui ne sont donc pas rectangulaires... Le format gif permet aussi de gérer de l'animation (photoshop est associé au logiciel image ready qui permet de faire des animations gif)
Si vous utilisez le format gif parce que votre image comporte de la transparence, vous remarquerez la case "détourage" qui permet d'attribuer une couleur associée aux pixels qui ne sont pas entièrement transparents (en général ceux qui sont entre la forme colorée et le tour transparent). En effet, le gif produit soit des pixels totalement transparents soit des pixels totalement colorés, soit des pixels à moitié transparents associés à une seule et unique couleur : celle que vous choisissez dans la case "détourage". Vous choisirez alors une couleur proche de celle du site sur lequel vous allez afficher votre photo...
Vous sélectionnerez donc de préférence si le format jpeg pour votre photo. Amusez vous à déplacer la jauge de qualité(à droite) pour voir les changements opérés sur votre image. Plus le niveau de compression est haut, plus votre image est "lourde".
Vous pouvez voir le "poids" de votre image indiqué tout en bas de la fenêtre, sous l'aperçu de votre photo.
En général, je sélectionne une qualité entre 60 et 70%
Vous pouvez aussi vous servir du menu déroulant en dessous du format d'image, qui définit la qualité en tranches : bas, moyen, haut, supérieur, maximum. La jauge permet d'être plus précis dans son choix.
La case détourage est inutile si vous avez choisi le format jpeg.
A quelle taille se limiter pour le web?
Tout dépend bien sûr de la limitation de l'hébergeur qui va accueillir votre image. Si vous êtes vraiment limités (comme pour les albums msn par exemple), essayez de rester en dessous des 100ko
Si vous n'êtes pas limités, vous pouvez aller au-dessus de 100ko mais pas plus de 150ko si possible.
En bougeant la jauge de qualité, vous voyez automatiquement s'inscrire le poids final de votre photo dans la fenêtre d'aperçu.
Enregistrement :
Une fois réglé le niveau de compression de votre image,cliquez sur "enregistrer" et attribuer un nom à votre image. Sachez que pour que votre photo soit accessible partout sur le web, il vaut mieux respecter un certains nombre de critères dans son nom : n'utilisez pas de caractères spéciaux (accents, signes, ponctuation) ni d'espaces. Ici, quand vous enregistrez pour le web, le logiciel vous convertira de lui même les espaces en - et vous préviendra si vous utilisez un caractère qui risque de poser problème sur le net. Réduisez également au maximum la longueur du nom de votre image. Sur certains site, les fichiers ne passeront pas au-delà de 16 ou 32 caractères. Dans le doutes, faites le plus court possible.
autre astuce :
vous comptez envoyer plusieurs photos pour un album en ligne. Souvent les albums en ligne affichent les photos par ordre alphabétique. Pour être sûr que l'ordre de vos photos sera respecté, précédez leur nom d'un chifffre. Si vous avez plus de 10 photos, nommez les 01- 02- 03- etc... car si vous les nommez 1- 2- 3- , la 10 apparaitra en premier, car le 10 n' équivaut pas pour l'ordinateur à "dix" mais à "un-zéro" et s'affichera donc avant la photo nommée "un" alors que si la première photo est nommée "zéro-un" elle passera avant la photo nommée "un-zéro" si vous avez plus de 100 photos, vous les nommerez alors 001- 002- 003- etc... pour les mêmes raisons
Dites moi si vous avez compris ce tutoriel ou pas, j'attends vos critiques pour savoir comment rendre compréhensible le prochain
Commentaires