WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Newspaper style captions

for

Number of posts in this thread: 4 (In chronological order)

From: Kimberly Chapman
Date: Sun, May 11 2003 6:36PM
Subject: Newspaper style captions
No previous message | Next message →

Hi,

This is my first post to this list so please be kind. :)

I run the website for a small environmental organization. One of our
staffers is addicted to PDFs, and while I'm a stickler for ensuring there's
an accessible HTML version of every PDF I post, he's constantly giving me
grief that the photos and captions aren't where he wants them.

Basically, he wants the picture to be floating in the text with the caption
right under the picture, and for it to be clear that the caption is not
part of the body text. Now, by caption, I mean the newspaper meaning of
caption...I understand that there is a caption tag in HTML but it doesn't
seem to bear a resemblance to this style.

How do I do this in a manner that is both accessible and is visually
understandable? I don't want to use a table because then the paragraph
that the picture is integrated with will appear above or below, not around.

To give you an idea of what I mean, here's and example how he wants photos
to look: http://www.citizenalert.org/yucca/tournw0604.html

Only he wants captions below like I did here at the bottom of the page:
http://citizenalert.org/newsltr/winter2003essay.html

Everything I've tried thusfar has either not met accessibility/HTML 4.0
Transitional tests, or has been really weird-looking visually and makes it
hard to distinguish the caption from the body text. I can't even find help
in the Glasshaus Accessible Websites book I got. :(

Help would be appreciated! And feel free to use pedantic
explanations...I've been doing this for years but I'm entirely self-taught
so my knowledge is often lacking. :)

Thanks!


-- Kimberly Chapman
http://kimberlychapman.com/
= EMAIL ADDRESS REMOVED =


----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/


From: Jukka K. Korpela
Date: Sun, May 11 2003 9:11PM
Subject: Re: Newspaper style captions
← Previous message | Next message →

On Sun, 11 May 2003, Kimberly Chapman wrote:

> Basically, he wants the picture to be floating in the text with the caption
> right under the picture, and for it to be clear that the caption is not
> part of the body text. Now, by caption, I mean the newspaper meaning of
> caption...I understand that there is a caption tag in HTML but it doesn't
> seem to bear a resemblance to this style.

The caption element is for table captions only. But it might actually have
a role to play here.

> How do I do this in a manner that is both accessible and is visually
> understandable? I don't want to use a table because then the paragraph
> that the picture is integrated with will appear above or below, not around.

You could use an align attribute in a table element, and draw borders
around the table. If you have <table align="left" ...>...</table>, then
subsequent content will flow around the table on the right, which is
probably the goal here. (Posting the URL of a PDF file showing the desired
appearance could have helped to make sure we understand the issue the same
way.)

But there are more modern methods as well, based on the principle that in
CSS you can float virtually everything, not just images. Here's a simple
approach: In HTML, use
<div class="illus"><img ...><div>Caption text</div></div>
before the text with which the image is to be integrated. This means that
in non-CSS browsing situations, the image or its alt text comes first,
then the caption as a block of its own, then the normal text. This should
normally be tolerable, but you could always add
<div class="explain">The following picture illustrates the point
made in the text after it.</div>
with .explaing { display: none; } in CSS, though it would be difficult to
write such explanations without sounding too naive.

Anyway, in CSS you could then have e.g.

.illus { border: solid gray 1px;
margin: 0 0.6em 0.2em 0;
float: left;
text-align: center;}
.illus div { font-style: italic;
font-size: 90%;
padding: 0.1em 0.2em; }

It would take some experimentation to create a style sheet that creates
the desired visual appearance, but once done, it could be used
consistently across a site.

> Only he wants captions below like I did here at the bottom of the page:
> http://citizenalert.org/newsltr/winter2003essay.html

That page has some serious accessibility issues. If, for example, I print
preview it for a standard A4 size print, the first few letters of each
line of text are chopped off. This is because the page quite unnecessarily
imposes some faily large minimum width for its presentation - which means
that it won't work well in "small" browser windows. Actually I don't think
my typical browser window size, half of a normal 17" screen is
particularly small; good accessibility means a page's ability to adapt to
considerably smaller display areas, unless the content itself prevents
that. Here the problem has several roots: the navigation menu on the left
(which means eating up horizontal space), the relatively large photo, and
the rather wide logo.

The page carries a set of icons claiming this or that conformance or
validity. What is the real value of such icons to users? I'm sure it's
negative. What would _you_ think if you saw or heard, on a page you're
visiting, something like "R7K SGZF 42.5!"? This is what all those
"W3C HTML 4.01!" means to most users. For some
more arguments see http://www.cs.tut.fi/~jkorpela/www/acctools.html#stamp
http://www.cs.tut.fi/~jkorpela/html/validation.html#icon

(Besides, as so often, there's a mismatch between the claims and the
actual content. For example, the embedded style sheet
width=556px;height=78px does _not_ comply with any CSS specifications.)

--
Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/


----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/

From: Kimberly Chapman
Date: Sun, May 11 2003 9:33PM
Subject: Re: Newspaper style captions
← Previous message | Next message →

Okay, well, thanks for the advice on the caption question, but wasn't
looking for a critique of my organization's content choices. I don't think
that was necessary or appropriate.


----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/


From: Jukka K. Korpela
Date: Sun, May 11 2003 10:31PM
Subject: Re: Newspaper style captions
← Previous message | No next message

On Sun, 11 May 2003, Kimberly Chapman wrote:

> Okay, well, thanks for the advice on the caption question, but wasn't
> looking for a critique of my organization's content choices. I don't think
> that was necessary or appropriate.

If you ask in public for help with accessibility issues but aren't
prepared to notes on apparent accessibility problems, you should ignore
all future messages from me. I do take the liberty of pointing at major
accessibility problems, even if you ask about minor details. But I did
not criticize any content choices. (Not that I would refrain from doing so
if e.g. the content is _about_ accessibility.) I pointed at some
accessibility problems that had been created and that were not needed for
any particular content.

This is a discussion forum, not a helpdesk.

--
Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/


----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/