SlideShare une entreprise Scribd logo
1  sur  10
Laurent Mottet - www.nakatomi-formation.be
                  L’optimisation des images
                  	 avec	Adobe Fireworks
Adobe Fireworks



                                    Partie : 2 - optimisation jpg




                                Laurent Mottet
                                Nakatomi-formation.be
Le fichier original




                                                   Laurent Mottet - www.nakatomi-formation.be
                   • Type d’image : bitmap
                   
                   • Dimension : 2592 x 1944 
Adobe Fireworks


                   
                   • Couleurs : RGB
                   
                   • Poids : 1.8 Mb
                   
                   • Format de compression : jpg
Les étapes pour optimiser une image




                                                                                          Laurent Mottet - www.nakatomi-formation.be
                    1 . R e c a d r e r la p h o t o g r a p h ie 
                    
 soit avec l’outil : Recadrage [c]
Adobe Fireworks


                    
 soit via le menu : Edition / Recadrer l’objet bitmap sélectionné

                    2 . C o r r ig e r la p h o t o g r a p h ie 
                    
    via la fenêtre Propriété / Filtres / Régler la couleur

                    3 . C h o is ir le b o n m o d e d e c o m p r e s s io n 
                    
    PNG ou JPG
Le fichier importé




                                                                       Laurent Mottet - www.nakatomi-formation.be
                                       • Type d’image : bitmap
                                       • Dimension : 1050x788
                                       • Couleurs : RGB
Adobe Fireworks


                                       • Poids : 900 ko
                                       • Format de compression : JPG
L’image recadrée




                                                                     Laurent Mottet - www.nakatomi-formation.be
                                     • Type d’image : bitmap
                                     • Dimension : 960 x 320
                                     • Couleurs : RGB
Adobe Fireworks


                                     • Poids : 399 ko
                                     • Format de compression : png
L’image corrigée




                                                                     Laurent Mottet - www.nakatomi-formation.be
                                     • Type d’image : bitmap
                                     • Dimension : 960 x 320
                                     • Couleurs : RGB
Adobe Fireworks


                                     • Poids : 512 ko
                                     • Format de compression : png
Optimisation png 24




                                                                        Laurent Mottet - www.nakatomi-formation.be
                                        • Type d’image : bitmap
                                        • Dimension : 960 x 320
                                        • Couleurs : RGB
Adobe Fireworks


                                        • Poids : 509 ko
                                        • Format de compression : png
Optimisation JPG 70%




                                                                         Laurent Mottet - www.nakatomi-formation.be
                                         • Type d’image : bitmap
                                         • Dimension : 960 x 320
                                         • Couleurs : RGB
Adobe Fireworks


                                         • Poids : 90 ko
                                         • Format de compression : jpg
Optimisation JPG 60%




                                                                             Laurent Mottet - www.nakatomi-formation.be
                                         • Type d’image : bitmap
                                         • Dim ension : 960 x 320
                                         • Couleurs : RGB
Adobe Fireworks


                                         • Poids : 75 ko
                                         • Format de compression : 60% jpg
Laurent Mottet - www.nakatomi-formation.be
                  C o n ta c t	
                  	
Adobe Fireworks


                                   www.nakatomi-formation.be




                                                       Laurent Mottet
                                                                     
                                               laurent@nakatomi.be
                                               twitter.com/nakatomi

Contenu connexe

Plus de Laurent Mottet

Ergonomie e-commerce - Les clés d’entrée pour une fiche produit
Ergonomie e-commerce - Les clés d’entrée pour une fiche produitErgonomie e-commerce - Les clés d’entrée pour une fiche produit
Ergonomie e-commerce - Les clés d’entrée pour une fiche produitLaurent Mottet
 
Ergonomie e-commerce - Tunnel de conversion
Ergonomie e-commerce - Tunnel de conversionErgonomie e-commerce - Tunnel de conversion
Ergonomie e-commerce - Tunnel de conversionLaurent Mottet
 
Formation Ergonomie web : le wireframing
Formation Ergonomie web : le wireframingFormation Ergonomie web : le wireframing
Formation Ergonomie web : le wireframingLaurent Mottet
 
Creer et envoyer une newsletter avec Mailchimp
Creer et envoyer une newsletter avec MailchimpCreer et envoyer une newsletter avec Mailchimp
Creer et envoyer une newsletter avec MailchimpLaurent Mottet
 
