5568 sujets

Sémantique web et HTML

Internet explorer: collision entre les attributs alt et title

Bonjour,

J'ai le code suivant:

<a href ="#" title = "Descriptif du lien"><img src = "..." alt = "Descriptif de l'image" /></a>


Comme on le sait, normalement le contenu de alt ne doit s'afficher que si l'image est introuvable. Malheureusement, cet imbécile d'IE croit bon d'afficher systématiquement le alt dans une info-bulle. En soit, c'est pas grave du tout. Le problème survient lorsque, comme dans le code présenté ci-dessus, cet image est encapsulée dans un lien qui a son propre descriptif. IE continue d'afficher le contenu de alt plutôt que de celui de title. Je ne sais pas trop comment régler le problème.

Je pourrai bien sûr virer complètement l'attribut alt de l'image, mais je ne serai alors plus conforme avec la norme stricte de l'html. J'ai essayé de mettre un attribut alt vide (alt = ""), mais à ce moment là, IE n'affiche plus du tout d'info-bulle. Je pourrai en dernier recours, mettre le même contenu dans alt et title, mais ça me parait stupide. alt est sensé décrire l'image, title lui doit décrire l'action associée au lien, ça n'a vraiment rien à voir. D'autant plus que dans mon cas, le descriptif dans title peut être long (voir très long) et le copier deux fois alourdirait inutilement la taille de la page html.

Une idée?
Modifié par twkjp (09 Jul 2006 - 18:00)
Bonjour twkjp,

As-tu essayé de placer un title="" comme attribut de l'img ?
Cela reglèra peut-être le problème.
Modifié par Mathieu_vd (09 Jul 2006 - 21:08)
<a href ="#" title = "Descriptif du lien"><img src = "..." alt = "Descriptif de l'image" /></a>


Bonjour,

Tous ces espaces sont-ils présents dans ton code ? Si c'est le cas, je rappelle qu'un attribut HTML et sa valeur ne doivent pas être séparés par des espaces.

Version corrigée :
<a href="#" title="Descriptif du lien"><img src="..." alt="Descriptif de l'image" /></a>
L'attribut alt n'est pas sensé décrire l'image : il est là pour fournir une alternative à sa fonction. Si ton image est dans un lien, alors sa fonction n'est pas égale à sa description. Je vais prendre l'exemple classique d'une icône de maison pour symboliser le retour à la page d'accueil. Dans ce cas, tu ne dois pas mettre alt="Maison" et écrire dans ton lien title="retour à la page d'accueil". La fonction de ton image est de faire un lien vers la page d'accueil? Soit. Alors, en plus du title de ton lien, écris alt="Retour à la page d'accueil".

Le alt n'est pas un descriptif de l'image, mais une alternative à sa fonction (ce qui explique d'ailleurs pourquoi, dans le cas d'images décoratives comme un portrait d'homme politique en regard du texte de son discours, on écrit alt="").
Bonjour,

J'approuve bruyemment (clap clap clap) Gilles, surtout pour l'exemple du portrait auquel on pourrait rajouter les "logo de l'entreprise", "image de l'article", "puce bleue","trait horizontal","Photo de monsieur le maire" et autres joyeusetés du même acabit...

On ne le dira jamais assez : L'objectif n'est pas de "donner à voir" avec des mots mais de "donner à comprendre" le sens ajouté au contenu par l'image.

Par ailleurs, lorsqu'une alternative d'image est lue par une synthèse vocale, le visiteur ne sait pas qu'il s'agit d'une image, de son point de vue ce n'est qu'une partie de la phrase, du paragraphe, ou du texte en cours de lecture.

De même, lorsque vous regardez une page avec les images désactivées, rien ne vous indique qu'il s'agit d'une image.

Le meilleur résultat est obtenu lorsque l'alternative s'insère naturellement dans le cours de la lecture.

Pour les images liens c'est, comme le dit Gilles, la fonction qui est intéressante.

L'utilisateur n'aura que faire de savoir que le lien image pour lire un article c'est une "flêche" un "plus", un "petit journal" ou "Une grand-mère à vélo", en revanche il sera très intéréssé de savoir qu'en cliquant dessus il va "lire l'article..." en rajoutant autant que possible le titre en question, ou une forme abrégée mais compréhensible si c'est vraiment trop long (80 caractères).

Jean-pierre
Excellente remarque de Gilles. Donc en fait je n'en verrais pas trop l'utilité, les deux devraient donner la même info puisqu'il s'agit les deux fois d'indiquer la fonction du lien.
Hello,

Donc, si je comprends bien, les valeurs des attributs title et alt d'une image doivent logiquement toujours être indentiques.
Le premier affiche une info bulle; le deuxième servira d'alternative si l'image n'est pas affichée.

J'ai bien compris ? Smiley confused
Pas forcément, mais pour moi dans le cas que tu évoques, l'alt de l'image doit indiquer la fonction de l'image et donc du lien, et le title du lien doit afficher aussi la fonction du lien.
a écrit :
Donc, si je comprends bien, les valeurs des attributs title et alt d'une image doivent logiquement toujours être indentiques.
Le premier affiche une info bulle; le deuxième servira d'alternative si l'image n'est pas affichée.


Si tu as par exemple un logo en lien avec le nom de l'entreprise dessus,
il est clair que le alt doit reprendre le nom du logo en priorité avec eventuellement la desciption de la cible du lien.
Hermann a écrit :
Donc, si je comprends bien, les valeurs des attributs title et alt d'une image doivent logiquement toujours être indentiques.
Le premier affiche une info bulle; le deuxième servira d'alternative si l'image n'est pas affichée.


Si tu as par exemple un logo en lien avec le nom de l'entreprise dessus,
il est clair que le alt doit reprendre le nom du logo en priorité avec eventuellement la desciption de la cible du lien.

Non, justement, c'est exactement le contraire: dans ce cas, le alt doit reprendre la fonction du lien en priorité avec éventuellement le nom du logo! La fonction prime sur la description...
Modifié par Gilles (12 Jul 2006 - 09:40)
J'ajouterais que si le alt de l'image explique clairement la fonction du lien, il n'y a pas besoin du title dans la balise <a>...
Modifié par Nathan- (08 Aug 2006 - 13:38)
Sujet clos
Aller à