Qu'est-ce qu'une balise Alt et comment l'utiliser ?

Les images contribuent à rendre votre site Web attrayant et attrayant. Cependant, si vous n'optimisez pas les images avec du texte alternatif (également appelé « texte alternatif » ou « balises alt »), vous manquerez une occasion clé d'améliorer l'expérience utilisateur et l'accessibilité de votre site.

Pour les utiliser correctement, il est important de comprendre d'abord ce que sont les balises alt. Dans cet article, nous discuterons de ce que sont les balises alt et pourquoi elles sont utilisées. Nous expliquerons également comment ajouter des balises alt aux images dans WordPress et présenterons quelques bonnes pratiques pour le faire.

Commençons!

Abonnez-vous à notre chaîne Youtube

Qu'est-ce qu'une balise Alt ?

Des balises Alt sont ajoutées aux images en HTML, pour décrire leur contenu et leur contexte sur la page Web. La balise alt apparaît également dans le conteneur d'images lorsque le fichier multimédia ne peut pas se charger ou s'afficher correctement :

Les balises Alt aident les personnes qui utilisent des lecteurs d'écran, comme les malvoyants, à comprendre le contenu de votre site Web. De plus, les robots des moteurs de recherche les utilisent pour interpréter vos images lors de l'exploration, de l'indexation et du classement de votre site.

Ajoutée dans la balise d'image, une balise alt de qualité est une brève description qui explique non seulement ce que l'image présente, mais son objectif sur la page. Lorsqu'elle est utilisée dans du code HTML, la balise d'image complète ressemble à ceci :

<img src="motorcycle-sunset.png" alt="Man in black and red checkered shirt riding an orange motorcycle at sunset."/>

Les balises alt d'image sont parfois confondues avec les titres ou les légendes des images. Cependant, les titres d'image sont un type d'attribut différent. Ils s'affichent sous forme de texte contextuel lorsqu'une personne passe la souris sur une image. D'autre part, les légendes apparaissent avec une image, généralement en dessous, et fournissent des informations ou des détails supplémentaires à son sujet. Dans des circonstances normales, les visiteurs ne verront jamais les balises alt de vos images.

Pourquoi utiliser des balises Alt sur les images ?

Les balises Alt ont plusieurs objectifs. Bien que vous ne soyez pas obligé de les utiliser, il y a des avantages majeurs à le faire. Étant donné qu'ils sont utilisés à la fois par les robots des moteurs de recherche et les outils de lecture d'écran, ils constituent un élément essentiel de l'accessibilité du Web et de l'optimisation des moteurs de recherche (SEO).

Ils améliorent l'accessibilité du Web

Les balises Alt permettent de garantir que les visiteurs peuvent accéder au contenu de votre site Web et en profiter, même lorsqu'ils utilisent une technologie d'assistance ou des navigateurs texte uniquement. Lorsqu'une personne ayant une déficience visuelle visite votre site Web, son lecteur d'écran lui lit le texte de la page. Quand il arrive à une image, il utilisera la balise alt pour décrire ce qu'est cette image.

Si la balise alt est manquante, le lecteur d'écran peut lire le nom du fichier image à la place. Non seulement cela est généralement inefficace pour expliquer correctement l'image, mais cela peut également être déroutant et perturbateur, en particulier si le nom du fichier n'a pas été optimisé pour le référencement.

Dans certains cas, comme lorsque vous laissez le champ de balise alt d'une image vide dans WordPress, le lecteur d'écran ignorera complètement cette image. En supposant que les images que vous incluez sur vos pages Web servent un objectif, cette absence signifie que le visiteur n'obtient pas la pleine valeur ou l'expérience que vous vouliez lors de la consommation de votre contenu.

Ils peuvent booster votre classement dans les moteurs de recherche

Les balises alt d'image peuvent vous aider à vous classer plus facilement pour les mots-clés que vous essayez de cibler. Les robots des moteurs de recherche sont intelligents, mais ils ne peuvent pas interpréter et comprendre les aspects visuels d'une image de la même manière que les humains.

Les attributs Alt offrent une alternative textuelle pour la traduction d'images, et plus particulièrement pour l'incorporation de mots-clés pertinents. Les descriptions textuelles contenant des mots-clés cibles peuvent augmenter vos chances d'être bien classé dans les recherches d'images.

Pour souligner le rôle important que les images (et, à leur tour, les balises alt) jouent dans le référencement, considérez la page de résultats des moteurs de recherche (SERP) pour « literie king size » :

La première page ne produit pas seulement des résultats textuels ; il y a aussi beaucoup de résultats d'image. Lorsqu'elles sont optimisées et utilisées correctement, les balises alt peuvent aider à améliorer votre référencement et à générer des images cliquables avec des liens hypertexte pour apparaître dans des recherches comme celles-ci. Ceci est particulièrement avantageux pour les sites de commerce électronique et les pages de destination.

Comment ajouter une balise Alt d'image dans WordPress

