Posts Tagged icon
I came across these interesting icons on IBM’s site today, which are all part of creating a smarter planet, whatever that means. I’m trying to decide what I think of them.
While they are quirky and interesting to look at, most of them don’t convey any sort of meaning, which I believe is an important component of a good icon.
Nor do they scale very well, as you can see from their use in the mega menu below:
What’s also interesting is that many of these icons have avoided following any conventions for how certain icons should look. For example, the security icon does not include a representation of a lock and the analytics icon does not use any kind of graph or chart in its design.
I imagine that they represent part of a larger branding initiative, which you can see when you click through to a page represented by an icon. However, it’s questionable whether this is more important than actually making the icons useful.
At the end of the day, these icons are clever but are they any good?
Back in 2007, Get Elastic posted a handy collection of add-to-cart buttons along with some analysis of the label text and use of icons. I thought it would be useful to revisit this topic and so I gathered together over 200 add-to-cart buttons, including many from the top online retailers.
Add-to-cart buttons
As you can see from the collection above, add-to-cart buttons come in all sizes and colors, with a selection of choices for button text. Let’s see what trends emerge from all this variety.
Button Color
As far as color is concerned, add-to-cart buttons mainly come in red, blue, gray/black, green, orange, pink, or yellow.
Gray/black and red are the most popular color choices at about 20% of buttons, followed by green and blue at just over 15%. Regardless of the button color, white is the overwhelming choice for button text.
Add-to-cart button colors
Button Shape
Buttons were all rectangular in shape, but when it comes to the finer details, rounded corners beat out square corners almost 2:1 in terms of popularity.
Add-to-cart button corner style
Button Text
Looking at the breakdown of button text, ‘add-to-cart’ is the runaway favorite with 56% of buttons opting for this label. It’s worth noting that this is a largely US-centric collection, and that ‘add-to-basket’ is more common in the UK than in the US.
Add-to-cart button text
When it comes to writing button text, ALL CAPS is the favorite with 53% of buttons using this style of formatting.
Add-to-cart button text case
Button Icons
The use of icons is almost a 50/50 split, although buttons without an icon are slightly more popular than those that use an icon of some sort.
Icon use in add-to-cart buttons
For those buttons that do include an icon, a shopping cart is most popular (40%), followed by some type of arrow (28%).
Icon style in add-to-cart buttons
In this freebie icon set, you will find 16 free social media icons for sites that designers appreciate (such as deviantART, Flickr, Twitter, and more). This free icon set is called A Life in Pixels and is inspired by Minimalist design philosophies.
The set includes 16 32px x 32px PNG files. They are monochromatic and can work with many other colors, which is perfect if you are looking for icons that are subtle and muted so that they do not dominate your design.
