Jelly Buttons

When desktop publishing first came along, designers observed a phenomenon that became known as "ransom note typography." Basically, unsophisticated users were so intoxicated with the capabilities of PageMaker and other desktop publishing software that they started using multiple fonts with reckless abandon. The result resembled a note contructed of various letters cut from a newspaper or magazine.

Pretty much the same disregard for design principles is taking hold now on Web pages. The latest symptom of this I've noticed is the ubiquitous "liquid" buttons or "jelly" buttons that seem to adorn all sites now. This is information overload. Sure, they look very cute, and I'm sure when the Web team proposes them, the buttons look impressive enough to get the go ahead. But really, who needs this? They just make the buttons harder to read, and harder to hit with a mouse.

This is actually the continuation of the "2 1/2 D" trend ... making graphical interfaces appear to be made of real physical buttons, by highlighting the left and top edges, and darkening the bottom and right. This makes the buttons appear raised ... not quite 3 dimensional, but 2 1/2 dimensional. Cognitively, this makes sense, as our visual system is adept at picking up and these depth cues, and so we can readily distinguish buttons from other information via this pseudo-depth. (This is one reason why the 2 1/2 D look of HTML table borders is a really bad idea.)

The jelly buttons are completely gratuitous, and in many ways, diminish the legibility of the buttons. They are essentially eye candy. People are evidently impressed that it's possible to make something so cool looking, and mistake that for goodness.

People think interface design is about making screens look pretty. Not only is it *not* about making screens look pretty, it's not even about making them look readable and manipulable. Well, partly it's about that. Interface design is really about figuring out what model of data and operation the user should have in his or her head, and how to present information, and allow manipulations, that support that model. The prime directive is to make the user understand what he or she is doing, and what effect his/her actions will have.

Or, to put it more succinctly, good design is invisible.

By the way, there are countless other examples of wrenchingly bad Web site design. Many of these have already been discussed elsewhere, but I might still take a pot shot for fun.