Elsewhere on the Web
Improving a Web site using Web Content Accessibility Guidelines (WCAG) 2.0
Demo starts here
The text alternative for this image of text is overly verbose and does not serve the equivalent purpose of the image. The text alternative is as follows:
<img src="top_logo.gif" alt="Red dot with a white letter 'C' that symbolizes a moon crescent as well as the sun. This logo is followed by a black banner that says 'CITYLIGHTS' which is the name of this online portal. Finally, the slogan of the portal, 'your access to the city', follows in a turquoise green handwriting style and with a slight slant across the top banner." ... >
Note: This error is derived from the Template design and occurs throughout the entire website.
This image does not have any text alternative, so that it is unclear to some reasers if the image is important or not.
<img src="teaser_right1.jpg" ... >
img element should have an
alt attribute. The attribute should be empty if the image should be ignored by assistive technology.
The link "heat wave linked to temperature" is not sufficiently distinct because it resembles a heading, and will not be recognized as a link by many readers.
The text alternative for this image is provided in the
title attribute alone, which is not usable for many readers. Moreover, the text alternative "image" does not describe the image.
<div style="background: url(BrainInJar.jpg)" title="image" ... >
Note: The techniques for retrofitting this image differ depending if the author regards this image as purely decorative or as informative.
The link text "Read more..." is not descriptive to convey the purpose of the link.
These three columns of text appear to be visually distinct but according to the markup code they appear as one piece of running text. They would read as follows:
"After three years of effort city scientists now agree that the primary cause of the 2003 heatwave was hot air from our Mayor: These kinds of crimes need more creative, effective punishments. For example, we could require compulsory Brain donations: huge drop off in brain donations down due to the 'success' of 'Slow Traffic, Safe Streets' policy"
This image has an empty text alternative but it is the only content in the link, so that the purpose of the link is unclear to some users.
<a href="news.html" ... ><img src="morearrow.gif" alt="" ... ></a>
This image has the text alternative "bullet", which does not provide any useful information. The image should have an empty text alternative to indicate that it is a decorative image that should be ignored by assistive technology.
<img src="list_bullets.gif" alt="bullet" ... >
Note: The image can also be dispayed using CSS rather than the
The items "Killer bees" and "Onions" are formatted to visually resemble a list but this structural information is not represented in the HTML code.
This image has an incorrect text alternative, "1234 56789"; possibly because the text alternative is outdated or a placeholder.
<img src="telefon_white_bg.gif" alt="1234 56789" ... >