intro 01 02 03 04 05 06 07 Typo3 afpa.fr - initiation Redimensionner/Optimiser une photo En date du 27 juin 2008 Mode d emploi du diaporama en ligne : Pour faire avancer les animations de diapo, cliquer sur le bouton (avancer ) en bas à gauche de la fenêtre 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 1
photos 01 02 03 04 05 06 07 Les photos numériques originales Une photo numérique originale est souvent «lourde» Les appareils actuels enregistrent couramment des photos larges de 3600 pixels Cela correspond à une page papier de 1m de large!!! Ces images «pèsent» lourd en Kilo-octets 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 2
photos 01 02 03 04 05 06 07 Affichage sur un écran Les photos sur le web l écran d un PC portable moyen mesure seulement 1024 pixels, une photo affichée dans un bloc info sur le site de l afpa ne mesure que 156 pixels de large Les photos à la sortie de l appareil photo sont disproportionnées pour le web : en poids, en taille en finesse de détail pour une utilisation sur un site web Il est utile de les redimensionner 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 3
photos 01 02 03 04 05 06 07 Un exemple de photo originale Cette photo a été prise en juin 2008 Elle mesure 2736 pixels de large sur 3648 pixels de haut Elle «pèse» 5,4 Méga-octets Taille réelle (détail) La même image, à l échelle 5% (divisée par 20!) 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 4
01 optimiser 02 03 04 05 06 07 Redimensionner? Optimiser? Redimensionner On dit aussi «retailler» (dans le sens «modifier la taille) Il s agit de modifier largeur et longueur de la photo sans toucher à son contenu : on en garde les proportions, les couleurs, la définition Optimiser Il s agit de retraiter la photo pour que la précision des détails soit adaptée à l affichage web, mais pas plus : en clair, en limiter le poids tant que possible sans perdre de qualité apparente Cette opération est effectuée par des outils logiciels : pratiquement tous les logiciels de retouche d image en sont capables. L image est retraitée de façon à ce que les nuances de couleur soient moins nombreuses et que la résolution soit diminuée : en affichage web, personne ne s en apercevra. 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 5
01 optimiser 02 03 04 05 06 07 Redimensionner? Optimiser? Exemple La qualité reste très acceptable Non retaillée, non optimisée : Largeur 717 pixels Poids 477 ko Retaillée, optimisée : Largeur 200 pixels Poids 8 ko 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 6
01 02 Un 03 outil 04 05 06 07 Un outil très s simple et gratuit Adresse : http://www.rw-designer.com/picture-resize 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 7
Télécharger l outil l - 1 Cliquer sur le lien Adresse : http://www.rw-designer.com/picture-resize 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 8
Télécharger l outil l - 2 Une boite de dialogue s affiche Cliquer sur «Enregistrer le fichier» 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 9
Télécharger l outil l - 3 Une boite de dialogue s affiche Choisissez d enregistrer sur le «bureau» 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 10
Télécharger l outil l - 4 Le logiciel est maintenant sur le «bureau» Il a même changé de nom en passant (ah les miracles de l informatique ) 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 11
Tester l outil l - 1 1 - Ouvrez un répertoire contenant une photo à optimiser 2 - organisez ce répertoire sur le bureau de façon à accéder facilement à «PhotoResizer400» 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 12
Tester l outil l - 2 Faire glisser et poser le fichier image (drag & drop) sur l icône du logiciel du bureau 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 13
Une boite de dialogue s ouvre Tester l outil l - 3 Appuyer sur la touche «Entrée», Comme demandé 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 14
Tester l outil l - 5 Dans le répertoire d origine, un nouveau fichier image est apparu : bouteille_orig-400.jpg 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 15
Tester l outil l - 6 L image d origine s appelait : bouteille_orig.jpg Elle mesurait 717 x 1011 Elle pesait 477 ko Elle mesure 283 x 400 Elle pèse seulement 13 ko L image optimisée s appelle : bouteille_orig-400.jpg 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 16
Tester l outil l - 7 L image d origine (détail en taille réelle) L image optimisée (taille réelle) 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 17
Tester l outil l - 8 Elle mesurait 717 x 1011 Elle pesait 477 ko Elle mesure 283 x 400 Elle pèse 13 ko Commentaires : La photo a été redimensionnée et optimisée La dimension maximum d origine était la largeur (1011) Elle a été ramenée à 400 Sur le bureau, le logiciel est nommé PhotoResize400.exe Il a agit de la façon suivante : Réduction de la dimension maxi à la taille indiquée dans le nom du logiciel (400) Respect des proportions Optimisation de la photo 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 18
Tester l outil l - 9 La photo originale s appelle bouteille_orig.jpg La photo optimisée s appelle bouteille_orig-400.jpg Commentaires : Sur le bureau, le logiciel est nommé PhotoResize400.exe La photo a été ramenée à 400 pixels Étonnant, non? PhotoResizer a agit de la façon suivante : Réduction de la dimension maxi à la taille indiquée dans le nom du logiciel (400) Respect des proportions Optimisation de la photo 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 19
Utiliser l outil l plus largement Puisque le nombre dans le nom du logiciel est déterminant dans le redimensionnement des photos : 1. Cloner le logiciel par copier coller sur le bureau 2. Renommer les nouveaux logiciels avec les nombres cibles 3. Utiliser dans le nom un W ou un H majuscule si l on souhaite traiter en priorité la largeur ou la hauteur de la photo 4. L important dans le nom du logiciel, c est en fait le nombre! Exemples : PhotoResize400.exe, prw640.exe, prw156.exe, toto_h680.exe, aldow800.exe 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 20
intro 01 02 03 04 05 06 07 Typo3 afpa.fr initiation Redimensionner/Optimiser une photo G. Le Page 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 21