Le guide-âne du webmestre
images

logo guide-âne du webmestre

2 pages

 Anne Bedel

maj le 3-11-99
ouvert le 16-7-98
Les formats images du web les plus courants sont JPG et GIF.
Le format PDF est un format image destiné au téléchargement de documents mixtes composés en principe d'images et de textes (on peut aussi lire ce format au travers du navigateur). Les fiches suivantes traitent du PDF:
pdf.htm , charte.htm, telechar.htm

•Avantage gif:

  1. Format le mieux  adapté pour les dessins, les schémas, les images présentant peu de dégradé de couleurs, ou peu de couleurs différentes.

  2. Format obligatoire pour les images animés (telles que la panthère de la page d'accueil d'admiroutes).
    Il est nécessaire de disposer d'un logiciel de création d'images animées tel que Gif constructor set par exemple.

  3. Seul format proposant la transparence sur le fond de l'image (et plus précisément gif89)
    Au moment de la sauvegarde d'une image de type "gif "dans Paint Shop Pro, choisir le sous-type "version 89a -entrelacé"  ou "version 89a - non entrelacé"
    ATTENTION: le format GIF pose (novembre 1999) quelques problèmes de droits voir "Webmestres de tous pays, brûlez vos images gifs"

•Avantage jpeg:

  1. Format le mieux adapté pour les photos.
    Il est intéressant de remarquer que le format JPG, bien que proposant un nombre très important de couleurs (16 millions= 24bits), n'est pas très lourd.
  2. Grâce à la possibilité de compresser l'image, on obtient des images d'excellente qualité pour un poids minimum.
  3. Format à choisir de préférence à un gif 256 couleurs (on obtient une image moins lourde et de meilleure qualité en JPG)

ALT ou l'alternative à l'image

Vous devez décrire chaque image en quelques mots, et offrir ainsi une "alternative" à l'image, qui pourra être lue, quand le curseur passera dessus.
Quel intérêt présente cette alternative?
La possibilité de savoir qu'il existe une image et ce qu'elle représente, quand elle n'apparaît pas à l'écran pour les raisons suivantes:

  • Désactivation des images par l'internaute qui s'intéresse avant tout au texte.
  • Lenteur de chargement de l'image.
  • Lecture en braille par les aveugles (seul le texte est alors compris)

Ainsi pour le logo du guide-âne, l'alternative s'écrit en HTML de la façon suivante:
ALT="logo guide-âne du webmestre"
exemple du codage de l'image du logo du guide-âne:
<IMG SRC="../image/logo/guidane.gif" WIDTH="112" HEIGHT="105" ALT="logo guide-âne du webmestre" BORDER="0" ALIGN="Middle">
NB: La plupart des éditeurs HTML offrent la possibilité d'écrire cette alternative sans passer par le code HTML.

Pour réduire le poids d'une image GIF, il faut soit diminuer le nombre de couleurs, soit diminuer la taille de l'image (outil "redimensionner "de Paint Shop Pro 5, ou "rééchantillonner" de Paint Shop Pro 4 )
Passer d'une image JPG, en GIF16 couleurs, diminue le poids de l'image, mais le résultat est souvent de très mauvaise qualité (à vous de voir...).
Voir le petit tableau recapitulatif d'une image passant progressivement de JPG (2 taux de compression proposés) en GIF 256 et 16 couleurs.

Avant d'afficher une page contenant une image lourde, il est possible d'afficher une vignette de l'image (pour réduire une image, utiliser l'outil "resample" ou "rééchantillonner" du menu "image" de Paint shop pro 4, ou l'outil "resize" ou "redimensionner" de Paint shop pro 5)
Quand on affiche une vignette avec un lien vers une image plus grande, Il suffit d'indiquer le poids de l'image de destination, pour laisser à  l'internaute, le choix de charger ou non cette dernière.

exemple-image ayant été réduite avec Paint shop pro.
le colombie
cliquez dans cette vignette pour afficher ce tableau agrandi (au poids de 16 Ko).

Pour l'intranet, comme pour l'internet on doit éviter les images trop lourdes pour l'une des raisons suivantes:
-Certaines rubriques de l'intranet peuvent être reprises sur internet.
-Certains utilisateurs de l'intranet accèdent par modem.

Attention: si vous souhaitez diminuer le poids d'une image JPG, sans perte de qualité, le mieux est de la compresser par exemple avec Paint shop pro (au moment de la sauvegarde, cliquer dans option pour faire apparaître "taux de compression") ou aller sur le site http://www.jpegwizard.com/ (c'est gratuit). Une image peut perdre facilement 1/3 à 1/5 de son poids sans perte de qualité. Faites des essais.
Essayez par exemple, un taux de compression de 65 et voyez le rendu (attention: après avoir sauvegardé l'image, elle semble sans changement dans paint shop pro. Fermez-la et rappelez-la pour voir la différence).
Dans l'exemple-image, le tableau du bateau avait un poids de 32 Ko au départ, il aurait été possible de le compresser à 10 Ko.
Attention: lire la remarque ci-dessous, parvenue par mel:

Le message de:
Daniel GUEGUEN daniel.gueguen@uniciel.com
Date : vendredi 27 novembre 1998 09:41

- Dans la page sur les images, vous n'avez pas précisé qu'il ne faut jamais travailler à partir d'une image au format jpg : ce format utilise une compression avec perte de données (contrairement au format gif) et à chaque enregistrement des données sont perdues. Il faut donc travailler avec un format "stable" (bmp par exemple) et n'enregistrer en format jpg que pour l'image finale.

Oui, et j'ai remplacé, dans les options de "enregistrer sous" de Paint shop pro", le taux de compression par 1 en laissant à 300 dpi.
Puis au moment ou j'ai fini mon travail sur l'image, je change le taux de compression (j'impose par exemple 50) et j'enregistre.
Puis j'essaie de ne pas oublier de remettre le taux de compression à 1, avant de travailler sur une nouvelle image jpg.
Je pique votre idée! qui me paraît moins astreignante. AB.

Voir une astuce pour patienter pendant le chargement d'une image lourde: la fiche lowsrc.htm

Article du JDNet: Images: soyez très séléctif http://www.journaldunet.com/conseil9.shtml


http://www.admiroutes.asso.fr/webmestre/image.htm
©copyright