Concevoir une newsletter, une infolettre
Concevoir une newsletter, une infolettreConcevoir une newsletter, une infolettre
Concevoir une newsletter, une infolettreLaurent Mottet
 
Conception d'une newsletter
Conception d'une newsletterConception d'une newsletter
Conception d'une newsletterLaurent Mottet
 
Formation référencement - Technique d'indexation d'une page web
Formation référencement - Technique d'indexation d'une page webFormation référencement - Technique d'indexation d'une page web
Formation référencement - Technique d'indexation d'une page webLaurent Mottet
 
Formation référencement - la recherche des mots-clés pour le SEO
Formation référencement - la recherche des mots-clés pour le SEOFormation référencement - la recherche des mots-clés pour le SEO
Formation référencement - la recherche des mots-clés pour le SEOLaurent Mottet
 
The Features In Adobe Fireworks
The Features In Adobe FireworksThe Features In Adobe Fireworks
The Features In Adobe FireworksLaurent Mottet
 
Creating buttons in Adobe Fireworks
Creating buttons in Adobe FireworksCreating buttons in Adobe Fireworks
Creating buttons in Adobe FireworksLaurent Mottet
 
The image optimization Adobe Fireworks - 2
The image optimization Adobe Fireworks - 2The image optimization Adobe Fireworks - 2
The image optimization Adobe Fireworks - 2Laurent Mottet
 
Workspace in Adobe Fireworks
Workspace in Adobe FireworksWorkspace in Adobe Fireworks
Workspace in Adobe FireworksLaurent Mottet
 
The image optimization Adobe Fireworks - 1
The image optimization Adobe Fireworks - 1The image optimization Adobe Fireworks - 1
The image optimization Adobe Fireworks - 1Laurent Mottet
 
Symbol script in Adobe Fireworks
Symbol script in Adobe FireworksSymbol script in Adobe Fireworks
Symbol script in Adobe FireworksLaurent Mottet
 
Tips for Adobe Fireworks
Tips for Adobe FireworksTips for Adobe Fireworks
Tips for Adobe FireworksLaurent Mottet
 
Adobe Fireworks : Trucs et astuces
Adobe Fireworks : Trucs et astucesAdobe Fireworks : Trucs et astuces
Adobe Fireworks : Trucs et astucesLaurent Mottet
 
Formation Adobe Fireworks - Flux du document
Formation Adobe Fireworks - Flux du documentFormation Adobe Fireworks - Flux du document
Formation Adobe Fireworks - Flux du documentLaurent Mottet
 
Création de boutons avec Adobe Fireworks
Création de boutons avec Adobe FireworksCréation de boutons avec Adobe Fireworks
Création de boutons avec Adobe FireworksLaurent Mottet
 
Ergonomie web : Les étapes pour la création d'un site web
Ergonomie web : Les étapes pour la création d'un site webErgonomie web : Les étapes pour la création d'un site web
Ergonomie web : Les étapes pour la création d'un site webLaurent Mottet
 
Formation Adobe Fireworks : l'interface. Formateur Laurent Mottet
Formation Adobe Fireworks : l'interface. Formateur Laurent MottetFormation Adobe Fireworks : l'interface. Formateur Laurent Mottet
Formation Adobe Fireworks : l'interface. Formateur Laurent MottetLaurent Mottet
 

Plus de Laurent Mottet (20)

Ergonomie e-commerce - Les clés d’entrée pour une fiche produit
Ergonomie e-commerce - Les clés d’entrée pour une fiche produitErgonomie e-commerce - Les clés d’entrée pour une fiche produit
Ergonomie e-commerce - Les clés d’entrée pour une fiche produit
 
Ergonomie e-commerce - Tunnel de conversion
Ergonomie e-commerce - Tunnel de conversionErgonomie e-commerce - Tunnel de conversion
Ergonomie e-commerce - Tunnel de conversion
 
Formation Ergonomie web : le wireframing
Formation Ergonomie web : le wireframingFormation Ergonomie web : le wireframing
Formation Ergonomie web : le wireframing
 
Creer et envoyer une newsletter avec Mailchimp
Creer et envoyer une newsletter avec MailchimpCreer et envoyer une newsletter avec Mailchimp
Creer et envoyer une newsletter avec Mailchimp
 
