Атрибут alt: Альтернативный текст для изображений в HTML

Введение

Альтернативный текст, отображаемый, когда HTML-элемент не может быть отрисован.

Атрибут `alt` – это HTML-атрибут, используемый в документах HTML и XHTML для указания альтернативного текста, который должен отображаться вместо элемента, который не может быть отрисован. Атрибут `alt` используется для кратких описаний, а для более развернутых описаний применяется атрибут `longdesc`. Организация, устанавливающая стандарты для Всемирной паутины, Всемирный консорциум веб-сайтов (W3C), рекомендует, чтобы каждое изображение, отображаемое посредством HTML, имело атрибут `alt`, хотя этот атрибут не обязательно должен содержать текст. Отсутствие корректных атрибутов `alt` на изображениях веб-сайтов привело к ряду судебных исков, связанных с доступностью. Атрибут `alt` используется для повышения доступности и удобства использования, в частности, для слепых пользователей Интернета, которые используют специальное программное обеспечение для просмотра веб-страниц. Использование атрибута `alt` для изображений, отображаемых в HTML, является частью Руководства W3C по обеспечению доступности веб-контента (WCAG). Программы экранного доступа и текстовые веб-браузеры озвучивают или отображают содержимое атрибута `alt` вместо изображения. Текст в атрибуте `alt` заменяет изображение при копировании в текстовом формате и делает изображения более понятными для поисковых систем, что способствует поисковой оптимизации (SEO).

История

Атрибут был впервые представлен в проекте HTML 1.2 в 1993 году для поддержки текстовых браузеров. В HTML 4.01, выпущенном в 1999 году, атрибут стал обязательным для тегов `img` и `area`. Для тега `input` и устаревшего тега `applet` он является необязательным. В Internet Explorer 7 и более ранних версиях текст из атрибута `alt` отображается как текст всплывающей подсказки, что не соответствует стандартам HTML, установленным консорциумом World Wide Web Consortium (W3C). Из-за этого поведения многие веб-разработчики стали неправильно использовать атрибут `alt` для отображения всплывающих подсказок с дополнительной информацией об изображениях, вместо того чтобы использовать атрибут `title`, который был предназначен для этой цели. Начиная с Internet Explorer 8, выпущенного в 2009 году, атрибуты `alt` больше не отображаются в виде всплывающих подсказок в Internet Explorer.

Использование

Текст в атрибуте `alt` используется для замены изображения, когда изображение не может быть загружено, не изменяя смыслового содержания страницы. В руководствах W3C по обеспечению доступности веб-контента указано, что атрибут `alt` предназначен для передачи смысла и цели изображения, а не для его буквального описания. Например, атрибут `alt` для изображения логотипа организации должен указывать, что это логотип организации, а не описывать детали его внешнего вида. Атрибут `alt` следует использовать для кратких и ёмких описаний изображения. Более подробные описания можно предоставить с помощью атрибута `longdesc`, который содержит дополнительную информацию и дополняет, но не заменяет атрибут `alt`. Текстовый веб-браузер, такой как Lynx, будет отображать текст из атрибута `alt` вместо изображения (или атрибут `value`, если изображение является кликабельной кнопкой). Графический браузер обычно отображает только само изображение, а текст из атрибута `alt` показывает, если пользователь просматривает свойства изображения, настроил браузер на отключение отображения изображений или браузер не смог загрузить или декодировать изображение. Использование описаний в атрибуте `alt` улучшает поисковую оптимизацию и позволяет специализированным поисковым системам изображений, таким как Google Images, находить и отображать релевантные изображения, используемые на веб-сайтах в результатах поиска. Для текстовых поисковых запросов текст в атрибуте `alt` читается поисковыми системами так же, как и обычный текст на странице. W3C рекомендует задавать чисто декоративные изображения, не несущие смысловой нагрузки, с помощью CSS, а не в HTML-разметке. Если декоративные изображения реализованы с помощью HTML и не добавляют контента или дополнительной информации, W3C рекомендует использовать пустой атрибут `alt` в виде `alt=""`. Это повышает удобство использования страницы для пользователей скринридеров или текстовых браузеров, позволяя им пропускать изображения, не несущие смысловой нагрузки. Если атрибут `alt` не указан, браузеры, не способные отобразить изображение, не будут его пропускать, а вместо этого отобразят URL-адрес или другой идентификатор. Это может привести к неоднозначности, поскольку пользователь не всегда может определить по URL-адресу, относится ли изображение к тексту или является чисто декоративным элементом веб-страницы. Аудит Google Lighthouse в 2021 году показал, что 27% проверенных атрибутов `alt` были пустыми, несмотря на то, что большинство этих изображений были информационными, а не декоративными.

The text in the alt attribute is used to replace the image when the image cannot be loaded, without changing the intended meaning of the page's contents. The W3C's web content accessibility guidelines state that the alt attribute is used to convey the meaning and intent of the image, rather than being a literal description of the image itself. For example, an alt attribute for an image of an institution's logo should convey that it is the institution's logo rather than describing details of what the logo looks like. The alt attribute is intended to be used for short and concise descriptions of the image. Longer descriptions can be given using the longdesc attribute, which provides more detailed information and complements but does not replace the alt attribute. A text based web browser such as Lynx will display the alt text instead of the image (or will display the value attribute if the image is a clickable button). A graphical browser typically will display only the image, and will display the alt text only if the user views the image's properties, or has configured the browser not to display images, or if the browser was unable to retrieve or to decode the image. The use of descriptions in the alt attribute improves search engine optimization and allows image specific search engines, such as Google Images, to search for and display relevant images that are used on websites in search results. For non image search results, the text within the alt attribute is read by search engines the same way that regular text on the page is read. The W3C recommends that images that convey no information, but are purely decorative, be specified in CSS rather than in the HTML markup. If decorative images are rendered using HTML that do not add to the content and provide no additional information, then the W3C recommends that a blank alt attribute be included in the form of alt="". This makes the page more navigable for users of screen readers or non graphical browsers by skipping over images that do not convey any meaning. If no alt attribute has been supplied, then browsers that cannot display the image will not overlook the image but instead will read or display the URL or another identifying marker. This creates ambiguity since the user is generally unable to determine from a bare reading of a URL if the image is relevant to the text or if it is a purely decorative element of the webpage. A 2021 Google Lighthouse audit showed that 27% of alt text attributes audited were empty, despite the fact that the majority of those images were non decorative informational images.

Судебные иски

Было много судебных исков, связанных с доступностью веб-сайтов и отсутствием корректных атрибутов alt на веб-сайтах. Австралийская комиссия по правам человека постановила, что веб-сайт дискриминировал истца, не соответствуя стандартам доступности, обеспечивающим навигацию по веб-сайтам для слепых людей. В ходе судебного разбирательства правительства Австралии, штатов и территорий совместно с Департаментом широкополосного доступа, связи и цифровой экономики заявили о принятии рекомендаций W3C по обеспечению доступности для всех веб-сайтов gov.au. В Соединенных Штатах было несколько резонансных судебных исков, касающихся отсутствия атрибутов alt у изображений, которые указывают на нарушение Закона об американцах с ограниченными возможностями (ADA). Министерство юстиции США приводит отсутствие атрибутов alt в качестве примера барьера для доступности веб-сайтов. Дело Национальной федерации слепых против Target Corp., рассматривавшееся в 2006 году как коллективный иск, утверждало, что Target.com нарушил ADA, поскольку изображения не содержали атрибутов alt. Этот иск создал юридический прецедент в США в отношении доступности веб-сайтов и соответствия требованиям ADA.