WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: CSS Photo Shuffler Accessibility

for

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

From: Laura Carlson
Date: Mon, Nov 13 2006 11:00AM
Subject: CSS Photo Shuffler Accessibility
No previous message | Next message →

Any opinions on the accessibility of Carl Camera's "CSS Photo Shuffler":

http://iamacamera.org/sandbox/photoshuffler/

We are contemplating using something like this on one of our sites.

It doesn't seem to flicker or produce a strobe-like affect. But is the
slow fading affect a problem?

Our University standard [1] says to:

"Avoid the use of blinking page elements and scrolling marquees.
Blinking page elements and the refreshing of the screen to animate
marquees shall do so at a frequency of less than twice a second (2 Hz)
or greater than 55 times a second (55 Hz)."

Also is the lack of an on/off switch that the _user_ could
control...with _off_ as the default a problem? Any other problems with
it?

Thanks,
Laura

[1] http://cap.umn.edu/ait/web/BlinkingPageElementsAndMarquees.html

___________________________________________
Laura L. Carlson
Information Technology Systems and Services
University of Minnesota Duluth
Duluth, MN U.S.A. 55812-3009
http://www.d.umn.edu/goto/webdesign/




From: Keith Parks
Date: Mon, Nov 13 2006 11:30AM
Subject: Re: CSS Photo Shuffler Accessibility
← Previous message | Next message →


On Nov 13, 2006, at 9:48 AM, Sandra Clark wrote:

> The slow fading isn't a problem,
>
> What are problems is the lack of viable alt attributes describing each
> image.

Couldn't you get around that by using the "longdescr" link attribute
as part of the img tag?


******************************
Keith Parks
Graphic Designer/Web Designer
Student Affairs Communications Services
San Diego State University
San Diego, CA 92182-7444

(619) 594-1046

mailto: = EMAIL ADDRESS REMOVED =
http://www.sdsu.edu
http://www.sa.sdsu.edu/communications
----------------------------------------------------------

World Peace through Cascading Style Sheets.






From: Stephanie Leary
Date: Mon, Nov 13 2006 1:20PM
Subject: Re: CSS Photo Shuffler Accessibility
← Previous message | Next message →

Keith Parks wrote:
>> The slow fading isn't a problem,
>>
>> What are problems is the lack of viable alt attributes describing each
>> image.
>
> Couldn't you get around that by using the "longdescr" link attribute
> as part of the img tag?

As written, the example sets the photos as background images on a div. Only
the first image in the sequence actually has an img tag.

--
Stephanie Leary
Web Communications Specialist
Texas A&M University System
http://tamus.edu





From: Austin, Darrel
Date: Mon, Nov 13 2006 2:30PM
Subject: Re: CSS Photo Shuffler Accessibility
← Previous message | Next message →

> It doesn't seem to flicker or produce a strobe-like affect.
> But is the slow fading affect a problem?

How accessible do the images need to be? Is it decorative fluff?
Important content?

Usually, IMHO, most slideshows I see are decorative fluff. Nice to have,
but don't really affect the purpose of the site if a person can't see
it.

As stated, this particular script rotates the background image of a DIV.
As such, from a semantic standpoint, it's set up as a bit of decorative
fluff. Just a page should work just fine without background images, a
page using this particular slide show should work/read just fine even if
the slideshow itself isn't accessible.

-Darrel




From: Keith Parks
Date: Mon, Nov 13 2006 2:50PM
Subject: Re: CSS Photo Shuffler Accessibility
← Previous message | Next message →


On Nov 13, 2006, at 12:18 PM, Stephanie Leary wrote:

> As written, the example sets the photos as background images on a
> div. Only
> the first image in the sequence actually has an img tag.

Right.

And so the long description on the initial image would need to
describe the whole series of images, something like "A series of
five photographs. The first photo is of the Oregon coast line. The
second photo show a pathway on a bluff above the water. The third
photo shows two boys running in the surf..." etc.

Or am I misunderstanding the proper use of a longdesc link?

******************************
Keith Parks
Graphic Designer/Web Designer
Student Affairs Communications Services
San Diego State University
San Diego, CA 92182-7444

(619) 594-1046

mailto: = EMAIL ADDRESS REMOVED =
http://www.sdsu.edu
http://www.sa.sdsu.edu/communications
----------------------------------------------------------

A riddle wrapped in a mystery inside an enigma, served with a side of
slaw.





From: Emma Duke-Williams
Date: Tue, Nov 14 2006 2:10AM
Subject: Re: CSS Photo Shuffler Accessibility
← Previous message | Next message →

I'd tend to agree with Darrel - in the particular example, the
pictures are just for decoration.
Given the comparatively small numbers of people who are totally blind,
as compared to those who have limited vision, I'd have thought
offering people the option to have a full screen, hi-res option would
help more people.

Another idea, that I know I've mentioned in the past is the script
that they've used at http://persistent.info/files/20040508.magnifier/
to enlarge sections of an image.

As to the description - have you seen Craig Grannel's script as he's
used on http://www.snubcommunications.com/iceland/ - that has a
(admittedly pale grey) caption under each photo. Perhaps a combination
of those two scripts would allow you to have changing images &
captions.

Emma

On 11/13/06, Austin, Darrel < = EMAIL ADDRESS REMOVED = > wrote:
> > It doesn't seem to flicker or produce a strobe-like affect.
> > But is the slow fading affect a problem?
>
> How accessible do the images need to be? Is it decorative fluff?
> Important content?
>
> Usually, IMHO, most slideshows I see are decorative fluff. Nice to have,
> but don't really affect the purpose of the site if a person can't see
> it.
>
> As stated, this particular script rotates the background image of a DIV.
> As such, from a semantic standpoint, it's set up as a bit of decorative
> fluff. Just a page should work just fine without background images, a
> page using this particular slide show should work/read just fine even if
> the slideshow itself isn't accessible.
>
> -Darrel
>
>
>
>


--
Blog: http://www.tech.port.ac.uk/staffweb/duke-wie/blog/




From: Laura Carlson
Date: Tue, Nov 14 2006 8:20AM
Subject: Re: CSS Photo Shuffler Accessibility
← Previous message | No next message

Keith Parks wrote:

> And so the long description on the initial image would need to
> describe the whole series of images, something like "A series of
> five photographs. The first photo is of the Oregon coast line. The
> second photo show a pathway on a bluff above the water. The third
> photo shows two boys running in the surf..." etc.
>
> Or am I misunderstanding the proper use of a longdesc link?

I think you got it Keith. Thanks to Sandra and Stephanie for bringing
up the no alt for the image sequence issue. And thanks to Darrel for
the decorative fluff vs content review.

This seems to be the same type of problem we used to have with animated
gifs in the 'old' days. If the animated gif was indeed content and not
fluff, the way around it [1] was to have the initial image:

- Use alt text that reflected the most representative frame.
- Use a title to mention it was an animation or related information.
- Use a longdesc [2] to describe the complete animation.

Emma's idea of captions for the images would also help people who have
JS enabled.

But there is still the problem of no on/off control. Some people may be
unable to tune animations out and concentrate on the actual page
content. They may be sensitive to movement and have difficulty focusing
and the page may become difficult to read.

Best Regards,
Laura

[1] http://joeclark.org/book/sashay/serialization/Chapter06.html#h2-3545
[2] http://www.webaim.org/techniques/images/longdesc.php#longdesc

___________________________________________
Laura L. Carlson
Information Technology Systems and Services
University of Minnesota Duluth
Duluth, MN U.S.A. 55812-3009
http://www.d.umn.edu/goto/webdesign/