Concevoir une newsletter, une infolettre
Concevoir une newsletter, une infolettreConcevoir une newsletter, une infolettre
Concevoir une newsletter, une infolettre
 
Conception d'une newsletter
Conception d'une newsletterConception d'une newsletter
Conception d'une newsletter
 
Formation référencement - Technique d'indexation d'une page web
Formation référencement - Technique d'indexation d'une page webFormation référencement - Technique d'indexation d'une page web
Formation référencement - Technique d'indexation d'une page web
 
Formation référencement - la recherche des mots-clés pour le SEO
Formation référencement - la recherche des mots-clés pour le SEOFormation référencement - la recherche des mots-clés pour le SEO
Formation référencement - la recherche des mots-clés pour le SEO
 
The Features In Adobe Fireworks
The Features In Adobe FireworksThe Features In Adobe Fireworks
The Features In Adobe Fireworks
 
Creating buttons in Adobe Fireworks
Creating buttons in Adobe FireworksCreating buttons in Adobe Fireworks
Creating buttons in Adobe Fireworks
 
The image optimization Adobe Fireworks - 2
The image optimization Adobe Fireworks - 2The image optimization Adobe Fireworks - 2
The image optimization Adobe Fireworks - 2
 
Workspace in Adobe Fireworks
Workspace in Adobe FireworksWorkspace in Adobe Fireworks
Workspace in Adobe Fireworks
 
The image optimization Adobe Fireworks - 1
The image optimization Adobe Fireworks - 1The image optimization Adobe Fireworks - 1
The image optimization Adobe Fireworks - 1
 
Symbol script in Adobe Fireworks
Symbol script in Adobe FireworksSymbol script in Adobe Fireworks
Symbol script in Adobe Fireworks
 
Tips for Adobe Fireworks
Tips for Adobe FireworksTips for Adobe Fireworks
Tips for Adobe Fireworks
 
Adobe Fireworks : Trucs et astuces
Adobe Fireworks : Trucs et astucesAdobe Fireworks : Trucs et astuces
Adobe Fireworks : Trucs et astuces
 
Formation Adobe Fireworks - Flux du document
Formation Adobe Fireworks - Flux du documentFormation Adobe Fireworks - Flux du document
Formation Adobe Fireworks - Flux du document
 
Création de boutons avec Adobe Fireworks
Création de boutons avec Adobe FireworksCréation de boutons avec Adobe Fireworks
Création de boutons avec Adobe Fireworks
 
Ergonomie web : Les étapes pour la création d'un site web
Ergonomie web : Les étapes pour la création d'un site webErgonomie web : Les étapes pour la création d'un site web
Ergonomie web : Les étapes pour la création d'un site web
 
Formation Adobe Fireworks : l'interface. Formateur Laurent Mottet
Formation Adobe Fireworks : l'interface. Formateur Laurent MottetFormation Adobe Fireworks : l'interface. Formateur Laurent Mottet
Formation Adobe Fireworks : l'interface. Formateur Laurent Mottet
 

Dernier

GHASSOUB _Seance 3_ measurement and evaluation in education.pptx
GHASSOUB _Seance 3_ measurement and evaluation in education.pptxGHASSOUB _Seance 3_ measurement and evaluation in education.pptx
GHASSOUB _Seance 3_ measurement and evaluation in education.pptxAbderrahim GHASSOUB
 
Fiche de vocabulaire pour faire une appréciation
Fiche de vocabulaire pour faire une appréciationFiche de vocabulaire pour faire une appréciation
Fiche de vocabulaire pour faire une appréciationLeBaobabBleu1
 
Saint Damien, missionnaire auprès des lépreux de Molokai, Hawaï.pptx
Saint Damien, missionnaire auprès des lépreux de Molokai, Hawaï.pptxSaint Damien, missionnaire auprès des lépreux de Molokai, Hawaï.pptx
Saint Damien, missionnaire auprès des lépreux de Molokai, Hawaï.pptxMartin M Flynn
 
Àma Gloria.pptx Un film tourné au Cap Vert et en France
Àma Gloria.pptx   Un film tourné au Cap Vert et en FranceÀma Gloria.pptx   Un film tourné au Cap Vert et en France
Àma Gloria.pptx Un film tourné au Cap Vert et en FranceTxaruka
 
