To the Ministry's main lobby The Ministry Blog
concert setlists

2 June, 2004

Web gallery design tip

If your website has a gallery of photographs, some landscape-orientated, some portrait, the positioning of the 'next'/'previous'/'back to index' links matters.

If above the images, the links will tend to appear in exactly the same place on each page.  This means a visitor could hold the mouse cursor over the consistently-located 'next' link and easily browse through the whole gallery.

If below the images, a visitor may need to scroll to find the links, and varying image orientation means they won't automatically line up, so the mouse will need to be repositioned on each page - a tiny inconvenience, but the sort of thing that makes a difference to the browsing experience.


Is it not better to have links at *both* top and bottom of the images? Then if any particular image doesn't fit onto my screen, and I've scrolled down to see the bottom of it, I don't have to scroll back up in order to get to the next one.

Posted by Adrian McEwen at June 2, 2004 04:15 PM

Quite right. In general (though not at the Ministry, oddly enough), I tend to use graphical buttons as primary navigation across the top, and text links across the bottom, the latter doubling as primary navigation for text-based browsers.

Though both is better, if only one is used, I recommend it being above the images, in precisely the same place on each page, so it's easier to flick through the images rapidly without moving the mouse. If one is stopping to examine every image, and scrolling to see parts off the page, this is less relevant, of course.

I've lost the link already, but this posting was inspired by viewing a gallery of 80-100 images, of which I only needed to study 2-3 in depth, as I knew what I was looking for. All images were, say, 400x300px in size, but presented as 400x300 (landscape) or 300x400 (portrait) - links underneath didn't line up, but links at the top would have done. I could evaluate each image's content and reject it within a fraction of a second, and was ready to click onto the next, but scrolling and hunting for the 'next' arrow (a red 12pt '>>' against a black background) slowed me considerably.

It's ultimately trivial, but a bit of thought does improve usability.

Posted by NRT at June 2, 2004 04:47 PM
Site Home Tull Tour History Annotated Passion Play
Day in the life... Page design and original graphics © NRT, 2003