Design vs Art Blog

A favicon is an icon associated to a website or web page, it is also called website icon or page icon. There are several ways to implement it but the most traditional one is placing a favicon.ico image file. This image is going to be displayed in the web browser tool bar and bookmarks.

Favicons are not only important for marketing and branding proposes but also for usability:

- Favicons help the user to identify pages among the web browser tabs

- They help to visually identify bookmarks

- Because of the previous two points, they make users to save time and to make internet browsing a more comfortable experience

Tabs

Notice how easy it is to identify tabs if they have favicons:

Bookmarks

Users can easily search through bookmarks that have favicons:

The Branding Problem

Sometimes using favicons requires to make a balance between branding and usability. In the following example Google uses the same favicon for all its services. This has a positive and a negative effect: on one side different services benefit from the main Google brand if they share the same favicon, on the other side it makes difficult to differentiate different pages and services from the same company.  This a valid approach but using several favicons for different services of the same company/website could improve usability.

The Google favicon among different services:

Popularity: 64% [?]

White (or blank) spaces are a good thing, at least in web design. As the web becomes more and more faster designers and programmers tend to place more features. At the end of the 90s we saw colors, pictures and sound in an excessive way. Unfortunately many  web designers didn’t learn the lesson: sometimes, maybe usually, more is less.

Too much information and features are going to make a website difficult to use and to understand, affecting the whole site usability in a negative way. Users may feel themselves lost and silly, and they might leave forever.

This problem is starting to be seen at Amazon.com. There, the user is bombarded with a huge amount of information, images and interactive features. Just imagine for one minute that your a new customer at Amazon and you find yourself at this website:

Another example is the Musician’s Friend website. Leaving almost no blank space gives the feel that using this site will be a headache.

A good example

Flickr leaves a lot of blank spaces between elements, typography is big and homepage is not overloaded with information. Flickr is a powerful website that gives users a feel of simplicity. Notice the difference?

Popularity: 17% [?]