With all the guidelines Google throws webmasters, I thought it was time for us to throw one at them. It’s time for you, Google, to start picking better icons to indicate your services.

I know Google is into usability. I’ve personally been a test subject a couple of times for their AdSense program. What I don’t get, is why they don’t use a fundamental usability technique to indicate different services. The icons they use to represent their services when logging in can only be described as pathetic.

Icons Should Give Clues

When using an icon next to a text link or as a button, it should give a visitor a clue. When you see an email icon, you know what it’s for. When you see a green beaker of fluid, dear Google, you do not think “earn revenue”.

Here is a screenshot taken from Google’s My Account page. Notice how poorly they have selected their icons. DO NOT DO THIS!!!

google

Who was in charge of picking these?

A beaker for AdSense? A beaker for Website Optimizer? A beaker for Audio Ads? Never use the same icon to represent different items. More importantly, never use an icon that it no way can possibly represent the service!

Gears for subscribed links? The real issue here is that this service is improperly titled. It should really be called Subscribed Search. This service has come and gone, and is now back. They haven’t figured it out themselves. Masterminds in the search industry, average in concept ideas and titles. If they decide to continue with the link idea, at least give us the chain that we are all used to seeing on the billion plus sites out there already using it.

Dear Local Business Center. Did you know that your designers think you are a map? You’re not you say? Well look at your icon. I’ve seen little kids who get this concept better than Google does. Say I’m wrong, please.

Google, have you looked at your icons lately? Maybe this old post of mine could help you: Using Icons in a Menu.

  7 Responses to “Nobody Informed Google on How to Select Icons”

  1. [...] Here is the original: Nobody Informed Google on How to Select Icons [...]

  2. The beakers mean google labs. A flow chart is a tool for websites. Local business center uses google maps hence the icon. You’re making a big deal of nothing.

    • Hey Haxxed, Thanks for the comment.

      Obviously I disagree, but to explain more. If the beaker meant Google Labs, then obviously it should go to Google Labs, not AdSense, Audio Ads, or Website Optimizer. Also, if you go to Google Labs, those three feature are no where to found in that menu. Beakers are a horrible representation. It’s also repeated 3 times. You should never do that.

      The flowchart…well you may have me there. It is a tool, but I think it’s a poor choice. Do a quick search using Google Images, and you will quickly see what most people are used to seeing when referencing tools. Try even searching for “Webmaster Tools”.

      Local Business Center purpose is to allow business owners manage their online presence through Google. It will effect how your business is pulled up in search and maps. So I believe a map still makes a poor choice here. You do not use the feature to search for a business on a map.

      Regardless of the choices, picking the same icon to represent as many as three different items is an extremely bad idea. Imagine jumping in a new car, and all the buttons had the same icon on the button. Do you know what they do without reading the manual? One of them should be right anyhow. Icons should/need to represent the function, and it should be overwhelmingly clear.

  3. Haha nice find ! Funny picture you got there!

  4. Yeah i found it was buggy also, the pages here load really slowly. I suppose it happens sometimes with sites

  5. [...] Nobody Informed Google on How to Select Icons [...]

  6. [...] Nobody Informed Google on How to Select Icons – About a week after this post, one of the icons on Google’s site changed! [...]

 Leave a Reply

(required)

(required)

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>