"Click for larger image"?

I have a couple of pages on which I describe a book. Alongside the
text, there's an image of the book's cover, which links to a lager
version of the same image. See for example
http://www.jules-verne.nl/gb/2005/book.shtml.

Until now, I've put the text "Click for larger image" underneath this
smaller image, so visitors know they can see it in more detail. But I'm
not so happy with this, because:

1) It doesn't look so nice, the page would look better without this
kind of extra text (although that's a matter of taste). Especially on a
page with more such images, it looks a bit clumsy.

2) Not everyone clicks on links to follow them: visitors may use a
keyboard, speech browser or whatever.

3) I'm wondering if the link has a meaningful link text this way. In my
case, the alt text of the image is the title of the book, which of
course also describes the larger version of the image, but it still
doesn't make clear exactly what the link leads to.

There are several other ways to indicate that the image links to a
larger version:

- Putting a border around the image, so it's clear that it's a link.
But then you still don't know what it links to, and a border looks ugly
(again, a matter of taste, I agree)

- Mentioning it in the text inself: "This book is very interesting, and
here is some info about it. It's about foo and bar and baz. The image
on this page links to a larger version of the same image." In this
case, you first have to read all of the text before you know that a
larger version is available.

- Putting a small magnifying glass icon alongside, or even superimposed
on, the image. This small image would go inside the <a> element. But if
you want the magnifier image to be small enough not to ruin the entire
image, it may be too inconspicuous to be noticed. Also, its meaning may
not be clear to all visitors (although an alt and a title attribute
might help).

What do people feel is the best approach, from an accessibility and
usability point of view, but keeping in mind the aesthetics of the
page?

--
Garmt de Vries.

Garmt de Vries wrote:

Until now, I've put the text "Click for larger image" underneath this
smaller image, so visitors know they can see it in more detail. But I'm
not so happy with this, because:

I've always found linking on images non-intuitive, especially when

there is caption text about clicking somewhere.
In your case I am confused because of the text "Click for larger
image". Click what? Where? Oh, over yonder on the image. Maybe? Ah, an
Easter Egg Hunt!
The method I prefer is the text "[Larger Image]" that is an actual link
to a larger image. There is the text explaining what the link is, and it
is obviously a link.

--
jmm dash list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

I've never done anything special on my screen shots. Based on access
statistics it's obvious that people realise the clicking on a small
image results in getting a large one.

--
Steve Wolstenholme Neural Planner Software

EasyNN-plus. The easy way to build neural networks.
http://www.easynn.com

Garmt de Vries wrote:

I have a couple of pages on which I describe a book. Alongside the
text, there's an image of the book's cover, which links to a lager
version of the same image. See for example
http://www.jules-verne.nl/gb/2005/book.shtml.

Until now, I've put the text "Click for larger image" underneath this
smaller image, so visitors know they can see it in more detail. But I'm
not so happy with this, because:

1) It doesn't look so nice, the page would look better without this
kind of extra text (although that's a matter of taste). Especially on a
page with more such images, it looks a bit clumsy.

2) Not everyone clicks on links to follow them: visitors may use a
keyboard, speech browser or whatever.

3) I'm wondering if the link has a meaningful link text this way. In my
case, the alt text of the image is the title of the book, which of
course also describes the larger version of the image, but it still
doesn't make clear exactly what the link leads to.

There are several other ways to indicate that the image links to a
larger version:

- Putting a border around the image, so it's clear that it's a link.
But then you still don't know what it links to, and a border looks ugly
(again, a matter of taste, I agree)

- Mentioning it in the text inself: "This book is very interesting, and
here is some info about it. It's about foo and bar and baz. The image
on this page links to a larger version of the same image." In this
case, you first have to read all of the text before you know that a
larger version is available.

- Putting a small magnifying glass icon alongside, or even superimposed
on, the image. This small image would go inside the <a> element. But if
you want the magnifier image to be small enough not to ruin the entire
image, it may be too inconspicuous to be noticed. Also, its meaning may
not be clear to all visitors (although an alt and a title attribute
might help).

What do people feel is the best approach, from an accessibility and
usability point of view, but keeping in mind the aesthetics of the
page?

Garmt,

CSS uses the term 'activate' in the description of link pseudo-classes,
so you could say "Activate for larger image" to avoid using 'click'.
Sounds awkward to me. And you should be able to activate this text as
well as the image itself.

You could create a magnifying-glass cursor and then use cursor :
url("magglass.cur") to style the <img> element. But the user would see
this visual hint only if they moved the mouse pointer over the image.
(This is what Netscape (and probably Firefox) does when you display a
..jpg outside of HTML. The image is initially scaled to fit the window,
but the magnifying-glass cursor alerts you that you can click and see it
full size.)

I like a separate "[Larger image]" text link (as suggested by Jim Moe)
or an image equivalent, such as the magnifying glass you propose above,
which I would position just outside the image near the lower-right
corner. Or nothing at all, since most users, in the absence of any
prompting and with the incentive that the image is smaller than they
prefer, will click on it (excuse me, activate it) in hopes that this
will make it larger.

Chris Beall