W3C home > Mailing lists > Public > public-canvas-api@w3.org > January to March 2011

Test Case: Option Role - Canvas Accessibility Working Group

From: Charles Pritchard <chuck@jumis.com>
Date: Fri, 28 Jan 2011 11:05:23 -0800
Message-ID: <4D431373.90501@jumis.com>
To: public-canvas-api@w3.org
CC: Richard Schwerdtfeger <schwer@us.ibm.com>, franko@microsoft.com, david.bolter@gmail.com, public-html-a11y@w3.org, swarren@aisquared.com, tlalor@aisquared.com, dmazzoni@google.com
http://dl.dropbox.com/u/17337752/text-legibility-crop.png

Attached is a screenshot from the text-legibility script; demonstrating 
issues described in the Canvas Accessibility agenda that Richard has 
been maintaining.

The first line shows two normally rendered span elements, with tabindex 
associations on each, displaying two different fonts and sizes.
It treats the text spans as one might treat role='option'.

The browser is set to a high magnification level.

The third line shows the same text, with textBaseline and fillText being 
used (canvas).

The second line shows another canvas element, with accounting for 
baseline offsets and window scaling; the paths to be used as focus 
indicators are outlined in brown.
For all practical purposes, they match the focus outlines that are 
actually drawn on the first line (the spans).

At the bottom right of the image is an html select element, with focus 
on one of the option elements. In this instance, the select element has 
a focus ring around it, and my selection position encompasses the select 
element.

The script has not been tuned for various browsers; there are 
work-arounds for scaling, baseline offsets, and focus rings: canvas_a11y 
proposals are intended to standardize some of these methods.

These proposals are relevant to the demo:
window.devicePixelRatio - a floating point returning the current ratio 
of CSS pixels to units.
drawFocusRing - to indicate a region corresponding to a focused element
setCaretSelectionRect - to indicate a sub-region within a focused element.
TextMetrics baseline - to indicate the baseline positioning of text

Currently, these techniques rely on various methods of CSS 
introspection. They would be used more often were they easy to access. 
Many CSS techniques for a11y involve transparent or non-visible layers, 
absolution positioned around the viewport. The proposals listed above 
are intended to obsolete such techniques.

Script (work in progress):
http://dl.dropbox.com/u/17337752/text-legibility-script.html

This document (also WIP):
http://dl.dropbox.com/u/17337752/text-legibility-readme.txt

I've not finished working on the script so that it only uses our 
proposals; using various backwards compatibility techniques.


-Charles
Received on Friday, 28 January 2011 19:06:05 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Friday, 28 January 2011 19:06:07 GMT