Une fois que vous avez compris les avantages de l'utilisation des attributs alt d'image sur votre site Web, il est temps d'apprendre à le faire. Heureusement, WordPress rend cette tâche incroyablement simple et directe.

Pour ajouter une balise alt d'image dans WordPress, connectez-vous à votre tableau de bord d'administration et accédez à la page ou à la publication à laquelle vous souhaitez ajouter votre image. Dans l'éditeur WordPress, cliquez sur l'icône plus et sélectionnez le bloc Image :

Ensuite, téléchargez votre image ou sélectionnez-en une dans votre médiathèque. Une fois que vous avez inséré l'image dans le bloc, le panneau Paramètres de l' image s'ouvrira dans la barre latérale à droite. Vous pouvez saisir votre description dans la zone de texte Alt :

Lorsque vous avez terminé, enregistrez vos modifications. Vous pouvez également le faire pour les images existantes. Par exemple, si vous souhaitez mettre à jour une image sur un article déjà publié sur votre site, cliquez simplement sur l'image et entrez votre nouvelle balise alt dans la barre latérale.

Comment ajouter une balise Alt d'image en HTML

Lorsque vous utilisez WordPress ou un autre CMS qui inclut un module pour ajouter et modifier des balises alt, il ajoutera automatiquement le code HTML pour vous. Cependant, si vous souhaitez ajouter le code vous-même, vous pouvez le faire facilement.

Pour ajouter une balise alt HTML dans WordPress, cliquez sur le bloc Image correspondant. Dans la barre d'outils des blocs, sélectionnez le bouton avec les trois points verticaux et choisissez Modifier en HTML :

Le code HTML affichera la balise image. Vous remarquerez que l'attribut alt est vide. Placez votre texte entre guillemets :

Lorsque vous avez terminé, cliquez sur le bouton Aperçu pour revenir à l'éditeur visuel, puis enregistrez vos modifications. Vous pouvez utiliser cette même syntaxe et le même format pour éditer la balise d'image HTML de n'importe quel fichier.

Conseils et bonnes pratiques pour écrire des balises Alt d'image

Lorsque vous créez vos balises alt, il y a quelques points clés à garder à l'esprit. Le respect de ces bonnes pratiques vous aidera à rendre vos balises alt plus efficaces :

• Soyez précis et descriptif. Le but des balises alt est de décrire l'image, vous voulez donc être aussi précis que possible. Si vous n'êtes pas sûr que votre description soit suffisante, réfléchissez à l'image que vous visualiseriez si vous ne voyiez que cette ligne de texte.
• Soyez bref. Bien que vous souhaitiez être détaillé, vous n'avez pas non plus besoin de faire de votre balise alt un long paragraphe (ou même une phrase complète). Visez environ 100 à 125 caractères maximum.
• Ne soyez pas redondant. Pour tirer le meilleur parti de votre balise alt, vous ne voulez pas inclure de mots inutiles. Cela inclut l'ajout de « Photo de » ou « Image de » avant la description. Ces éléments sont inutiles, car ils sont déjà implicites.
• Incorporez naturellement des mots clés pertinents . Considérez vos mots-clés cibles et, si possible, incorporez-les organiquement dans le contexte de la page. C'est plus facile lorsque vous utilisez des images très pertinentes qui correspondent au texte.
• Évitez le bourrage de mots clés. Bien que l'utilisation de mots-clés dans vos balises alt puisse améliorer le référencement, veillez à ne pas en faire trop. Le bourrage de mots-clés peut en fait nuire à votre référencement et produire une mauvaise expérience utilisateur.
• N'utilisez pas d'images à la place du texte. L'objectif principal d'une balise alt est de fournir un contexte textuel pour les machines qui ne peuvent pas traiter et interpréter les éléments visuels d'une page. Par conséquent, cela n'a pas de sens d'utiliser du texte dans les images, en particulier pour vos titres et titres de page.

Lorsque vous créez des balises alt pour vos images, n'oubliez jamais que l'objectif est de décrire l'image à ceux qui ne pourront peut-être pas la voir. Bien que la prise en compte du référencement et des mots-clés soit certainement une bonne idée, écrire vos balises alt en pensant à de vrais utilisateurs peut aider à générer des résultats plus positifs.

Conclusion

Les images peuvent aider à améliorer l'apparence de vos pages Web et à les rendre plus intéressantes, informatives et engageantes. Cependant, pour maximiser leur valeur, il est préférable de les compléter avec des balises alt. Ces explications brèves mais descriptives fournissent un contexte à la fois aux utilisateurs et aux moteurs de recherche. Les balises alt d'image aident à améliorer l'expérience utilisateur, à améliorer l'accessibilité et à faciliter le classement des mots clés pertinents.

Avez-vous d'autres questions sur ce qu'est une balise alt ou comment en ajouter une dans WordPress ? Faites-nous savoir dans la section commentaires ci-dessous!

Image présentée par Honza Hruby / shutterstock.com