I hate it when other people are right. Long story short, I’ve made a change to the icons at the top of the site because this annoying guy, Aza Raskin, a young internet user interface design expert, a fella who has difficulty finishing sentences, said in a presentation (long, uncomfortable, hard to watch video here) that doing beautiful iconography sans text wasn’t good. His reasons: 1. icons are not equally intelligible across every culture. 2. Removing text lowers the density of information on the screen. I.e. the site forces you to click in order to see what’s behind door number 1.

I confess. Guilty as charged: In the previous design (no text beneath the icons), you would indeed actually have had to click to know where the icons take you. The icons themselves are abstract and don’t clearly indicate their destination. And that is not ideal. I get it. But the trade-off is clutter. Aza’s point is to strike the balance between simplicity and usability. Though he calls it the “web tension between boring and annoying”. His slide for this concept uses pictures of pets to represent “Boring” and some “taser the gnome” game (wha? apparently it’s this. whatever.) to represent “Annoying.” Ok, hold on, Hotshot. You’re doing a presentation on interface design, not content design. The pet pics are boring CONTENT. What he actually means, what the whole presentation is about VISUALS, not content; he means boring VISUALS; he’s referring to the tendency of marketing folks pushing stimulating on screen visuals in favour of legible, but simple & easy-to-use web designs. Like I said, he can’t finish a sentence. Getting his own ideas mixed up while preparing a presentation would be a function of the same ADD or whatever he’s got sprinting in his head.

In the case of One-seventh vs man-child Aza Raskin, One-seventh offers the defence that there’s not really a whole hell of a lot of fascinating utility behind some of its icons anyhow and since  the site has only a handful of users, chances are those people already know what is and what isn’t behind them. So big deal. The preference for simplicity yields the no-text decision.And this is a nice idea and all is well. But I’ve learned that the icons are not actually being used. Perhaps people think they are just pretty pictures and not links. So yesterday I added a mild translucency hover effect so that users would know that SOMEthing happens when you click on one of the icons. I wanted text to appear below the icon only when you hover and the only thing preventing that was my elementary coding skills. And this would have been what Aza refers to as the “seduction of interaction” i.e. unnecessary gratuitous effects that impair usability. Well, frankly I would have done designed my gratuitous effect to be subtle and elegant, but he is right in that it would have impaired usability. Damn.

So after a bunch of work, we now have what you see above: static text beneath the icon. I think it looks ok, but I do miss the minimalism of the previous design. It’s a tad more conventional now, which irks me, but it does read as a bit more mature as well. Probably a good thing.

A note on text size

I wanted to use as small and discreet a font-size as possible, yet still be legible. In architecture, the conventional thinking is that if you want to shove a lot of text into a small space on a drawing, that you should use a condensed (tall, but squished) text. Total rubbish. The characters bleed into each other impairing legibility. They “don’t scale,” as all the kids are saying. The trick to legibility when space is at a premium is actually to use a square-ish text with plenty of spacing between letters. That way you can get the font size way down and still be able to read it. So I  go with my Gill Sans in all caps with luxurious spacing.