Introduction au HTML : structure de base, balises et attributs : balises d'image (img)

HTML, ou Hyper Text Markup Language, est le langage de balisage standard pour la création de pages Web. La structure de base d'un document HTML se compose de balises, qui sont utilisées pour définir des éléments, et d'attributs, qui sont utilisés pour spécifier les caractéristiques de ces éléments.

Les balises HTML constituent la base de toute page Web. Ils sont utilisés pour créer et organiser le contenu d'une page, notamment du texte, des images, des liens, des listes, des tableaux, etc. Chaque balise est représentée par un ensemble de caractères entourés de crochets (< et >). Par exemple, le champ <h1> permet de définir un titre de niveau 1, le <p> est utilisé pour définir un paragraphe et le <img> est utilisé pour insérer une image.

La balise d'image <img> est l'une des balises les plus importantes du HTML. Il vous permet d'insérer des images dans votre page Web, la rendant plus attrayante et informative. Le <img> est une balise vide, ce qui signifie qu'elle n'a pas de balise de fermeture. Au lieu de cela, il utilise des attributs pour spécifier l'image à afficher et d'autres caractéristiques de l'image.

Comment utiliser la balise d'image <img>

Pour insérer une image sur votre page Web, vous devez utiliser le bouton <img> avec l'attribut 'src'. L'attribut 'src' spécifie l'URL de l'image que vous souhaitez afficher. Par exemple :

<img src="imagem.jpg">

Dans cet exemple, l'image 'imagem.jpg' sera affichée sur la page Web. L'image doit se trouver dans le même répertoire que le fichier HTML, ou vous devez spécifier le chemin complet de l'image.

Attributs des balises d'image <img>

En plus de l'attribut 'src', l'attribut <img> prend également en charge plusieurs autres attributs. Les plus courants sont « alt », « width » et « hauteur ».

L'attribut 'alt' est utilisé pour spécifier un texte alternatif pour l'image, qui sera affiché si l'image ne peut pas être chargée. Il s'agit d'un attribut important pour l'accessibilité car il permet aux utilisateurs de lecteurs d'écran de comprendre le contenu de l'image. Par exemple :

<img src="imagem.jpg" alt="Description de l'image">

Dans cet exemple, si l'image ne peut pas être chargée, le texte « Description de l'image » sera affiché à la place.

Les attributs 'width' et 'height' sont utilisés pour spécifier respectivement la largeur et la hauteur de l'image. Ils sont spécifiés en pixels. Par exemple :

<img src="imagem.jpg" alt="Description de l'image" width="500" height="300">

Dans cet exemple, l'image sera affichée avec une largeur de 500 pixels et une hauteur de 300 pixels.

En bref, la balise d'image <img> C'est un élément essentiel de toute page Web. Il vous permet d'insérer des images dans votre page, la rendant plus attrayante et informative. Lorsque vous utilisez la balise <img>, il est important de penser à utiliser l'attribut 'alt' pour améliorer l'accessibilité et les attributs 'width' et 'height' pour contrôler la taille de l'image.