DébutantNon commencé
Exercice 2.3 · 8 min · 0 tentative
Ta première image
🎯 Objectif
Afficher une image dans ta page — et la rendre accessible à tout le monde grâce au texte alternatif.
📖 Exemple
La page du concours de châteaux de sable affiche sa photo vedette — le code, et ce que le navigateur en fait :
<img src="/images/nuxy/mini/nuxy-chateau-sable.png" alt="Nuxy construit un château de sable">
Pourquoi deux attributs ? src (source) indique le fichier à afficher, et alt (alternative) le décrit en mots. Ce texte n'est pas optionnel :
- 🦯 les lecteurs d'écran le lisent aux personnes malvoyantes
- 📶 il s'affiche si l'image ne charge pas
- 🔍 les moteurs de recherche s'en servent pour comprendre ta page
Remarque aussi : <img> est une balise orpheline, elle ne se ferme pas. Et une image sans alt, c'est un bout de ta page invisible pour certains visiteurs.
📝 Consigne
Sous le titre fourni, affiche une autre mascotte :
- L'image dont le chemin est
/images/nuxy/mini/nuxy-abeille.png— recopie-le tel quel - Son texte alternatif décrit ce qu'on voit, au mot près : Nuxy déguisé en abeille
Résultat attendu
La mascotte déguisée en abeille s'affiche sous le titre.
Ce qui est vérifié
- Afficher une image avec la balise <img>
- Afficher la mascotte déguisée en abeille
- Décrire l'image avec le texte alternatif de la consigne
- Afficher une seule image
- Respecter la structure de la page (doctype, head, body)
- Fermer toutes les balises ouvertes
Indices (0/3)
Indice 1 verrouillé
Indice 2 verrouillé
Indice 3 verrouillé