Sélectionner une page
balise alt image text

Si vous vous êtes déjà demandé pourquoi vous devriez utiliser un texte alternatif dans la balise ALT «img» de votre site Web et que vous avez besoin de conseils sur la façon de le faire, vous êtes au bon endroit. Cet article de blog vous fournira toutes les informations et exemples dont vous avez besoin pour commencer à travailler sur l’accessibilité et l’optimisation des moteurs de recherche afin que votre site soit convivial et plus facile à trouver en ligne.

Pourquoi devriez-vous utiliser un texte alternatif (alt)?

1. Pour rendre votre site Web accessible aux utilisateurs malvoyants

Il existe des applications de lecture d’écran qui décrivent et traduisent tous les éléments de votre site Web et pour certains utilisateurs, c’est le seul moyen de naviguer sur Internet. Il trouve des boutons, des liens et des images, puis utilise les attributs fournis par eux pour expliquer leur signification à l’utilisateur dans le cas d’images, c’est un attribut «alt» qui décrit le contenu de l’image. N’oubliez pas que pour certaines personnes, votre description précise est la seule option pour interagir avec ce que vous voyez et savoir à quoi vous faites référence.

2. Pour aider les personnes dont la connexion Internet est plus lente

Le texte alternatif s’affiche comme espace réservé pour une image avant son chargement. Cet espace réservé fournit non seulement la description de ce que contient l’image, mais permet également à l’utilisateur de savoir qu’il devrait y avoir une image.

3. Pour améliorer votre référencement

Avant de faire appel à une agence de référencement naturel améliorez votre site internet. Comme la balise canonical, la balise ALT peut améliorer votre référencement. Sans un attribut «alt», votre site Web sera reconnu comme n’étant pas accessible cela entraîne une perte de score significative dans les tests de référencement. «Alt» contient également des mots-clés pour les robots d’indexation de votre site. Grâce à ces mots-clés, les images peuvent être trouvées dans l’onglet « images » sur Google et voir vos graphiques sur la première page de Google est ce que nous recherchons tous.

Comment utiliser un texte alternatif meilleures pratiques.

Ne commencez pas une description par «Image de…» ou «Image de…» . Les lecteurs d’écran reconnaissent déjà la balise «img» comme une image et sonne comme «Image, Image d’un grand bâtiment». Cela semble non seulement étrange, mais peut également être déroutant pour l’utilisateur.

Utilisez des mots-clés, mais faites-le avec prudence, gardez-le propre et descriptif. Ces mots-clés sont nécessaires pour les robots d’exploration Googlebots, qui sont responsables du positionnement sur les résultats de recherche. N’oubliez pas que le texte doit fournir des informations sur le contenu de l’image, les mots aléatoires ne le feront pas. 

Gardez à l’esprit que «alt» ne doit pas inclure de mots clés faisant référence à votre article ou site, il doit uniquement faire référence au contenu d’image. Si votre article porte sur la natation hivernale, cela ne signifie pas que vous pouvez inclure «natation hivernale» dans le texte alternatif de la photo montrant un lac. Le bourrage de mots-clés peut non seulement entraîner une expérience utilisateur négative, mais peut même signifier que votre site est considéré comme du spam.

Le texte alternatif ne peut pas dépasser 125 mots. Cette limite résulte des lecteurs d’écran qui ne sont capables de lire que beaucoup de texte. De plus vous n’avez pas besoin de plus n’oubliez pas de garder les choses simples et directes.

Votre description doit fournir un contexte à ce qui se passe dans l’image. Faisons quelques expériences – essayez d’imaginer une scène basée sur le texte que je fournis.

Fermez les yeux et imaginez un «chien gris sur la neige».

Terminé ? Ok, excellent travail!

Maintenant, essayez d’imaginer «un husky aux yeux bleus s’amusant le jour de l’hiver à Central Park».

Mieux, n’est-ce pas ?

Essayez d’être précis. Comme dans l’exemple ci-dessus, n’écrivez pas: «Un homme debout à côté d’un bâtiment» soyez aussi précis que possible. Est-il un pompier en attente de répondre à un appel à l’aide ? Ou un homme d’affaires qui vient de quitter un immeuble de bureaux bien connu à Wall Street ? Si vous essayez de penser de cette manière, il vous sera également plus facile de trouver les mots-clés appropriés.

Parfois, les images contiennent des phrases. Il va sans dire que si vous avez suffisamment de caractères, vous devez écrire des phrases complètes. Au lieu d’écrire «Confucius, citation célèbre», essayez de réécrire le texte réel dans le «alt».

Toutes les images n’ont pas besoin de texte alternatif. Certaines images servent de décoration – par exemple comme des séparateurs entre les sections de votre site Web ou comme des puces sur une liste. Dans ces cas, laissez simplement le «alt» vide.

Les attributs vides empêcheront votre site Web d’obtenir des scores SEO inférieurs et ne seront pas déroutants pour les utilisateurs. Dans le cas de boutons avec des icônes, fournissez à l’utilisateur un texte descriptif par exemple «Aller au blog» ou s’il vous redirige vers une autre page, une URL descriptive dans l’attribut «href» suffira.

Points clés à retenir

En conclusion, l’attribut alt est plus important que ne le supposent de nombreux développeurs. Il existe encore des dizaines de sites Web qui ne l’incluent pas, mais beaucoup le prennent déjà très au sérieux. Facebook a même créé une IA qui non seulement filtre le contenu interdit, mais remplit également «alt» une description d’une image, reconnaissant le texte et le réécrivant en attributs.

J’espère vous avoir donné suffisamment de raisons pour vous convaincre de commencer à utiliser des alts d’image et une bonne explication des meilleures pratiques, donc si votre site manque encore de bonnes alts, c’est le moment idéal pour commencer. Bonne chance !

Pour tout renseignement sur nos services d’agence digitale à Montpellier. Contactez-nous via le chat de notre site web du lundi au vendredi de 9h00 à 18h00

Demander un devis Solutions Développement I Solutions Design Graphique I Solutions Marketing Digital I Blog