Typo3 afpa.fr - initiation

Transcription

1 intro 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

2 photos 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

3 photos 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

4 photos 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

5 01 optimiser 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

6 01 optimiser 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

7 01 02 Un 03 outil Un outil très s simple et gratuit Adresse : 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 7

8 Télécharger l outil l - 1 Cliquer sur le lien Adresse : 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 8

9 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

10 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

11 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

12 Tester l outil l 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

13 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

14 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

15 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

16 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

17 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

18 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

19 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

20 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

21 intro Typo3 afpa.fr initiation Redimensionner/Optimiser une photo G. Le Page 27/06/2008 G. Le Page - perf afpa.fr Typo3 Dia 21