E-mail List Archives

Search E-mail List Archives for

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

From: Kyle Gong
Date: Thu, Jul 27 2006 10:20AM
Subject: Alt Text for Decorative Linked Graphics
No previous message | Next message →

Hello all!



I have a question about using alt text for linked graphics. There are a
number of graphics on our site that are basically decorative. They are
just icons for different pages... a magician's hat for "Tips and Tricks"
a pair of eighth notes for "Personalize" etc. We originally gave them
blank alt attributes... alt="" because we figured they were basically
decorative. However, we just recently discovered that screen readers
will still read the location of the graphic if it has a blank alt
attribute, but is a link. What is the correct way to go here?



Thanks,

Kyle Gong

From: Moore, Michael
Date: Thu, Jul 27 2006 10:30AM
Subject: RE: Alt Text for Decorative Linked Graphics
← Previous message | Next message →

That's an easy one Kyle,

The alt text should say where the link is going. Thus the magician's hat
should say "tips and tricks" and the eighth note should say
"personalize." :)

Now if the anchor is wrapped around both the image and a text link that
says where the link is going, you can use alt="".

Mike

From: Jukka K. Korpela
Date: Thu, Jul 27 2006 10:50AM
Subject: RE: Alt Text for Decorative Linked Graphics
← Previous message | Next message →

On Thu, 27 Jul 2006, Moore, Michael wrote:

> The alt text should say where the link is going. Thus the magician's hat
> should say "tips and tricks" and the eighth note should say
> "personalize." :)

Quite right. (I won't comment on the word "personalize", which is really
jargon-like and not necessarily accessibility. If the site uses that word,
then surely it should be used as the alt text of a link too.)

> Now if the anchor is wrapped around both the image and a text link that
> says where the link is going, you can use alt="".

Such an approach is actually preferable. It is better to write

<a href="personalize.html"><img src="note.gif" alt=""
border="0">Personalize</a>

(using an image and a word together as a link)

than

<a href="personalize.html"><img src="note.gif" alt="Personalize"></a>

(using only an image as a link)

or

<a href="personalize.html"><img src="note.gif" alt="Personalize"></a>
<a href="personalize.html">Personalize</a>

(using an image and a word as separate links to the same destination).

The reason is that an image and an associated text are often more helpful
than an image alone, and making them two separate links could confuse
people and would make navigation with keyboard a little less convenient
(since the other link would be redundant).

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

From: Patrick H. Lauke
Date: Thu, Jul 27 2006 12:20PM
Subject: Re: Alt Text for Decorative Linked Graphics
← Previous message | Next message →

Moore, Michael wrote:

> Now if the anchor is wrapped around both the image and a text link that
> says where the link is going, you can use alt="".

Or, if it's practical, you could use CSS to add those decorative images
to the links, thus completely circumventing the problem.

P
--
Patrick H. Lauke
___________
re

From: Kyle Gong
Date: Mon, Jul 31 2006 1:30PM
Subject: RE: Alt Text for Decorative Linked Graphics
← Previous message | Next message →

Thanks for the advice everyone.

It worked for many places, but unfortunately on some of the pages we
have the icons and the header links on separate, which means we have to
have a block level element inside of an inline element. Headers are
block level also, but IE doesn't seem to have as much of an issue with
that...

What do you suggest if the icons and link text are on separate block
level elements?

If we can't fix the problem, is it better to have the image have blank
alt text and have JAWS read the image path, or to have it read the same
link location twice?


Thanks,
Kyle Gong

From: Charles Kroger
Date: Mon, Jul 31 2006 1:40PM
Subject: RE: Alt Text for Decorative Linked Graphics (Out ofoffice reply)
← Previous message | No next message

I will be out of the office Monday, July 31 through Wednesday, August 2.

For immediate assistance please contact the ITS Help Desk: 612-659-6600
or = EMAIL ADDRESS REMOVED = .

For D2L assistance, please contact = EMAIL ADDRESS REMOVED = .
Please include the relevant:
- course name and number,
- tech-ID numbers,
- and username(s)
to expedite the resolution of your issue.



Thanks,

Charles Kroger
Web Developer
Minneapolis Community and Technical College