Elements of Excellent Photo Gallery Design

I just ran into this website, which is the only site on the entire fucking web that has done photo galleries correctly. I cannot overstate its uniqueness or importance. It is the only well-designed photo site on the entire web! The only one. Gaze upon it in awe as I did and behold its majesty!

When I saw the main page I got the impression it was made by a really good graphics designer. Because it looks really good and clean. The attention to detail is exquisite and exactly what you'd expect from an amazing graphics designer.

1. the background is subtle and washed out
2. the composition of the photo that makes up the background is amazingly well-suited to a background page with its star present but off-side
3. the colour choices of the background photo harmonize with those of the home page - it's all blues with the only exceptions being the star and the name of the site
4. the playful descriptions with arrows draw the eye towards the menu options without being desperate, condescending or stuck-up - imagine what it would look like if there were only arrows with no descriptions, or alternatively if the descriptions were in a formal typed font
5. the menu options are underlined but not in a forced way, because the coloured bar is underneath them like a thick fat yet subtle and tasteful underline
6. the underline doesn't draw attention to itself by being vivid or sharp yet succeeds in drawing the eye to what it underlines in a perfectly natural way
7. the name of the site is in bright vivid letters to make it distinctive, and it's repeated because it's that important
8. the photo examples from new galleries cycle - at first I thought too fast but now I think just right
9. no euphemisms are used for the paid portion of the site which conveys refreshing honesty and directness
10. and the lack of minimization / maximization games (euphemisms like "member" or "join" but repeated all over the place) is tasteful and elegant

And then I saw the photo gallery and I was in awe. Because its behaviour is absolutely correct. You don't see that with mere graphics designers.

1. wasted space between photos is minimized with just enough to create boundaries
2. the grey colour that makes up the boundaries is exactly the same shade of grey water as in the home page - minimizes cognitive disruption
3. there are no elements other than the photos and the scroll bar
4. there are no active elements
5. none of the scrolling is hierarchical, you don't have to back out to go to the next photo or to see what's ahead
6. you can see all the photos in the gallery at once in miniature in the scroll bar
7. the scroll bar is vertical which allows the mousewheel to come into play
8. and harmonizes with the vertical pan motion you frequently use to see photos of people
9. the scroll bar is always visible, something that's difficult to achieve if the scroll bar is at the bottom of the screen but easy when it's at the right
10. even without the mousewheel, moving the mouse vertically the height of a screen is easier than moving it horizontally its entire width
11. scrolling the photo and scroll bar are overloaded functions, which is bad, however at least you CAN do both without repositioning the mouse, which is good
12. there are only just enough photos in a gallery so that the scroll bar will still fit entirely in a screen
13. and since this is the height of a screen, all of the photos in the gallery are accessible through a simple hand motion
14. while the scroll bar fills up the entire vertical extent of the screen - which it wouldn't if it were horizontal and limited to a simple hand motion, not with today's wide screens anyways
15. the designer is arrogant enough to disable all of the default or normal ways of doing things and demand you do it their way, using the scroll bar, so that you appreciate what a great site this is

The web was invented two decades ago and this is the first site I've encountered that has done photo galleries right. I think this says something about programmers' skills, talents, judgement and competence. Something exceedingly bad across the board.

Note that all of the galleries' behaviours and arrangement on this site ought to be encoded and determined by the web browser, not by the site owner. The instant you have a photo gallery with portraits, it should always, always look exactly like this. And when you have a photo gallery with landscapes then the only deviation is the scrollbar goes along the bottom of the screen. Because the rule is that the scroll bar should never, EVER form a visual boundary in the middle of a photo. There are no better options. The only open variable is the shade of the background between photos.

The only things missing in that gallery are two active things. The current photo should be outlined in yellow or highlight & washed out in white, or both. And there should be keystrokes to go to the previous and next photos in the list as well as first and last. And the behaviour of 'next' at the last photo should either be the next gallery or cycle back to the first photo.