I was checking out a site referred to me by a friend at work: Safe Mothers, Safe Babies (SAFE). She said they needed some design help, so I thought I’d take a look. (You can contact them if you’re interested in helping out—looks like a great cause, helping mothers and babies in Uganda.)

As I browsed the site, there were clearly a lot of opportunities to spiff things up, but not that many that truly hindered understanding or use of the site. At least until I came to their multimedia gallery:

Interesting photos, but I am not sure what they are about. There are no labels on each photo to help me out, so I start looking for clues. At that point a new problem emerges. See it?

Seven nav links aligned pretty closely with seven columns of images. Without a closer examination, some folks might think that the nav links are related somehow to the content aligned beneath them—that they are column headings. Human beings are are meaning-makers, so we stretch and strain to figure out the relationship, to define a connection that isn’t really there. Confusion or at least a loss of time is the likely result. In worse cases, it might actually lead you to assume something that isn’t so—that the last column shows actual photos of the group’s headquarters or something, for example.

It struck me that this is a type of visual “tombstoning”—an unintentional (and often humorous) alignment of headings in newspaper or magazine layouts. Here’s an example from an About.com article on tombstoning:

Really? Dead Bugs Drink Wine? Were they dead before or after they drank it? Either way, that’s pretty interesting… but not what the authors or editors intended!

There’s obviously a lot more to say about The Principle of Proximity, but it’s good to keep in mind that:

It is not enough to group things that should be grouped.

You must also avoid grouping things that should not be grouped.

And if you’re interested in helping SAFE dig up and replace those visual tombstones, drop them a line—I’m sure they’d appreciate it!