Le but étant d'alléger le poids des pages. Afin d'éviter d'interminables temps de chargement à l'internaute, ou encore qu'il passe son chemin lassé d'attendre... Cet article vous donnera quelques conseils concernant l'optimisation des images pour le web.
Graphisme
Recherche :   
Actualité Système Salon Concours Outils Programmation Devparadise Programmation HTML .Net JavaScript VBScript ASP PHP Visual Basic Perl Java Active X SQL XML WAP Delphi Graphisme Flash Web Design Promotion Référencement Publicité Valeur de votre site Outils Systèmes Windows Unix Linux Benchmark Hardware Réseaux locaux Droit Sécurité
Optimiser ses images sous Image Ready
  Auteur : Arnaud DESFONTAINES

Le but étant d'alléger le poids des pages. Afin d'éviter d'interminables temps de chargement à l'internaute, ou encore qu'il passe son chemin lassé d'attendre... Cet article vous donnera quelques conseils concernant l'optimisation des images pour le web.

Publicité 
Pour une photographie, il est conseillé d'utiliser le format (.jpeg) et pour une illustration, le format (.gif).

Pour une photographie : depuis Photoshop ; lorsque votre image est totalement prête, que vous lui avez appliquer les effets souhaités, les textures, les différents éléments qui la compose,etc... Il vous faut l'éditer dans Image Ready. Pour cela en bas de la barre d'outil de Photoshop, vous devez cliquer sur l'icône représentant un fichier comportant une flèche et indiquant le logo d'Adobe).

Une fois l'image ouverte, vous devez dans la palette «Optimiser» situé en haut à droite de la fenêtre de l'application, choisir l'option (JPEG) puis cliquez sur l'onglet «4 vignettes».

Vous obtenez instantanément une visualisation de votre image avec quatre paramètres d'optimisation différents et donc par conséquent quatre poids différents. (le poids est indiqué sous chacune des quatre images)

Sélectionnez celle qui a le poids le moins élevé en cliquant dessus. En l'occurrence, la quatrième dans notre exemple. Vous pouvez affiner l'optimisation en modifiant les paramètres de la palette «Optimiser» situé en haut à droite de la fenêtre de l'application. Ci-dessous, voici les paramètres requis pour le traitement de notre photographie. (chaque cas est unique, il faut faire des essais pour se rendre compte du résultat jusqu'à trouver le bon compromis entre le poids et la perte de qualité de la photo)

La photographie originale pesait 3,23 Mo. et une fois optimisé elle ne pèse plus que 51,23 Ko. pour une image de dimension 1535 x 1055 pixels.

Lorsque vous êtes satisfait du résultat, il ne vous reste plus qu'a sauvegarder. Faite (Fichier / Enregistrer une copie optimisée) ou (Ctrl + Alt + S).

Pour une illustration : depuis Photoshop ; lorsque votre image est totalement prête, éditer la dans Image Ready en cliquant en bas de la barre d'outil de Photoshop.

Une fois ouverte dans Image Ready, dans la palette «Optimiser» choisir l'option (GIF) puis cliquez sur l'onglet «4 vignettes».

Dans notre exemple, l'image qui a le poids le moins élevé est la seconde. Vous pouvez affiner l'optimisation en modifiant les paramètres de la palette «Optimiser». Ci-dessous, voici les paramètres requis pour le traitement de notre illustration. (chaque cas est unique, il faut faire des essais pour se rendre compte du résultat jusqu'à trouver le bon compromis entre le poids et la perte de qualité de l'illustration)

L'illustration originale pesait 170 Ko. et une fois optimisé elle ne pèse plus que 9,34 Ko. pour une image de dimension 266 x 266 pixels.

Lorsque vous êtes satisfait du résultat, il ne vous reste plus qu'a sauvegarder. Faite (Fichier / Enregistrer une copie optimisée) ou (Ctrl + Alt + S).

A lire aussi sur Devparadise.com :
  • Simulation de la fonction LIMIT de MySQL avec SQL Server
  • Utilisation de la palette pathfinder d'Illustrator
  • Gifs animés sous ImageReady suite... (l'interpolation)
  • Utiliser les scripts d'ImageReady
  • Glisser/déposer directement depuis un dossier des éléments sur un document ou...
  • A télécharger aussi sur Devparadise.com :
  • E.C.T Barre 1.2
  • BT, Constructeur de Sites
  • Database Designer 8.32
  • Net Mailing Pro 1.32
  • TestLAB 2000

  • © 1997-2009 tous droits réservés Devparadise.com
    Les logos, et marques déposées sont la propriété de leurs détenteurs respectifs.
    Devparadise.com s'est engagé à respecter la confidentialité des données personnelles régies par la loi 78-17 du 6 janvier 1978.
    Déclaration C.N.I.L. n° 621623
    optimiser,Image Ready,truc,astuce,.jpeg,.gif