(photo by Google Charts API)

It's interesting how different companies, competitors even, can come together for a good cause in the name of making it easier for more people to use the Web.

In this feature from the Ajaxian, a Web architect from Yahoo, Chris Heilman, makes Google Charts, a product from Google, more accessible to people who can't see the charts it generates.

By "people who can't see", I am referring to people who are either fully or partially (color) blind and who rely on special screen readers like JAWS to view Web pages. 

These screen readers are able to interpret text and HTML but not images. Chris' solution to make Google Charts more accessible to such screen readers is to transform the data into HTML tables.

He not only did a good thing for our fellow handicapped Web users but he also made it super easy for developers. To make your Google charts instantly "accessible" in 3 easy steps,

1. Download the script and css
2. Include it on the HTML page where your charts will be

		<link type="text/css" rel="stylesheet" href="http://yui.yahooapis.com/2.4.1/build/reset-fonts-grids/reset-fonts-grids.css">
	<link type="text/css" rel="stylesheet" href="page.css">
	<link type="text/css" rel="stylesheet" href="table2chart.css">
	<script src="table2chart.js"><script>
	

3. Add a class to the img tag of your Google chart

		<img src="http://chart.apis.google.com/chart?cht=p3 ... " alt="Fruit ..." class="totable">