Le monde du web s’avère être un espace vivant et dynamique, où l’information est souvent représentée à travers une combinaison de texte et de médias visuels. C’est ici que la balise img fait son entrée, servant de pont entre le code HTML et l’aspect visuel d’un site web. Au cœur de la structure HTML, la balise img joue le rôle indispensable de l’intégrateur de médias.
Utiliser la balise img
La balise img, ou image, permet d’intégrer des images dans une page HTML. Sa syntaxe est simple et directe :
L’attribut src spécifie l’URL de l’image à intégrer, tandis que l’attribut alt fournit une description de l’image qui sera affichée dans le cas où l’image ne pourrait pas être chargée.
Cet attribut est essentiel pour l’accessibilité du web, aidant les utilisateurs malvoyants et les moteurs de recherche à comprendre le contenu de l’image.
L'usage de la balise img en pratique
Pour donner vie à ces explications, illustrons l’utilisation de la balise img à travers deux exemples.
Intégrer une image locale : Supposons qu’une image nommée “paysage.jpg” soit stockée dans un dossier nommé “images” au même niveau que votre fichier HTML. L’intégration de cette image se ferait comme suit :
<img src="images/paysage.jpg" alt="Une belle image d'un paysage naturel">
Intégrer une image en ligne : Imaginons maintenant que l’image à intégrer se trouve en ligne. Il suffit alors de spécifier l’URL de l’image comme source :
<img src="https://exemple.com/images/paysage.jpg" alt="Une belle image d'un paysage naturel">
Autres balises liées à l'intégration de médias
Au-delà de la balise img, HTML offre d’autres balises pour intégrer différents types de médias. La balise <audio> permet d’intégrer des fichiers audio, tandis que la balise <video> permet d’intégrer des vidéos. Chacune de ces balises a des attributs spécifiques pour contrôler la lecture des médias, offrant ainsi une grande flexibilité dans la présentation du contenu multimédia.
Ce qu'il y a à retenir
La balise img est un outil puissant qui donne vie et couleur aux pages web. Elle renforce la communication, permettant aux concepteurs de sites web d’exprimer des idées et des émotions qui vont au-delà des mots. Elle incarne une part de l’âme du web, où l’information devient une expérience sensorielle engageante.
Lexique des termes techniques
Balise img : Balise HTML utilisée pour intégrer des images dans une page web.
Attribut src : Attribut de la balise img qui spécifie l’URL de l’image à intégrer.
Attribut alt : Attribut de la balise img qui fournit une description de l’image, essentielle pour l’accessibilité du web.
Balise audio : Balise HTML utilisée pour intégrer des fichiers audio dans une page web.
Balise video : Balise HTML utilisée pour intégrer des vidéos dans une page web.
URL : Acronyme de Uniform Resource Locator, il s’agit de l’adresse d’une ressource (page web, image, fichier audio, etc.) sur internet.