Auteur: Jérôme Forget. Publié le 4 décembre 2006.
Lorsqu'utilisée judicieusement, les images ajoutées dans une page Web rendent le document plus attirant et plus professionel, plus informatif et facile à naviguer. Par contre, utilisées à outrance, les images peuvent rendre le document confus, inaccessible, en plus d'être terriblement long à télécharger.
Ni HTML ni XHTML ne prescrivent un format particulier pour les images. Cependant, comme les navigateurs supportent tous bien les formats GIF et JPEG, ceux-ci se sont vite imposés comme des standards sur le Web. De nos jours, les images au format PNG sont aussi supportées par la majorité des navigateurs modernes (à l'exception de MSIE 6 qui ne supporte toujours pas la transparence des PNG).
La balise <img> permet d'insérer une image dans une page Web. Cette balise doit être auto-fermée en XHTML (<img />).
La balise <img> doit être utilisée avec l'attribut src qui permet d'indiquer l'URL de l'image à afficher.
<img src="images/fleur.jpg" />
En XHTML, l'attribut alt (qui permet d'afficher du contenu texte alternatif si l'image n'arrive pas à s'afficher) est obligatoire.
<img src="images/fleur.jpg" alt="une jolie fleur" />
Dans le cas d'une image ne servant pas le contenu ou le propos du document (une image GIF pour un coin arrondi par exemple), il est possible de laisser vide l'attribut alt (cela est nécessaire étant donné que la présence de l'attribut est obligatoire).
<img src="images/coin.gif" alt="" />
L'élément img convient bien pour insérer un graphique, un logo, une photographie ou une illustration servant à appuyer le texte. Pour intégrer des images d'arrière-plan ou créer des effets graphiques, il est préférable d'avoir recours aux feuilles de style CSS.