Your browser is no longer supported! Please upgrade your web browser now.

I Don’t Like the Taste of Gmail’s Icon Soup

Update (3/21/12): Google now offers a setting to change Gmail’s buttons to a text label. Icon buttons are still the Gmail default, but this is a welcome change for anyone who feels that the icons slow their flow down.

Recently, Google released an updated Gmail look which affected the interface pretty drastically. My gut reaction to the change was not good. People tend to be fairly averse to sudden, dramatic change and it’s very easy to have a knee-jerk reaction of “I hate this” whenever something you’re familiar with changes. With that in mind, I decided to use the new design for awhile before I gave up and ruled it a disaster. Sure enough, I’ve grown to appreciate many of the choices the Gmail team made and have found some of the changes to be quite an improvement.

There is one facet of the new design, however, that I cannot get past. Whenever I view an email, I am presented with these controls at the top of each message:

Gmail’s new message toolbar

Can you tell me with certainty what each of those buttons will do to the message? I can’t and I have to stop and think about what these icons mean every time I try to do something. Icons that aren’t instantly and naturally understood slow me down — and getting slowed down for no good reason makes me cranky.

In my opinion, these new button styles are a giant step back from the previous version of Gmail. Is there any doubt about what most of these buttons will do?

Gmail’s old message toolbar

When you see icons that aren’t intuitive, it’s often because the software team chose their convenience over making things easier for the user. Designers like icons because they are prettier than text and they more easily fit in a confined space (you don’t need to worry about text overflow on a 16×16 graphic). Programmers like icons because there’s no need to translate an extra label.

The best icons express crystal clear functionality with their simplicity and context. A trash can or an “x” next to an item in a list is a good indicator you’re about to delete or remove something. A lock graphic next to a disabled form element helps emphasize that an item is not editable. A partially shaded battery on an electronic device is a clear way to express remaining charge.

Icons in software can be a beautiful thing when executed properly. Given a choice between an ambiguous icon and a text label, however, text is the clear choice for conveying a buttons’s function quickly and clearly. Your users will never have to guess what that stop-sign exclamation looking icon means when they want to mark their 1000th viagra email as spam.

Gmail’s buttons when composing a message

Frustratingly, Google uses text labels when you’re composing a message. I wish they would be consistent and apply this style to all of their buttons in the new Gmail. How about you?

Thoughts or questions about this post? Need some help?
Get in touch →

This was posted in Design.
  • “Icons that aren’t instantly and naturally understood slow me down…”

    No symbol can be ‘naturally’ understood. How many trash cans, archives, spams… exist in nature? None. Same goes for concepts – how many of those exist in nature?

    Symbols are a culture phenomenon and only make ‘sense’ because you grew up around them. Can you tell me what that means?

    To people in China, this is a perfectly ‘natural’ sign and obvious.

    Besides, the icons have info popups when moused over, which has been a computer convention for almost 20 years.

    Lastly, you claim that the text ‘Archive’ is less ambiguous? Well it is if you:

    1) Understand what ‘Archive’ means in regards to email.
    2) Can read
    3) Can read English

    What is your plan when you go to another language like German which almost doubles the length of words or in a language written vertically? How do you scale that? Are you going to not only localize the language of your UI but the design as well (to accommodate these different language formats)?

    Besides all that you do have a point about the mismatch of using the prose ‘Send’ instead of an icon.

  • Iconography can be very tricky. In Infrastructure Architecture, this is a huge minefield. I can’t tell you how many sites I do an SEO analysis on, and I can’t find the label marked “home” or something obvious. Then the company owner says, “see that cute picture? That’s our home page button! Everybody says the same thing you just said!”

    Well then, Mr. Business Owner…how about taking a HINT and making it obvious?!

    So, yes, I feel your pain…great post!

  • Alan, localization limitations are no excuse. Make the buttons twice as long in German if necessary. Pair the text with the icons for 5 years at least. The bottom line is that the icons are slower to process for a huge set of users.

Comments have been closed for this post.
Still have questions? Contact our support team →