Recursive Function

Recursive Function Blog

The Color of a Button

December 4th, 2007 by August Trometer

My mantra is simple: no web page is perfect, and it can always be improved. Whenever I’m working on a web page — even one that has been “stable” for some time — I always examine the page to see if it can be improved upon. I check to make sure the page is as usable as possible, that the design is pleasing without being obtrusive, and that buttons and controls are easy to use but don’t get in the way.

For the most recent rev of FormSpring, I wasn’t happy with some of the buttons, and I made a few changes.

In one particular case, I went from this: Red X to this: Trash Can

It seems like a small, rather innocuous modification, and, to be honest, most people wouldn’t care or even notice. But in my mind, it’s a very important change.

Here’s the thing: deleting information is something that should never be taken lightly. When people depend on your website, they are counting on you to keep their data intact. As a developer, one of the ways you do this is by ensuring that the user can’t delete their data too easily.

The Delete button icon that we were using before is red and catches your eye far too easily. In fact, psychologically, red draws attention to itself, and this is exactly the opposite of what you want on a webpage. By drawing your eye, the button was almost shouting “Click Me!” That’s definitely not something you want the user to feel the urge to do.

The switch to the trash can conveys the same idea — that the user is throwing their data away — but it doesn’t call attention to itself. And when the user needs to delete something, they actually need to seek the button out. This brief pause helps ensure that the user doesn’t delete their information accidentally.

Leave a Reply