Images
Most images will need alternative (alt) text that describe the meaning of the image. The purpose of this is so visually impaired users can get the same information about the image read aloud from the screen reader. There are different types of images that can be on a page and each will be dealt with differently.
Decorative Images
Any image that does not provide any information to the user, and is placed on the page purely for style is a decorative image. These images should have empty alt text values, this tells screen readers to ignore the image completely.
DO
<img src="divider.png" alt="" /> DONT
<img src="divider.png" alt="divider" /> Informative Images
Simple Images
Any image that conveys meaning and is added to a page to give the user a better understanding of the surrounding content, should have descriptive alt text. Typically a sentence that describes the meaning of the image will work.
DO
<img src="beach_299.png" alt="Three dogs walking on the beach" />
DONT
<img src="beach_299.png" alt="beach" /> <img src="beach_299.png" alt="beach image" /> <img src="beach_299.png" alt="beach_299.jpg" />Complex Images
Complex images (diagrams, charts, maps, graphs etc) should have alt text that generally describes the content in the image as well as another alternative such as a data table or a long descriptive below the image.
DO
<img src="bar-graph.png" alt="Bar graph showing most frequently visited pages this month. Description below this image." />
<p> The graph shows the most frequently visited pages this month. The home page was visited the most, followed by the shop page, and lastly the about page, which had no visits. </p> DONT
<img src="bar-graph.png" alt="Bar graph about the website." /> Things to avoid
Images with alt text that include "picture of" or "image of".
Images that have text in them should be avoided unless the text is essential to the information being conveyed (logo or brand name).