There may be some issues, such as if CSS like display:none is used, but floats, position etc, from what I have seen don’t affect the listed screen readers. Hence I too go with A, until I get a chance to try it :)

*Lacking a proper screen reading I just ran a test using Fangs (www.standards-schmandards.com/fangs/). Since it’s just an emulator and not really a screen reader I’m not sure if it counts, but since many like me don’t have another tool I thought we might compare these results with an proper reader’s results.

What I found was that it would fail to find text hidden using “Classic FIR” image replacement (this technique uses display: none; in the CSS). That means that for all but #1 the H3 text is missing. And for #151 and #167 the paragraph that begins, “A demonstration of what can be accomplished…” is also missing.

In defense of The Garden, the code behind it is outdated and cannot be changed without breaking all the designs. If Dave Sea were to re-code it he might tailor the HTML for one of the many other image replacement options now available: http://mezzoblue.com/tests/revised-image-replacement/

Actually, looking over the options in Shea’s revised image replacement article the only one he has tested in a screen reader uses the same old zen garden style code: the Dwyer Method. I would be very interested to find out if it does indeed work in all current screen readers.

For what it’s worth, we had an image replacement quiz a few weeks ago. In that quiz, I tried four methods. One of them, the Lehy / Langridge method is very similar to Dwyer in that overflow : hidden is the same hiding mechanism. Lehy / Landridge does work in all screen readers we tested, and I’m assuming Dywer works equally well.

Is there a “results” page for all the testing that’s being done? I don’t have access to the proper technology to test along w/ you guys, but I’m very interested in summaries of what you find out.

I have tested with IBM HPR 3.04, Jaws 6.1 and Window Eyes 5.0. All three speak the material in the sequence found in the HTML, not according to the on screen appearance. There are various omissions because of the inaccessible ways some image replacement techniques were used.

I’ll follow up with a very thorough summary, and recordings, after one or two more rounds of examples.

I think the CSS Zen Garden samples will all be fairly inaccessible for screenreaders, as it was made before accessible image replacement techniques were known. As a result, the markup tends to lend itself only (or at least, mostly) to inaccessible image replacement methods, or no image replacement at all. Not much of an option for many of the (official) designs, thus I think it’s safe to assume that these samples designs will all lack a lot of screenreader-accessible text.

Aaron