6. Images
6-1 Insertion d'images
Les formats d'image affichables par Netscape sont *.gif et *.jpg. Pour faire apparaître des images à l'intérieur d'un document HTML on utilise la commande "img":
Tous les paramètres ne sont pas indispensables. Néanmoins, comme nous le verrons dans la section suivante, l'utilisation des paramètres permet d'améliorer le confort d'utilisation des images par une baisse du temps de téléchargement.
Syntaxe:
<img src="URL" align="alignement" alt="commentaire" width=n height=n hspace=n vspace=n border=n>
Une déclaration minimale ressemblerait à ceci:
<img src="cow.gif">
Paramètres (valables pour Netscape):
- Le paramètre "src" doit contenir un URL ou un chemin relatif vers un fichier de format gif ou jpg.
- Le paramètre "align" permet de spécifier l'alignement de l'image par rapport au texte. Les valeurs possibles sont : top, bottom, middle, right, left
- Le paramètre "alt" contient le commentaire que les personnes utilisant un browser textuel (sans images) voient à la place de l'image.
- Les paramètres "width" et "height" se réfèrent à la largeur et à la hauteur de l'image (en pixels). Netscape crée un cadre vide de cette taille avant de commencer à télécharger l'image. Utilisez cette procédure dans tous les cas, car cela permet de commencer à lire le texte avant que l'image soit chargée complètement. La plupart des outils d'imagerie vous indiquent la taille d'une image.
- Le paramètre "hspace" permet de spécifier la distance horizontale en pixels entre le texte environnant et le bord de l'image.
- Le paramètre "vspace" permet de spécifier la distance verticale en pixels entre l'image et le texte qui l'entoure.
- Le paramètre "border" permet de créer un cadre autour de l'image. La largeur de la bordure est exprimée en pixels. Une utilisation courante est de mettre BORDER=0 pour éviter qu'un cadre bleu soit dessiné autour d'une image qui serait la partie active d'un lien.
Exemple:
Pour voir l'effet des paramètres dans l'insertion d'images reportez-vous à l'URL: http://tecfa.unige.ch/guides/htmlman/images_test.html dont voici un extrait du code source:
- Le texte est aligné en haut de l'image à une distance de 15 pixels. La bordure de l'image vaut 3 pixels.
<img src="cow.gif" align=top border=3 width=85 height=67 alt="a cow" hspace=15>
- Le texte est aligné au milieu de l'image à une ditance horizontale de 40 pixels et une distance verticale de 30 pixels. La bordure est de 10 pixels.
<img src="cow.gif" align=middle border=10 width=85 height=67 alt="a cow" hspace=40 vspace=30>