Comments on: Creating accessible bar charts

By: Cascading Style Sheets Reference Links | kabayview.com

Cascading Style Sheets Reference Links | kabayview.com — Mon, 10 Oct 2011 13:50:05 +0000

[...] Creating Accessible Bar Charts – Peter Krantz [...]

By: WEB 3.0 » Blog Archive » ¿Así que querías saber de CSS?

WEB 3.0 » Blog Archive » ¿Así que querías saber de CSS? — Sat, 18 Apr 2009 01:13:31 +0000

[...] Creating Accessible Bar Charts – Peter Krantz [...]

By: rweait

rweait — Fri, 24 Mar 2006 19:41:07 +0000

I’ve been working on horizontal bar charts from tables, with arbitrary end-points. Have others found a good way to do this? My efforts are in the link.

By: Destani

Destani — Thu, 02 Mar 2006 21:50:13 +0000

You need a link to make a graph on here. Although the article was informative.

By: christian

christian — Mon, 09 Jan 2006 13:07:20 +0000

I find interesting the fact of transforming it in an high interactive version getting it's data. Here the example from your chart.

By: sport

sport — Fri, 14 Oct 2005 21:16:15 +0000

i thought this site would give me a link to make a graph but it didnt

By: Alberto Romero

Alberto Romero — Mon, 30 May 2005 13:26:25 +0000

Nice one, but wouldn’t you consider marking the horizontal headers, ie the countries’ names, as ?

By: Rich

Rich — Mon, 09 May 2005 18:57:45 +0000

Excellent. Works fine with a screen reader - you do indeed get a simple table which is quite accessible.

Great work!

By: Anup

Anup — Sat, 16 Apr 2005 13:13:46 +0000

Very nice.

I imagine one variation could be to put the number in the alt text, if you don't need or want the textual value to appear next to the image.

One other important advantage your technique has from an accessibility perspective (which I don't think you mentioned explicitly) is the inherent resizeability of your approach compared to images. (You can try to specify image dimensions in ems or something so it will resize but if there is text in the image it won't resize well.)

(Another possibility is to provide alt text and use DOM Scripting to add the value based on the alt text, though this might look odd where images are disabled but JavaScript is not. This suggestion might only be useful for intranets where computer/browser configurations are often controlled.)

By: Lachlan Hunt

Lachlan Hunt — Thu, 10 Feb 2005 08:39:48 +0000

I’ve done bar charts using this techniqe before, though it is very good to have an excellent example like this to show others that haven’t.