Whilst images are an important aspect of the Web, not everyone can experience them. For example, people who are partially-sighted may not be able to see images very well and people who are blind may not be able to see them at all. Some users may disable images to reduce bandwidth and search engines, such as Google, will only index the text on a webpage, therefore any information conveyed by an image will not be processed.
To address this, it is important that all images have a text alternative that adequately describes the image. As well as visually-rich images (e.g. a landscape or a family photo), this also includes graphs and charts, images of text (e.g. a photo of a sign), icons buttons and interactive components that use images. Alternative text acts as a fallback for people who, for whatever reason, cannot see the image. It means that people who are blind or partially-sighted can use assistive technology, such as a screen reader or screen magnifier, to read the text alternative of an image, in much the same way they would read other text content on a webpage. Users who have disabled images will see the text alternative in place of an image, and search engines will be able to process the text alternative and properly index the webpage.
To add alternative text to an image, use the "alt" attribute (commonly, but incorrectly, called an "alt tag") of the <img> element.
CSS is sometimes used to replace HTML text (e.g. a heading) with an image. It typically does this by moving the HTML text off screen and using a background image in its place. This is known as image replacement. There are various methods of image replacement, each with their own advantages and disadvantages. A common disadvantage is that the text cannot be read by users who have CSS enabled and images disabled. For this reason, any use of image replacement should be accompanied by the option to disable it or use an alternative style sheet.
//The alt attribute is used to provide a description of the image
<img src="kittens.jpg" alt="Two kittens sitting in a barrel">