Nathanaëlle Herbelin.pptx Peintre française
Nathanaëlle Herbelin.pptx Peintre françaiseNathanaëlle Herbelin.pptx Peintre française
Nathanaëlle Herbelin.pptx Peintre françaiseTxaruka
 
Les débuts de la collection "Le livre de poche"
Les débuts de la collection "Le livre de poche"Les débuts de la collection "Le livre de poche"
Les débuts de la collection "Le livre de poche"ArchivesdeLyon
 
CALENDRIER ET COMPTE RENDU REUNION DIRECTION
CALENDRIER ET COMPTE RENDU REUNION DIRECTIONCALENDRIER ET COMPTE RENDU REUNION DIRECTION
CALENDRIER ET COMPTE RENDU REUNION DIRECTIONfrizzole
 
complement de agri cours irrigation.pptx
complement de agri cours irrigation.pptxcomplement de agri cours irrigation.pptx
complement de agri cours irrigation.pptxIbrahimBasallam
 
Réunion des directeurs de Jonzac - 15 mai 2024
Réunion des directeurs de Jonzac - 15 mai 2024Réunion des directeurs de Jonzac - 15 mai 2024
Réunion des directeurs de Jonzac - 15 mai 2024IEN_Jonzac
 
GHASSOUB _Seance 4_ measurement and evaluation in education_-.pptx
GHASSOUB _Seance 4_ measurement and evaluation in education_-.pptxGHASSOUB _Seance 4_ measurement and evaluation in education_-.pptx
GHASSOUB _Seance 4_ measurement and evaluation in education_-.pptxAbderrahim GHASSOUB
 
Chapitre3-Classififcation des structures de chaussu00E9e.pptx
Chapitre3-Classififcation des structures de  chaussu00E9e.pptxChapitre3-Classififcation des structures de  chaussu00E9e.pptx
Chapitre3-Classififcation des structures de chaussu00E9e.pptxModesteTiemele
 
Un petit coin etwinning- Au fil des cultures urbaines
Un petit coin  etwinning- Au fil des cultures urbainesUn petit coin  etwinning- Au fil des cultures urbaines
Un petit coin etwinning- Au fil des cultures urbainesSocratis Vasiopoulos
 
Texte avec différentes critiques positives, négatives ou mitigées
Texte avec différentes critiques positives, négatives ou mitigéesTexte avec différentes critiques positives, négatives ou mitigées
Texte avec différentes critiques positives, négatives ou mitigéesLeBaobabBleu1
 

Dernier (13)

GHASSOUB _Seance 3_ measurement and evaluation in education.pptx
GHASSOUB _Seance 3_ measurement and evaluation in education.pptxGHASSOUB _Seance 3_ measurement and evaluation in education.pptx
GHASSOUB _Seance 3_ measurement and evaluation in education.pptx
 
Fiche de vocabulaire pour faire une appréciation
Fiche de vocabulaire pour faire une appréciationFiche de vocabulaire pour faire une appréciation
Fiche de vocabulaire pour faire une appréciation
 
Saint Damien, missionnaire auprès des lépreux de Molokai, Hawaï.pptx
Saint Damien, missionnaire auprès des lépreux de Molokai, Hawaï.pptxSaint Damien, missionnaire auprès des lépreux de Molokai, Hawaï.pptx
Saint Damien, missionnaire auprès des lépreux de Molokai, Hawaï.pptx
 
Àma Gloria.pptx Un film tourné au Cap Vert et en France
Àma Gloria.pptx   Un film tourné au Cap Vert et en FranceÀma Gloria.pptx   Un film tourné au Cap Vert et en France
Àma Gloria.pptx Un film tourné au Cap Vert et en France
 
Nathanaëlle Herbelin.pptx Peintre française
Nathanaëlle Herbelin.pptx Peintre françaiseNathanaëlle Herbelin.pptx Peintre française
Nathanaëlle Herbelin.pptx Peintre française
 
Les débuts de la collection "Le livre de poche"
Les débuts de la collection "Le livre de poche"Les débuts de la collection "Le livre de poche"
Les débuts de la collection "Le livre de poche"
 
CALENDRIER ET COMPTE RENDU REUNION DIRECTION
CALENDRIER ET COMPTE RENDU REUNION DIRECTIONCALENDRIER ET COMPTE RENDU REUNION DIRECTION
CALENDRIER ET COMPTE RENDU REUNION DIRECTION
 
