Skip to main content


United States

Archived content

NOTE: this is an archived page and the content is likely to be out of date.


20. Do not use transparent colors around images with text.

Persons with weak eyes sometimes display their screens by reversing black and white. There are instances when the characters cannot be deciphered when the background color in images with characters in them is transparent.

Example and Implementation

Do not use transparent colors around text in images.

black text on white background

Can be read with normal settings, but...

black text on black background

GND_ac_badBad example: Text with transparency around the characters is difficult to read on screens which have black and white reversed

only the background around the black text is white

GND_ac_goodGood example: No transparent color around the characters in the image

21. Key images (charts, graphs) should have an accompanying outline on the same page or a link to a page with details.

When the comments attached to key images (charts, graphs) are lengthy, placing it in the alt attribute makes it difficult to read and reference. Because the alt attribute text is displayed in the tooltip control, people who have trouble using a mouse or slight sight impairments have difficulty grasping the content.

Example and Implementation

  • Use a text description in the same HTML file.
Explanative texts following a chart image

GND_ac_goodGood example: Good example: Display graph description in text.