W3C home > Mailing lists > Public > w3c-wai-ig@w3.org > July to September 2002

RE: Pictures In Tables

From: Jukka Korpela <jukka.korpela@tieke.fi>
Date: Wed, 4 Sep 2002 10:45:40 +0300
Message-ID: <621574AE86FAD3118D1D0000E22138A95BDE27@TIEKE1>
To: w3c-wai-ig@w3.org

Hy Cohen wrote:

> We're using tables for layout, and would like to have a 
> picture show on the right side of an article, but have
> the screen reader read the ALT text of the picture
> before reading the text.

I think you don't need tables for layout for that purpose.
Even if you otherwise use layout tables on the page, you
could handle this part simply using

<p><img alt="Hello world." src="demo.gif" align="right">
Some text.<br clear="all"></p>

The align="right" attribute causes the desired effect, if
I understood you correctly. The tag <br clear="all"> implies
that if the text ends vertically before the image does,
empty space is left instead of using it for subsequent text.
This might be relevant for making the association of the image
with some particular text visually clear.

You might consider using hspace and vspace attributes in <img>
for preventing the text being too close to the image. Or you might
consider doing such things in CSS. You could also use CSS instead
of the attributes mentioned (namely float:right for img and
clear:both for the element after the paragraph), but that's
less relevant as regards to accessibility.

What I find difficult is just the _opposite_ order: if I'd like
to have an image on the left of some text, e.g. as illustrating
some verbal explanation or giving an example, I might well wish
to have the ALT text be read or displayed _after_ the text.
In particular, if the image shows an example, it would usually
be better to give a corresponding textual explanation after the
general text. In such situations, I've sometimes considered using
a trick: use alt="" for the image, and put another <img> element,
with the desired ALT text and with a dummy SRC attribute (referring,
say, to a transparent single-pixel gif), after the text.

Unfortunately, there is no good structural way in HTML to indicate which
part of the textual content an image relates to. But putting an <img>
element inside a <p>, or inside a <div>, would indicate a logical
connection, in a sense. (Here I'm worried about the comprehension problems
of people who _do_ see the image but cannot understand what it relates to.)

-- 
Jukka Korpela
senior adviser (erityisasiantuntija)
TIEKE Tietoyhteiskunnan kehittämiskeskus
Finnish Information Society Development Centre
http://www.tieke.fi/
Phone +358 9 4763 0397
Received on Wednesday, 4 September 2002 03:46:13 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Tuesday, 19 July 2011 18:14:06 GMT