Balise HTML < img>: attribut title vs attribut alt?
J'ai été la navigation Amazon et j'ai remarqué que lors de la recherche "1 TO" si vous placez le curseur de la souris sur les étoiles de notation de l'image, vous ne verrez que le score si l'utilisation d'IE. Si vous utilisez un autre navigateur, puis le score de ne pas s'afficher.
Une note de 3.8 et une note de 4.2 à la fois se présenter comme de 4 étoiles. Des cours de 3,8 stars vs 4.2 étoiles (76% vs 84% score) pourrait faire une différence!
C'est parce que le standard de l'affichage alt
texte est uniquement lorsque l'utilisateur désactive les graphiques ou lorsque le navigateur est "à lire" (e.g navigateur pour les utilisateurs déficients visuels). IE cependant, montre il sur le vol stationnaire.
Donc je pense que si Amazon est de montrer quel que soit le navigateur de l'utilisateur, puis title
devrait être utilisé en plus de alt
. Seriez-vous d'accord?
Vous devez vous connecter pour publier un commentaire.
J'irais pour les deux. Le titre de la montrer une belle bulle d'aide dans tous les navigateurs et alt donnera une description lors de la navigation dans un navigateur sans les images.
Cela dit, j'aimerais voir quelques stats du nombre de "surfeurs" y va d'un "store" pour parcourir les marchandises effectivement avoir désactivé les images ou utilisez un navigateur qui ne supporte pas les images. Je pense que le jour où 90% de la population est à l'aide d'un modem 28k pour se connecter à l'InterWeb est looooong plus.
Ils sont utilisés pour des choses différentes. Le
alt
attribut est utilisé au lieu de l'image. Si l'image ne peut pas être affichée, ou (je crois) dans les lecteurs d'écran.La
title
attribut est montré le long de avec l'image, généralement sous la forme d'une info-bulle d'aide.On ne devrait pas être utilisé "au lieu de" de l'autre. Chacun doit être utilisé correctement, faire les choses qu'ils ont été conçus pour faire.
<img>
balise, vous devez utiliser les CSS de la div à la place 😉alt et titre sont des choses différentes, comme déjà mentionné. Alors que le titre attribut permettra d'avoir une info-bulle, alt est également un attribut important, car il définit le texte à afficher si l'image ne peut pas être affichée. (Et dans certains navigateurs, comme firefox, vous verrez également ce texte tout l'image de charges)
Un autre point que je pense devrait être faite est que la alt attribut est nécessaire pour valider un document XHTML, alors que la titre attribut est juste une "option supplémentaire", comme elle l'avait fait.
C'est parce qu'ils servent à des fins différentes et ils ont tous deux devraient être utilisées non seulement l'un sur l'autre.
La touche "alt" est ce que vous les gars déjà dit, de sorte que vous pouvez voir ce qui est à l'image de ce qu'il est tout au sujet de si l'image ne peut pas être affichée (pour quelque raison que ce soit), elle permet également à des personnes malvoyantes et à comprendre ce que l'image sur.
L'attribut "title" est la bonne pour afficher l'info-bulle avec un titre pour l'image.
À mon avis, si le texte de décrire ce qui est visible dans l'image, pour le cas où l'image n'est pas affichée.
w3.org
Je crois que la touche alt est nécessaire pour en XHTML strict respect.
Comme d'autres l'ont noté, le titre est pour les info-bulles (nice to have), alt est pour l'accessibilité. Rien de mal à utiliser les deux, mais le alt doit toujours être là.
Non, je pense que
alt
est mieux parce que le but de cet attribut est de fournir un "autre" texte dans le cas où l'image ne peut pas être vue (que ce soit l'image est manquante ou que le navigateur lui-même est incapable de les afficher).La MVCFutures pour ASP.NET MVC décidé de faire les deux. En fait, si vous fournissez 'alt' il va automatiquement créer un "titre" avec la même valeur pour vous.
Je n'ai pas le code source à la main, mais une rapide recherche sur google mis en place un test pour elle!
Vous ne devez pas utiliser l'attribut title de l'élément img. Le raisonnement derrière cela est assez simple:
Source: http://blog.paciellogroup.com/2010/11/using-the-html-title-attribute/
HTML 5.1 comprend des conseils généraux sur l'utilisation de l'attribut title:
Source: http://www.w3.org/html/wg/drafts/html/master/dom.html#the-title-attribute
Quand il s'agit de l'accessibilité et de différents lecteurs d'écran:
Donc, comme Denis Boudreau adéquatement le mettre: clairement pas une pratique recommandée.
L'attribut ALT pour les déficients visuels de l'utilisateur qui utilisent un lecteur d'écran. Si la touche ALT est pas du TOUT l'image de la balise, l'intégralité de l'url de l'image à lire. Si les images sont pour une partie de la conception du site, ils devraient encore avoir la touche ALT, mais ils ont peut être laissé vide si l'url ne doit pas être lue pour chaque partie du site.
L'Attribut ALT
La
alt
attribut est défini dans un ensemble de balises (à savoir,img
,area
et éventuellement pour l'input
etapplet
) pour vous permettre de fournir un équivalent textuel pour l'objet.Un texte équivalent apporte les avantages suivants à votre site web et à ses visiteurs, à la suite de situations courantes:
L'Attribut Title
L'objectif de cette technique est de fournir de l'aide contextuelle pour les utilisateurs lorsqu'ils entrent des données dans des formulaires en fournissant les informations d'aide dans un
title
attribut. L'aide peut inclure le format des informations ou des exemples de l'entrée.Exemple 1: Un menu déroulant qui limite la portée d'une recherche
Un formulaire de recherche utilise un menu déroulant afin de limiter la portée de la recherche. Le menu déroulant est immédiatement adjacent au champ de texte utilisé pour entrer le terme de recherche. La relation entre le champ de recherche et le menu déroulant est clair pour les utilisateurs qui peuvent voir le visuel de la conception, qui n'a pas de place pour une étiquette visible. Le
title
attribut est utilisé pour identifier leselect
menu. Letitle
attribut peut être parlée par les lecteurs d'écran ou affiché comme un outil de pointe pour les personnes à l'aide de loupes d'écran.Exemple 2: champs d'Entrée pour un numéro de téléphone
Une page Web contient des commandes pour la saisie d'un numéro de téléphone aux États-unis, avec trois champs de l'indicatif régional, de l'échange, et les quatre derniers chiffres.
Exemple 3: Une Fonction De Recherche
Une page Web contient un champ de texte où l'utilisateur peut entrer des termes de recherche et un bouton "Rechercher" pour effectuer la recherche. Le
title
attribut est utilisé pour identifier le formulaire de commande et le bouton est placé juste après le champ de texte de sorte qu'il est précisé à l'utilisateur que le champ de texte est où le terme de recherche doit être entré.Exemple 4: Un tableau de données de contrôles de formulaire
Une table de données de contrôles de formulaire doit associer chaque contrôle avec la colonne et la ligne des en-têtes de la cellule. Sans titre (ou hors de l'écran de l'ÉTIQUETTE), il est difficile pour les non-visuel les utilisateurs de faire une pause et de les interroger pour chaque ligne/colonne d'en-tête de valeurs à l'aide de leur technologie d'assistance, tandis que la tabulation par le biais du formulaire.
Par exemple, un formulaire d'enquête a quatre en-têtes de colonne dans la première ligne: Question, d'Accord, Indécis, pas d'accord. Chaque ligne contient une question et un bouton radio dans chaque cellule correspondant à choix de réponse dans les trois colonnes. L'attribut title pour chaque bouton radio est une concaténation des choix de réponse (en-tête de colonne) et le texte de la question (en-tête de ligne) avec un trait d'union ou du côlon comme un séparateur.
Élément Img
Permis attributs mentionnés au MDN.
alt
crossorigin
decoding
height
importance
(expérimental api)intrinsicsize
(expérimental api)ismap
referrerpolicy
(expérimental api)src
srcset
width
usemap
Comme vous pouvez le voir
title
attribut n'est pas admis à l'intérieur deimg
élément. Je voudrais utiliseralt
attribut et si exige que je voudrais utiliser les CSS (Exemple: pseudo classe:hover
) au lieu detitle
attribut.