New statistics graphs

[anarres]

Hi all, I'm one of the Google Summer of Code students, working on the statistics project. I've written a module that generates graph images, which will be shown on http://www.dreamwidth.org/stats/site. I wanted to get some feedback on the images from an accessibility point of view. I don't know much about accessibility, but I guess the main questions would be, are the colours on the pie chart different enough to be distinguished by people with partial colour-blindness, and is the text visible enough?

The graphs module is found in an uncommitted patch here: Bug 2699 - Create a graphical front-end for the statistics system.

I was also wondering about alt text. I started out with the idea that the alt text would just repeat all the numbers shown visually in the graph, but I'm not sure if this is helpful, or just annoying. I guess maybe giving numbers in alt text is more useful when there are only 4 or 5 numbers like in the pie chart, but less useful if there are lots of numbers, like in the line graph?

Here are some example graphs:

Comments

[jeshyr]

Wow, graphs! Looking forward to that.

Is there a reason you're putting the graph title as part of the image rather than regular text? Could it be swapped out of the image and a shorter image used? That would help with accessibility for a start.

Will the numbers be available on the page outside the graphical image, or is the graph the only way to access the numbers? The alt text becomes much less of an issue of the information is available somewhere else on the page - I suggest you read http://www.webaim.org/techniques/alttext/#complex (only ignore what they say about the "longdesc" attribute - don't use it here please!).

Readability of the text would be improved by putting commas in the numbers, eg "20,000" rather than "20000" is easier to read. Keeping all the text black is a good idea you've already implemented. Try bolding the text perhaps, so it's a bit thicker - you'll have to experiment to see what fits in the space available.

For the colour-blindness checking, there are free programs and also online checking tools you can use - there's a good list of accessibility checking tools on WebAIM which includes colour-blindness testing stuff. A rule of thumb is to convert your image to greyscale and see if it's still understandable that way, but use the tools too.

Looks like you're going well! Keep up the good work :)

r

[anarres]

Thanks! I tried the colorfilter tool, and it looks like I need to add an outline to graph 3, so you can tell that it's two separate datasets. Apart from that the images hold up pretty well. And getting rid of titles is a brilliant idea.

I think in most cases the information will be present elsewhere on the webpage in a table. In that case, would it be better to have alt="Pie chart showing XXX", or just, alt=""?

[jesse_the_k]

I'm not as well versed as RB, but choosing a good all-access graph title is crucial: "Popcorn Freshness Degradation Varies with Storage Temperature," or "Pairing Prefs Over Time: McShep vs OT3". Liberated from the graphic, this text provides a lot of info. The alt text just has to tell the blind user what the sighted user gets "at a glance": the nature of the figure. For example, alt="Popcorn Freshness Line Graph" or alt="Pairing Pref Histogram".

My metric is, can a blind teacher use the materials to present to a sighted student, as well as the other way around.

Oh! I just checked the page data -- I'll let you come up with better titles.