L'attribut alt d'une image est l'un des éléments les plus simples du web, et l'un des plus mal utilisés. Trop souvent vide, trop souvent bourré de mots-clés, trop souvent copié-collé depuis le nom de fichier. Résultat : une perte de trafic organique et une expérience dégradée pour les utilisateurs qui dépendent des technologies d'assistance.
Bonne nouvelle : bien rédiger un alt-texte s'apprend vite. Ce guide vous donne la méthode complète, avec des exemples concrets.
Qu'est-ce qu'un alt-texte et à quoi ça sert vraiment ?
L'attribut alt (pour "alternative text") est un attribut HTML qui accompagne la balise <img>. Il contient une description textuelle de l'image, par exemple : alt="Atelier de céramique à Lyon : mains modelant un bol en argile sur un tour".
Il remplit trois fonctions simultanées.
L'accessibilité : les personnes malvoyantes ou non-voyantes utilisent des lecteurs d'écran (comme NVDA ou VoiceOver) qui lisent le contenu de la page à voix haute. Sans alt-texte, l'image devient invisible pour elles, ou pire, le lecteur annonce simplement "image" ou le nom de fichier ("DSC_0042.jpg").
Le SEO : Google ne "voit" pas les images. Il les comprend via les alt-textes, les noms de fichiers, le contexte de la page. Un alt-texte bien rédigé aide les moteurs de recherche à indexer vos images et à les faire apparaître dans Google Images, une source de trafic sous-estimée. C'est l'une des dimensions concrètes du profil EEAT : un site soigné dans ses détails techniques inspire davantage confiance.
Le fallback : si une image ne charge pas (connexion lente, erreur serveur), le navigateur affiche le texte alt à la place. L'utilisateur comprend ce qu'il manque.
La méthode pour rédiger un bon alt-texte
La question à se poser
Avant d'écrire, posez-vous cette question : "Si cette image ne s'affichait pas, quelle information l'utilisateur perdrait-il ?"
C'est la réponse à cette question qui constitue votre alt-texte. Pas le contexte global de la page, pas vos mots-clés : l'information spécifique que cette image apporte.
La structure efficace
Un bon alt-texte suit généralement cette structure : [Sujet de l'image] + [action ou contexte] + [détail pertinent si nécessaire].
❌ alt="photo agence web" : trop vague.
❌ alt="agence web SEO référencement naturel La Rochelle agence digitale" : bourrage de mots-clés.
✅ alt="L'équipe de l'agence Héphaistos lors d'un atelier de travail autour d'une table" : précis, naturel, utile.
La règle des 125 caractères
La plupart des lecteurs d'écran coupent la lecture de l'alt-texte après environ 125 caractères. Restez concis. Si l'image nécessite une description très longue (infographie, graphique complexe), utilisez l'attribut longdesc ou décrivez l'image dans le corps du texte adjacent.
Les 5 types d'images et comment les traiter
1. Images informatives
Elles transmettent une information visuelle essentielle : photos de produits, portraits, illustrations pédagogiques. Décrivez ce qu'on voit avec précision, en incluant les éléments importants pour comprendre le contexte.
✅ alt="Capture d'écran du tableau de bord Google Analytics 4 affichant le rapport d'acquisition de trafic"
2. Images décoratives
Elles servent uniquement à l'habillage visuel : séparateurs, fonds, formes abstraites. Laissez l'attribut alt vide : alt="". Ce n'est pas la même chose que d'omettre l'attribut : un alt vide indique explicitement au lecteur d'écran d'ignorer l'image.
3. Images-liens
Quand une image est cliquable (logo qui renvoie à l'accueil, icône de réseau social), l'alt-texte doit décrire la destination du lien, pas l'image elle-même.
❌ alt="logo Twitter bleu" sur un lien vers Twitter.
✅ alt="Suivre Héphaistos sur Twitter" ou alt="Page Twitter de l'agence Héphaistos".
4. Images contenant du texte
Infographies, captures d'écran avec du texte, citations visuelles. Le texte visible dans l'image doit être reproduit intégralement dans l'alt-texte, ou mieux, fourni en texte réel dans la page.
✅ alt="Infographie : les 5 étapes du processus de création d'un site web selon l'agence Héphaistos : Brief, Maquette, Développement, Tests, Mise en ligne"
5. Images complexes (graphiques, schémas)
Tableaux de données visuels, diagrammes, graphiques statistiques. L'alt-texte donne le titre et la conclusion principale. La description détaillée est fournie dans le texte de la page ou via un lien vers une version textuelle.
✅ alt="Graphique en barres : évolution du trafic organique 2023-2025, hausse de 40% sur 2 ans"
Les erreurs les plus fréquentes
Laisser l'attribut alt absent
<img src="photo.jpg"> sans attribut alt est différent de alt="". Sans l'attribut, le lecteur d'écran lira le nom du fichier, souvent inutile ou absurde.
Dupliquer le texte adjacent
Si la légende sous l'image dit "Vue de l'atelier en janvier 2025", inutile de mettre la même chose dans l'alt. Combinez les informations ou simplifiez l'alt pour éviter la répétition.
Commencer par "Image de..." ou "Photo de..."
Les lecteurs d'écran annoncent déjà "image" avant de lire l'alt. Commencer votre description par ces mots crée une redondance. Allez directement au contenu.
❌ alt="Photo d'un bureau avec des plantes vertes"
✅ alt="Bureau lumineux avec des plantes vertes disposées sur les étagères"
Bourrer de mots-clés
alt="agence web SEO design graphique La Rochelle pas cher" : Google pénalise le keyword stuffing dans les alt-textes comme dans le reste du contenu. Rédigez pour l'utilisateur, pas pour l'algorithme. La pertinence naturelle suffit amplement.
Alt-textes et SEO : ce que Google regarde vraiment
Pour Google, l'alt-texte est l'un des plusieurs signaux qui l'aident à comprendre une image. Les autres : le nom du fichier (utilisez des tirets, pas des underscores : atelier-ceramique-lyon.jpg), le texte environnant, la balise <title> de la page, et les données structurées Schema.org pour les produits ou recettes.
Un alt-texte bien rédigé améliore votre visibilité dans Google Images, particulièrement pertinent si votre activité est visuelle (design, photographie, décoration, cuisine, mode). C'est aussi un signal de qualité globale que Google intègre dans l'évaluation de l'expérience de page, au même titre que les Core Web Vitals ou la structure des contenus.
Outils pour auditer vos alt-textes existants
WAVE (Web Accessibility Evaluation Tool) : extension Chrome gratuite qui signale toutes les images sans alt-texte ou avec des alt-textes suspects sur n'importe quelle page.
Résultat de l'audit WAVE réalisé sur cet article : 0 erreur, 0 alerte, score AIM de 10/10.
Google Lighthouse : intégré à Chrome DevTools, il inclut un audit d'accessibilité qui détecte les images sans texte alternatif.
Screaming Frog SEO Spider : pour les audits en masse sur des sites entiers. Il exporte toutes les images, leurs URLs et leurs alt-textes dans un fichier CSV. La version gratuite couvre 500 URLs.
Semrush Site Audit et Ahrefs Site Audit signalent les images manquantes d'alt-texte dans le cadre de l'audit technique global. Retrouvez notre sélection complète dans le guide des outils analytics.
FAQ — Alt-textes
Dois-je mettre un alt-texte sur toutes les images de mon site ?
Oui, l'attribut alt doit être présent sur toutes les balises <img>. Pour les images décoratives, laissez-le vide (alt=""). Pour les images informatives, rédigez une description pertinente.
Mon CMS (WordPress, Shopify...) gère-t-il les alt-textes automatiquement ?
Non. La plupart des CMS proposent un champ alt-texte lors de l'import d'une image, mais ne le remplissent pas automatiquement, ou utilisent le nom de fichier. C'est à vous de le rédiger à chaque upload.
Les alt-textes comptent-ils beaucoup pour le SEO ?
Ils contribuent, sans être le facteur le plus puissant. Leur impact est plus marqué pour le référencement dans Google Images et pour l'accessibilité. Sur un site avec beaucoup d'images non renseignées, les corriger peut avoir un effet visible sur le trafic organique.
Faut-il inclure des mots-clés dans les alt-textes ?
Seulement si c'est naturel et pertinent. Si votre image représente un élément directement lié à votre mot-clé cible, incluez-le. Si vous devez forcer l'insertion, ne le faites pas : ça ne trompera pas Google et ça dégradera la qualité de l'alt-texte pour les utilisateurs.
Les images en CSS ont-elles besoin d'alt-textes ?
Non. Les images de fond appliquées via CSS (background-image) ne sont pas des éléments HTML et n'ont pas de balise alt. C'est d'ailleurs une bonne raison de ne pas mettre d'images informatives en CSS : elles seront invisibles aux moteurs de recherche et aux lecteurs d'écran.
Conclusion
Rédiger de bons alt-textes, c'est 5 à 10 secondes de travail par image, pour un bénéfice double : un site plus accessible pour vos visiteurs et un meilleur référencement pour vos images. C'est le genre de détail qui distingue un site soigné d'un site bâclé.
Si vous avez un site avec des centaines d'images existantes sans alt-textes, commencez par les pages les plus stratégiques (homepage, pages de services, articles les plus visités) et progressez ensuite.
Vous voulez un audit complet de l'accessibilité et du SEO technique de votre site ?Contactez l'agence Héphaistos pour un diagnostic personnalisé.
Article publié en 2026 | Héphaistos — Agence web & SEO