complement de agri cours irrigation.pptx
complement de agri cours irrigation.pptxcomplement de agri cours irrigation.pptx
complement de agri cours irrigation.pptx
 
Réunion des directeurs de Jonzac - 15 mai 2024
Réunion des directeurs de Jonzac - 15 mai 2024Réunion des directeurs de Jonzac - 15 mai 2024
Réunion des directeurs de Jonzac - 15 mai 2024
 
GHASSOUB _Seance 4_ measurement and evaluation in education_-.pptx
GHASSOUB _Seance 4_ measurement and evaluation in education_-.pptxGHASSOUB _Seance 4_ measurement and evaluation in education_-.pptx
GHASSOUB _Seance 4_ measurement and evaluation in education_-.pptx
 
Chapitre3-Classififcation des structures de chaussu00E9e.pptx
Chapitre3-Classififcation des structures de  chaussu00E9e.pptxChapitre3-Classififcation des structures de  chaussu00E9e.pptx
Chapitre3-Classififcation des structures de chaussu00E9e.pptx
 
Un petit coin etwinning- Au fil des cultures urbaines
Un petit coin  etwinning- Au fil des cultures urbainesUn petit coin  etwinning- Au fil des cultures urbaines
Un petit coin etwinning- Au fil des cultures urbaines
 
Texte avec différentes critiques positives, négatives ou mitigées
Texte avec différentes critiques positives, négatives ou mitigéesTexte avec différentes critiques positives, négatives ou mitigées
Texte avec différentes critiques positives, négatives ou mitigées
 

Formation Adobe Fireworks : optimisation des images pour le web - Partie 2. Formateur Laurent Mottet

  • 1. Laurent Mottet - www.nakatomi-formation.be L’optimisation des images avec Adobe Fireworks Adobe Fireworks Partie : 2 - optimisation jpg Laurent Mottet Nakatomi-formation.be
  • 2. Le fichier original Laurent Mottet - www.nakatomi-formation.be • Type d’image : bitmap • Dimension : 2592 x 1944 Adobe Fireworks • Couleurs : RGB • Poids : 1.8 Mb • Format de compression : jpg
  • 3. Les étapes pour optimiser une image Laurent Mottet - www.nakatomi-formation.be 1 . R e c a d r e r la p h o t o g r a p h ie soit avec l’outil : Recadrage [c] Adobe Fireworks soit via le menu : Edition / Recadrer l’objet bitmap sélectionné 2 . C o r r ig e r la p h o t o g r a p h ie via la fenêtre Propriété / Filtres / Régler la couleur 3 . C h o is ir le b o n m o d e d e c o m p r e s s io n PNG ou JPG
  • 4. Le fichier importé Laurent Mottet - www.nakatomi-formation.be • Type d’image : bitmap • Dimension : 1050x788 • Couleurs : RGB Adobe Fireworks • Poids : 900 ko • Format de compression : JPG
  • 5. L’image recadrée Laurent Mottet - www.nakatomi-formation.be • Type d’image : bitmap • Dimension : 960 x 320 • Couleurs : RGB Adobe Fireworks • Poids : 399 ko • Format de compression : png
  • 6. L’image corrigée Laurent Mottet - www.nakatomi-formation.be • Type d’image : bitmap • Dimension : 960 x 320 • Couleurs : RGB Adobe Fireworks • Poids : 512 ko • Format de compression : png
  • 7. Optimisation png 24 Laurent Mottet - www.nakatomi-formation.be • Type d’image : bitmap • Dimension : 960 x 320 • Couleurs : RGB Adobe Fireworks • Poids : 509 ko • Format de compression : png
  • 8. Optimisation JPG 70% Laurent Mottet - www.nakatomi-formation.be • Type d’image : bitmap • Dimension : 960 x 320 • Couleurs : RGB Adobe Fireworks • Poids : 90 ko • Format de compression : jpg
  • 9. Optimisation JPG 60% Laurent Mottet - www.nakatomi-formation.be • Type d’image : bitmap • Dim ension : 960 x 320 • Couleurs : RGB Adobe Fireworks • Poids : 75 ko • Format de compression : 60% jpg
  • 10. Laurent Mottet - www.nakatomi-formation.be C o n ta c t Adobe Fireworks www.nakatomi-formation.be Laurent Mottet laurent@nakatomi.be twitter.com/nakatomi