Rédiger un texte alternatif qui exprime le rôle, pas les pixels
Décrivez ce que signifie l’image dans son contexte.
Rédiger un texte alternatif qui exprime le rôle, pas les pixels est une leçon Web Accessibility Academy gratuite sur CoddyKit. Ceci est la leçon 2 sur 4. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage Web Accessibility Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours Web Accessibility Academy comprend 4 leçons au total.
Certaines parties de cette leçon n'ont pas encore été traduites et s'affichent en anglais.
Describe Meaning, Not Looks
Good alt text describes what an image means in context, not a pixel-by-pixel account of every color and shape.
Purpose Over Pixels
Ask why the image is here. The answer is its purpose, and your alt text should deliver exactly that, nothing more.
Skip Image of
Do not start with image of or photo of. Screen readers already announce it is an image, so those words just waste time.
<img src="cat.jpg" alt="A tabby cat asleep on a keyboard">Keep It Tight
Aim for a short, complete phrase, usually under about 125 characters. If you need more, the image may be complex.
Context Changes Everything
The same dog photo might be a breed example or a happy-customer story. Let the surrounding context shape your words.
Images That Are Links
When an image is the only thing inside a link, its alt must describe the link destination, not just the picture.
<a href="/home"><img src="logo.svg" alt="Acme home"></a>Images of Text
If a graphic contains words, your alt text must include all of that text so nothing is lost to non-sighted users.
Do Not Repeat Nearby Text
If a caption right next to the image already says it, an empty alt avoids making screen readers hear it twice.
Write for Equivalence
Imagine reading your alt text aloud to someone on the phone. If they get the same point, you achieved true equivalence.
Avoid Keyword Stuffing
Alt text is not an SEO dumping ground. Cramming in keywords hurts real users and is exactly what good alt avoids.
Punctuation Helps Pacing
End alt text with a period. That small punctuation gives the screen reader a natural pause before moving on.
Quick Check
Pick the strongest alt text below.
Recap
Great progress! Strong alt text captures purpose in a tight phrase, skips image of, respects context, and never stuffs keywords.
Questions Fréquemment Posées
La leçon « Rédiger un texte alternatif qui exprime le rôle, pas les pixels » est-elle gratuite ?
Oui — le texte complet de « Rédiger un texte alternatif qui exprime le rôle, pas les pixels » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours Web Accessibility Academy, passe à CoddyKit PRO. Le cours Web Accessibility Academy comprend 4 leçons au total.
Qu'est-ce que j'apprendrai dans « Rédiger un texte alternatif qui exprime le rôle, pas les pixels » ?
Décrivez ce que signifie l’image dans son contexte. Tu pratiques Web Accessibility Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.
Dois-je avoir de l'expérience pour commencer Web Accessibility Academy ?
Aucune expérience préalable n'est requise. Web Accessibility Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 2 sur 4.
Combien de temps prend la leçon « Rédiger un texte alternatif qui exprime le rôle, pas les pixels » ?
La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.
Peux-tu écrire et exécuter du code dans cette leçon Web Accessibility Academy ?
Oui. Chaque leçon Web Accessibility Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.
Toutes les leçons de ce cours
- Informatif ou décoratif : la première décision
- Rédiger un texte alternatif qui exprime le rôle, pas les pixels
- Attribut alt vide et image décorative masquée
- Images complexes : graphiques, cartes et longues descriptions