Marketing Cues
home

articles

reviews

free tools

about us

contact us






Branding with favicons


What are favicons?

Favicons (short for FAVorite ICON) are the miniature logos that you see displayed beside the website address or URL in the address bar in Internet Explorer or location field in Netscape Navigator. Favicons are also called shortcut icons and the most familiar ones are most probably the default browsers’ favicons.
 

IE favicon in address bar Marketing Cues Favicon in address bar

Favicons are also seen in the:
 

Favorites menu History menu Desktop
Favicons in Favorites menu Favicons in History menu favicons on desktop


Links bar

Favicons on Links bar


Branding benefits of favicons

A favicon serves as a visual reference that strengthens your identity and individuality. Even on a tight budget, you can take advantage of its numerous benefits:

  • Visibility: stands out in the address bar and other locations where the favicon is displayed.

  • Professionalism: demonstrates your attention to detail and puts you in the same league as well-branded companies who have their own favicons e.g. ebay.com, adobe.com, amazon.com.

  • Brand recognition and repeat exposure: reinforces your brand each time people view your logo in the address bar and the locations where your favicon is displayed.

  • Differentiation: accentuates the difference between you and your competitors.

  • Usability: makes it easy to scan and locate your shortcut on a desktop, links bar, favorites or history menu.

How does a favicon work

A favicon file is recognised by its extension .ico.

One file can contain several icon pictures in different sizes. The most used sizes are 16x16 pixels and 32x32pixels.

When required, the browser fetches from within the .ico file the picture that will fit the application. For example, a 16x16 picture is used for the address bar, links bar, favorites and history menus, whereas a 32x32 picture is used for shortcuts on the desktop and icons in Windows Explorer.

When a person downloads a webpage, the browser searches for the favicon.ico file in the site’s root directory. For example, type http://www.marketingcues.com/favicon.ico and your browser will display my favicon. If there is no favicon.ico file, the browser’s default icon will be displayed in front of the URL.

If you intend to place your favicon in a place other than the root directory such as in your images folder, you must insert the following metatag in the <head> section of each webpage to help the browser find the file:

<link rel="shortcut icon" href="http://www.yourdomain.com/images/favicon.ico">.
 

How to create your favicon

Digitope™ has a tool called Pixelshop that enables you to create a favicon from scratch or from an existing picture. It’s so easy! My favicon has been done with Pixelshop. The free trial period is generous and it gives you enough time to create your first favicon and appreciate this very useful tool. Give it a try at http://www.digitope.com/pixelshop/index.htm.

Favicon limitations

Not all webpages will display the favicon in the address bar. Favicons can be unpredictable. These are my observations:

  1. The favicon is displayed in the address bar for the landing page (the first webpage of your website that people download). As for the subsequent web pages, the favicon is not always displayed if those pages have not been previously bookmarked.
     
  2. Occasionally, the favicon will not display at all in the address bar. It seems to be ‘stuck’. To view it, you need to wiggle the default IE icon with your cursor. (Obviously, you couldn’t expect visitors to resort to this technique.)
     

Conclusion

Branding with a favicon is easy and inexpensive. And they add a professional finishing touch to your website. Don’t let my observations put you off: the problems I experienced were all associated with the display in the address bar. The favicon looks great on the desktop, the links bar and, the favorites and history menus.

What an economical way to stand out from anonymity!  

© Henriette Martel