Теги HTML img: атрибут title и атрибут alt?

Я просматривал Amazon.com и заметил, что при поиске "1TB" (http://www.amazon.com/s/ref=nb_ss_gw?url=search-alias%3Daps&field-keywords=1TB), если вы наведите указатель мыши на рейтинг звезд изображение, вы видите только счет, если используете IE. Если вы используете другой браузер, оценка не будет отображаться.

Рейтинг 3.8 и рейтинг 4.2 оба отображаются как 4 звезды. Конечно, 3,8 звезды против 4,2 звезды (76% против 84%) могут повлиять!

Это связано с тем, что стандартный способ отображения текста "alt" - это только когда пользователь отключает графику или когда браузер "зачитывается" (например, браузер для пользователей с ослабленным зрением). Однако IE показывает это при наведении.

Поэтому я думаю, что если Amazon будет показывать его независимо от пользовательского браузера, тогда вместо "alt" следует использовать "title". Вы согласны?

Ответ 1

Я поеду для обоих. Заголовок отобразит хорошую всплывающую подсказку во всех браузерах, а alt даст описание при просмотре в браузере без изображений.

Тем не менее, мне бы хотелось увидеть некоторые статистические данные о том, сколько "серферов", отправляющихся в "магазин" для просмотра товаров, фактически отключили изображения или используют браузер, который не поддерживает изображения. Я думаю, что дни, когда 90% населения используют модем 28k для подключения к InterWeb, - это looooong over.

Ответ 2

Они используются для разных вещей. Атрибут alt используется вместо изображения. Если изображение не может быть показано или (я считаю) в экранных устройствах.

Атрибут title отображается с изображением вдоль, как правило, как всплывающая подсказка.

Нельзя использовать "вместо" другого. Каждый из них должен использоваться должным образом, чтобы делать то, для чего они были предназначены.

Ответ 3

alt и title для разных вещей, как уже упоминалось. Хотя тег title предоставит всплывающую подсказку, alt также является важным атрибутом, поскольку он указывает текст, который будет отображаться, если изображение не может быть отображено. (И в некоторых браузерах, таких как firefox, вы также увидите этот текст во время загрузки изображения)

Еще один момент, который, как мне кажется, должен быть сделан, заключается в том, что тег alt требуется для проверки в качестве документа XHTML, тогда как тег title является просто дополнительным вариантом, "как бы".

Ответ 4

Это потому, что они служат различным целям, и оба они должны использоваться не только друг над другом.

"alt" - это то, что вы, ребята, уже сказали, так что вы можете видеть, что изображение все это значит, если изображение невозможно отобразить (по какой-либо причине), оно также позволяет людям с ослабленным зрением понять, что изображение о.

Атрибут "title" является правильным, чтобы показать всплывающую подсказку с заголовком изображения.

Ответ 5

По моему мнению, текст alt всегда будет описывать то, что видно на картинке, для случая, когда изображение не отображается.

alt= текст [CS]     Для пользовательских агентов, которые не могут отображать изображения, формы или апплеты, этот атрибут указывает альтернативный текст. Язык альтернативного текста определяется атрибутом lang.

w3.org

Ответ 6

Я считаю, что alt требуется для строгого соответствия XHTML.

Как отмечали другие, заголовок предназначен для всплывающих подсказок (приятно иметь), alt для доступности. Ничего плохого в использовании обоих, но alt всегда должен быть там.

Ответ 7

Нет, я думаю, что alt лучше, потому что целью этого атрибута является предоставление "альтернативного" текста в том случае, если изображение не может быть просмотрено (независимо от того, отсутствует ли изображение или что сам браузер неспособен его отображения).

Ответ 8

MVCFutures для ASP.NET MVC решили сделать то и другое. Фактически, если вы предоставите "alt", он автоматически создаст "заголовок" с тем же значением для вас.

У меня нет исходного кода, но быстрый поиск в Google оказался тестовым для него!

    [TestMethod]
    public void ImageWithAltValueInObjectDictionaryRendersImageWithAltAndTitleTag() {
        HtmlHelper html = TestHelper.GetHtmlHelper(new ViewDataDictionary());
        string imageResult = html.Image("/system/web/mvc.jpg", new { alt = "this is an alt value" });
        Assert.AreEqual("<img alt=\"this is an alt value\" src=\"/system/web/mvc.jpg\" title=\"this is an alt value\" />", imageResult);
    }

Ответ 9

Нельзя использовать атрибут title для элемента img. Обоснование этого довольно просто:

Предпочитаемая информация о титрах - важная информация, которая должна быть доступна всем пользователям по умолчанию. Если это присутствует в тексте рядом с изображением.

Источник: http://blog.paciellogroup.com/2010/11/using-the-html-title-attribute/

HTML 5.1 содержит общие рекомендации по использованию атрибута title:

Включение атрибута title в настоящее время не рекомендуется, так как многие пользовательские агенты не раскрывают атрибут доступным образом, как требуется этой спецификацией (например, требуя, чтобы указывающее устройство, такое как мышь, вызывало всплывающую подсказку, только пользователи и пользователи с сенсорным экраном, такие как любой, у кого есть современный телефон или планшет).

Источник: http://www.w3.org/html/wg/drafts/html/master/dom.html#the-title-attribute

Когда речь идет о доступности и разных устройствах чтения с экрана:

  • Челюсти 10-11: отключено по умолчанию
  • Window-Eyes 7.02: включен по умолчанию
  • NVDA: не поддерживается (нет параметров поддержки)
  • VoiceOver: не поддерживается (нет параметров поддержки)

Следовательно, как Денис Будро адекватно выразился: явно не рекомендуемая практика.