Alt Attribute
   HOME

TheInfoList



OR:

The alt attribute is the
HTML attribute HTML attributes are special words used inside the opening tag to control the element's behaviour. HTML attributes are a modifier of an ''HTML element type''. An attribute either modifies the default functionality of an element type or provides fu ...
used in
HTML The HyperText Markup Language or HTML is the standard markup language for documents designed to be displayed in a web browser. It can be assisted by technologies such as Cascading Style Sheets (CSS) and scripting languages such as JavaSc ...
and
XHTML Extensible HyperText Markup Language (XHTML) is part of the family of XML markup languages. It mirrors or extends versions of the widely used HyperText Markup Language (HTML), the language in which Web pages are formulated. While HTML, prior ...
documents to specify alternative
text Text may refer to: Written word * Text (literary theory), any object that can be read, including: **Religious text, a writing that a religious tradition considers to be sacred **Text, a verse or passage from scripture used in expository preachin ...
(alt text) that is to be displayed in place of an element that cannot be rendered. The alt attribute is used for short descriptions, with longer descriptions using the longdesc attribute. The standards organization for the
World Wide Web The World Wide Web (WWW), commonly known as the Web, is an information system enabling documents and other web resources to be accessed over the Internet. Documents and downloadable media are made available to the network through web ...
, the
World Wide Web Consortium The World Wide Web Consortium (W3C) is the main international standards organization for the World Wide Web. Founded in 1994 and led by Tim Berners-Lee, the consortium is made up of member organizations that maintain full-time staff working ...
(W3C), recommends that every image displayed through HTML have an alt attribute, though the alt attribute does not need to contain text. The lack of proper alt attributes on website images has led to several accessibility-related lawsuits. The alt attribute is used to increase accessibility and user friendliness, including for blind internet users who rely on special software for web browsing. The use of the alt attribute for images displayed within HTML is part of W3C's
Web Content Accessibility Guidelines The Web Content Accessibility Guidelines (WCAG) are part of a series of web accessibility guidelines published by the Web Accessibility Initiative (WAI) of the World Wide Web Consortium (W3C), the main international standards organization for ...
(WCAG). Screen readers and
text-based web browser A text-based web browser is a web browser that renders only the text of web pages, and ignores most graphic content. Under small bandwidth connections, usually, they render pages faster than graphical web browsers due to lowered bandwidth demand ...
s read the alt attribute in place of the image. The text within the alt attribute substitutes the image when copy-pasted as text and makes images more machine-readable, which improves
search engine optimization Search engine optimization (SEO) is the process of improving the quality and quantity of website traffic to a website or a web page from search engines. SEO targets unpaid traffic (known as "natural" or " organic" results) rather than dire ...
(SEO).


History

The attribute was first introduced in the HTML 1.2 draft in 1993 to provide support for text-based browsers. In
HTML 4.01 The HyperText Markup Language or HTML is the standard markup language for documents designed to be displayed in a web browser. It can be assisted by technologies such as Cascading Style Sheets (CSS) and scripting languages such as JavaScript ...
, which was released in 1999, the attribute was made to be a requirement for the img and area tags. It is optional for the input tag and the deprecated
applet In computing, an applet is any small application that performs one specific task that runs within the scope of a dedicated widget engine or a larger program, often as a plug-in. The term is frequently used to refer to a Java applet, a program ...
tag.
Internet Explorer 7 Windows Internet Explorer 7 (IE7) (codenamed Rincon) is a web browser for Windows. It was released by Microsoft on October 18, 2006, as the seventh version of Internet Explorer and the successor to Internet Explorer 6. Internet Explorer 7 is pa ...
and earlier render text in alt attributes as
tooltip The tooltip, also known as infotip or hint, is a common graphical user interface (GUI) element in which, when hovering over a screen element or component, a text box displays information about that element, such as a description of a button's f ...
text, which is not compliant with the
World Wide Web Consortium The World Wide Web Consortium (W3C) is the main international standards organization for the World Wide Web. Founded in 1994 and led by Tim Berners-Lee, the consortium is made up of member organizations that maintain full-time staff working ...
(W3C)'s HTML standards. This behavior led many web developers to misuse the alt attribute when they wished to display tooltips containing additional information about images, instead of using the title attribute that was intended for that use. As of
Internet Explorer 8 Windows Internet Explorer 8 (IE8) is a web browser for Windows. It was released by Microsoft on March 19, 2009, as the eighth version of Internet Explorer and the successor to Internet Explorer 7. It was the default browser in Windows 7 (later def ...
, released in 2009, alt attributes no longer render as tooltips on Internet Explorer.


Usage

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 screen reader such as
Orca The orca or killer whale (''Orcinus orca'') is a toothed whale belonging to the oceanic dolphin family, of which it is the largest member. It is the only extant species in the genus '' Orcinus'' and is recognizable by its black-and-white ...
will read out the alt text in place of the image. 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 Google Images (previously Google Image Search) is a search engine owned by Google that allows users to search the World Wide Web for images. It was introduced on July 12, 2001 due to a demand for pictures of the green Versace dress of Jennifer ...
, 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 Google Lighthouse is an open-source, automated tool for measuring the quality of web pages. It can be run against any web page, public or requiring authentication. Google Lighthouse audits performance, accessibility and search engine optimization ...
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.


Lawsuits

There have been many lawsuits over website accessibility and the lack of proper alt attributes on websites. '' Maguire v Sydney Organising Committee for the Olympic Games'' was a 2000 lawsuit in which a blind man in Australia sued the Sydney Organising Committee for the Olympic Games because their website www.olympics.com was not accessible to him because of the lack of alt attributes on images. The
Australian Human Rights Commission The Australian Human Rights Commission is the national human rights institution of Australia, established in 1986 as the Human Rights and Equal Opportunity Commission (HREOC) and renamed in 2008. It is a statutory body funded by, but opera ...
ruled that the website had discriminated against him for failing to conform to accessibility standards that enable blind individuals to navigate websites. During the lawsuit, the Australian commonwealth, state and territory governments issued a joint statement through the
Department of Broadband, Communications and the Digital Economy The Australian Department of Broadband, Communications and the Digital Economy is a former department of the Government of Australia that was charged with the responsibility to help develop a vibrant, sustainable and internationally competitive ...
that they were adopting the W3C's accessibility guidelines for all .gov.au websites. In the United States, there have been several high-profile lawsuits involving the lack of alt attributes on images that cite a violation of the Americans with Disabilities Act (ADA). The
United States Department of Justice The United States Department of Justice (DOJ), also known as the Justice Department, is a federal executive department of the United States government tasked with the enforcement of federal law and administration of justice in the United Stat ...
gives the lack of alt attributes as an example of a barrier to website accessibility. '' National Federation of the Blind v. Target Corp.'' was a 2006 class-action lawsuit that alleged that Target.com violated the ADA because the images did not use alt attributes. This lawsuit set a legal precedent in the United States for website accessibility and compliance with the ADA.


References

{{reflist


External links


Appropriate Use of Alternative Text
from WebAIM
Mini-FAQ about the alternate text of images
by Ian Hickson HTML Computer-related introductions in 1995 Web accessibility