[Infusion-users] Alt-text missing in the Image Reorderer?

Joseph Scheuhammer clown at utoronto.ca
Thu Jan 21 17:12:33 UTC 2010


Colin, Harris,

Colin wrote:
> This change was indeed intentional, related to improving the ARIA support for Image Reorderer.

There is an example in the ARIA spec of the use of the presentation role 
with images (http://www.w3.org/WAI/PF/aria/roles#presentation).  I've 
reproduced it below.

<div role="img" aria-labelledby="caption">
<img src="example.png" role="presentation" alt="">
<p id="caption">A visible text caption labeling the image.</p>
</div>

As far as I can tell, this structure is, in the abstract, the same as 
that of the thumbnails in the image reorderer.

The rationale is: one can have a composite structure made up of other 
parts, where the structure acts as a unit.  In particular, that 
composite unit can  have a role of image. The label for the image is 
associated with the root, here the <div> with "role='img'".  As such, 
it's undesirable for the <img> element to duplicate that information, 
and it is marked as non-informative by giving it a role of presentation.

It's the browser's job to create the a11y tree appropriately.  Any DOM 
element with a role of presentation is eliminated from the a11y tree.  
Thus the above markup is represented in the a11y tree as an image with 
the label "A visible text caption labeling the image".  The <img> 
element itself will not exist in the a11y tree.

> ... and tested closely with a few screen readers in the process.

It's been a while, but I don't remember personally testing this screen 
readers.  Given the time frame (spring 2009), I doubt that I did, since 
the only browser that would have handled it properly was FF.  IE8, the 
first version of IE to implement ARIA, was in beta then.   If a screen 
reader was using the accessible information as published by FF, it 
should have worked.  I might have used Inspect32 to see if the a11y tree 
was properly formed, but I don't remember.  Nearly a year has passed 
since.  If this isn't working now, then either the browsers are not 
implementing it properly, or screen readers are ignoring the a11y tree 
and looking directly at the DOM.

I just ran the above example using Inspect32 with FF3.5 (WinXP), and the 
a11y tree looks correct.  The <div> is seen as a graphic with the 
appropriate label.  There is no <img> in the a11y tree.

Somewhat of an aside:  There is a wrinkle with the presentation role 
that might be relevant.  The presentation role is ignored when an 
element is focusable.  If presentation wasn't ignored in such 
situtations, there would be an object that was keyboard navigable and 
possibly actionable, but with no semantics.  That would be ... weird, 
and wrong.

For example, since anchor elements can take keyboard focus, marking them 
a role of presentation will *not* remove them from the a11y tree.  The 
following anchor tag will appear in the a11y tree, role=presentation 
notwithstanding:

<a href="..." role="presentation" ...

  See http://www.w3.org/WAI/PF/aria-implementation/#mapping_general for 
details.

I don't remember, but are the <img> elements within the reorderer's 
thumbnails focusable?  Or is it just the thumbnail as a whole that 
accepts keyboard focus?

-- 
;;;;joseph

'Clown control to Mao Tse Tung.'
  - D. Bowie (misheard lyric) -




More information about the Infusion-users mailing list