Как написать хороший текст alt для изображений, чтобы помочь программе чтения с экрана и незрячему пользователю понять, о чем идет речь на картинке?

StackOverflow https://stackoverflow.com/questions/1741700

Вопрос

Как написать хороший текст alt для изображений , чтобы помочь программе чтения с экрана и незрячему пользователю понять, о чем идет речь на картинке?и если мы используем Alt text, то что должно быть в Title ="text", если мы используем оба в особых случаях, таких как изображения меню и т. Д

Это было полезно?

Решение

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

В alt текст должен быть единым предложением / абзацем, который можно заменить изображением, передавать тот же контент и при этом иметь смысл в контексте смежного контента.

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

Вы должны посетить свой сайт с links и попытайтесь понять ваш сайт.Если существует, например, круговая диаграмма, ее alt текст должен представлять собой небольшое резюме процентных значений.Если у вас просто есть красивый цветок рядом с записью в блоге, не придавайте этому значения. alt текст, подобный изображение цветка-компаньон поста в блоге #324 или даже хуже flower.jpg.

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

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

Некоторые эмпирические данные Шоу title как бесполезный:

  • Большинство пользователей программного обеспечения для чтения с экрана не изменяют свои настройки по умолчанию для доступа к информации атрибута ЗАГОЛОВКА в ссылках.
  • Большинство программ для чтения с экрана по умолчанию могут получить доступ к содержимому атрибута заголовка в элементах управления формой.
  • Некоторые программы для чтения с экрана не могут получить доступ к информации об атрибуте ЗАГОЛОВКА.
  • Пользователи экранных увеличителей могут читать текст атрибута ЗАГОЛОВКА при более низких уровнях увеличения.
  • Пользователи экранных увеличителей не могут прочитать текст атрибута ЗАГОЛОВКА, содержащий более 1 или 2 слов, при более высоких уровнях увеличения.

Вот хороший совет, выражено лучше , чем я мог бы

Используйте это для предоставления дополнительной информации, которая не является существенной.Большинство визуальных браузеров отображают текст заголовка в виде всплывающей подсказки при наведении курсора мыши на элемент, однако способ отображения текста заголовка зависит от производителя браузера.Вместо этого некоторые будут отображать текст в строке состояния.Например, ранние версии Safari делали это.

Одним из полезных применений атрибута title является добавление описательного текста к ссылкам, особенно если сам текст ссылки не содержит четкого описания назначения ссылки.Таким образом, вы можете помочь посетителям узнать, куда приведет их ссылка, возможно, избавив их от необходимости загружать страницу только для того, чтобы узнать, что это не то, что их интересует.Другим потенциальным применением является предоставление дополнительной информации для изображения, такой как, возможно, дата или другая информация, которая, вероятно, не является существенной.

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

Другие советы

Я пользователь программы чтения с экрана и буду использовать Stackoverflow как пример как хорошего, так и плохого.

Теги Alt должны быть краткими и описательными.Например, stackoverflow's alt теги для вариантов "голосовать за" и "против" хороши тем, что их чтение не занимает много времени и позволяет быстро перейти к сути.Примерами плохих тегов alt являются теги "сделать этот вопрос любимым" и "принять этот ответ".Ни один из тегов не является описательным, любимый тег - это просто "*" и тег " принять ответ " - это "check" Единственный способ для меня определить, что это такое, - это прочитать источник или попросить кого-нибудь из видящих сообщить мне, для чего они нужны.

Насколько title атрибуты идут, на самом деле у меня не так уж много советов.Моя программа чтения с экрана не читает их по умолчанию, поэтому обычно я ими не пользуюсь.Примером чего-то, что могло бы быть полезным, является дополнительная информация.Например, причина, по которой мой процент принятых ответов такой низкий, заключается в том, что у меня нет способа определить, принял ли я ответ на вопрос.Было бы неплохо, если бы атрибут title на графическом изображении accept this answer гласил что - то вроде "нажмите, чтобы принять этот ответ" если ответ не был принят и "Нажмите, чтобы удалить этот ответ как принятый"если это общепринятый ответ.

Я думаю, что лучшая практика - помещать одинаковый контент в атрибуты alt и title.

Что касается "что написать" - просто, в нескольких словах о том, что изображено на картинке.

Проверьте эту статью, где атрибуты alt описаны довольно хорошо: http://www.cs.tut.fi /~jkorpela/html/alt.html

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top