présente
Le petit guide HTML
Les images
Même si vos pages Web sont très intéressantes, il est toujours utile de les agrémenter par quelques images. Utilisez des images aux formats GIF ou JPEG (ou JPG), pour qu'elles puissent être facilement affichées sur toutes les plateformes (PC, Mac, Unix...).
Pour afficher une image, il suffit de créer un lien vers le fichier d'image. La balise utilise les codes <img src="nom de l'image">. Par exemple :
Si l'affichage des images par le visualiseur a été désactivé, seul un petit cadre vide s'affichera. Le code ALT="nom" permet d'afficher dans le cadre vide un petit texte qui donne des informations sur l'image. Par exemple, la balise qui affiche le logo en haut de cette page est la suivante :
Avec Windows 95, le contenu de ALT apparaît en infobulle si le pointeur de la souris s'y arrête.
Comme pour les barres de séparation, il est possible d'utiliser le paramètre width=. En plus, le paramètre height= permet de contrôler la hauteur de l'image. La valeur à indiquer est un pourcentage de la largeur de la fenêtre ou un nombre de pixels.
Le paramètre align= peut prendre les trois valeurs LEFT, CENTER et RIGHT pour aligner l'image contre la marge de gauche, la centrer ou l'aligner à droite.
Attention : les grandes images s'affichent lentement... Utilisez autant que possible des petites images. Si vous utilisez des images de grande taille, vous pouvez décider d'un affichage progressif : le visualiseur charge d'abord une image en basse résolution, puis la remplace par l'image en haute résolution.
Pour pouvoir utiliser des images, il faut d'abord en avoir... Vous trouverez de nombreux logiciels en shareware (vous payez la licence après avoir testé le logiciel et que vous décidez de le conserver) sur divers sites. Bonne chasse.
vous pouvez remplacer le texte Continuer par l'image SUITE.JPG et écrire :
Pour définir les différentes zones d'une image, utilisez votre logiciel graphique préféré. Dans la balise qui affiche l'image, utilisez la commande USEMAP= pour indiquer où se trouve la liste des zones. Si le visualiseur ne peut pas gérer ces zones, ajouter le code ISMAP pour en confier la tâche au serveur.
Votre répertoire de zones peut se trouver dans la page en cours (dans ce cas, la commande USEMAP= indique un lien local, du type "#haut"). Mais vous pouvez également avoir votre liste de zones dans une page réservée à cela.
Exemples :
Votre liste de zones est définie par les balises <MAP> et </MAP>. Chaque zone est un lien hypertexte. Exemple :
<MAP NAME="3">
<AREA SHAPE=RECT COORDS="60,80,120,100" HREF=map1.htm>
<AREA SHAPE=RECT COORDS="140,130,210,160" HREF=map2.htm>
<AREA SHAPE=RECT COORDS="80,20,220,50" HREF=map3.htm>
<MAP>
D'autres commandes sont disponibles
| <AREA SHAPE=RECT COORDS= [2 coins] HREF= [url]> | Définir un rectangle en indiquant les coordonnées de deux coins (en haut à gauche, en bas à droite) |
| <AREA SHAPE=CIRCLE COORDS= [x, y, rayon] HREF= [url]> | Définir un cercle en indiquant les coordonnées du centre (x, y) et le rayon. |
| <AREA SHAPE=POLY COORDS= [x,y,x2,y2,x3,y3....xn,yn] HREF= [url]> | Définir un polygone en indiquant les coordonnées de ses différents coins (xy1, xy2, xy3...). |
Voici un exemple de source d'une page Web qui montre l'utilisation de ces balises.
<H1 align=center>This Is An Image Map Example</H1>
<CENTER>
<IMG SRC="map.gif" width=300 height=200 USEMAP="#sample" ISMAP>
</CENTER>
<MAP NAME="sample">
<AREA SHAPE=RECT COORDS="60,80,120,100" HREF=map1.htm>
<AREA SHAPE=RECT COORDS="140,130,210,160" HREF=map2.htm>
<AREA SHAPE=RECT COORDS="80,20,220,50" HREF=map3.htm>
</MAP>
</BODY>
</HTML>
Si deux zones se superposent, la zone qui sera activée sera celle qui figurera avant l'autre dans la liste. Vous pouvez ainsi définir un lien pour plusieurs petites zones de l'image, et ensuite une grande zone qui couvre toute l'image. Si on clique sur une petite zone, elle sera active si on clique entre les petites zone, c'est le lien correspondant à l'image entière qui sera active.
Si tout n'est pas encore possible, la palette de liens possibles pour une même image est importante. Par exemple, un site technique pourra afficher la photographie d'une machine, et le visiteur cliquera sur l'élément qui l'intéresse pour accéder à des pages détaillées.
Vous pouvez utiliser vos images pour créer des liens hypertextes. Une image est souvent plus parlante qu'une phrase... et franchit les barrières linguistiques.
Une image peut servir de conteneur pour des liens multiples. Il suffit de définir un certain nombre de zones dans l'image et créer une carte, chaque zone activant un autre lien.
La diffusion de ce document sur Internet ou des serveurs BBS est autorisée, à condition qu'il le soit dans son intégralité et sans aucune modification. La diffusion sur des services en lignes commerciaux doit faire l'objet d'une autorisation de la part de l'auteur.
Les marques citées sont déposées par leurs propriétaires respectifs.
L'auteur dégage toute responsabilité en cas de dommages directs, indirects, accidentels ou consécutifs provenant d'informations erronées, et ce, même si l'auteur a été prévenu de la possibilité de tels dommages.
|
|
