1. Description de la balise <img>

La balise <img> est une balise HTML utilisée pour insérer des images dans une page web. Elle ne possède pas de balise de fermeture correspondante (c'est une balise autonome ou autofermante en HTML), et elle est principalement utilisée pour spécifier l'emplacement de l'image à afficher sur la page. Voici une description détaillée de ses attributs les plus couramment utilisés :

2. Liste des attributs de la balise <img>

La balise <img> en HTML possède plusieurs attributs que vous pouvez utiliser pour contrôler le comportement et l'apparence de l'image. Vous pouvez aussi choisir les attributs appropriés en fonction de vos besoins spécifiques pour chaque image que vous incluez dans votre page web. Voici une liste des attributs les plus couramment utilisés avec cette balise :

1. src (source) : Spécifie l'URL de l'image à afficher.
2. alt (texte alternatif) : Fournit une description textuelle de l'image pour l'accessibilité et les moteurs de recherche.
3. width (largeur) : Définit la largeur de l'image en pixels.
4. height (hauteur) : Définit la hauteur de l'image en pixels.
5. title (titre) : Fournit un titre optionnel pour l'image, affiché en tant qu'info-bulle lorsque l'utilisateur survole l'image.
6. align (alignement) : Utilisé précédemment pour spécifier l'alignement de l'image par rapport au texte environnant (obsolète en HTML5).
7. border (bordure) : Utilisé précédemment pour spécifier une bordure autour de l'image (obsolète en HTML5).
8. loading (chargement) : Spécifie comment l'image doit être chargée. Les valeurs possibles sont "auto", "eager", et "lazy". "auto" est la valeur par défaut, "eager" indique un chargement immédiat, tandis que "lazy" retarde le chargement de l'image jusqu'à ce qu'elle soit visible à l'écran (pour améliorer les performances).
9. decoding (décodage) : Indique comment l'image doit être décodée. Les valeurs possibles sont "async", "sync", et "auto". "async" est souvent utilisé pour un décodage asynchrone.
10. loading (chargement) : Définit le comportement de chargement de l'image. Les valeurs possibles sont "auto" (par défaut), "eager" (chargement immédiat) et "lazy" (chargement différé).
11. ismap (image map) : Utilisé avec les images cartographiques (utilisées pour créer des liens cliquables sur certaines parties de l'image).
12. usemap (utilisation de carte) : Pointe vers une carte d'image (utilisée avec l'attribut "ismap").

3. Syntaxe et exemples d'usages de la balise img

3.1 Syntaxe

3.2 Exemples d'usages de la balise <img>

Exemple (Attribut alt)

Exemple (Attribut title)

Younes Derfoufi
CRMEF OUJDA