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.
Favicons are also seen in the:
- Favorites menu
- History menu
- Links toolbar
- Desktop.
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 toolbar, favorites or history menu.
How does favicons 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 toolbar, 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:
- 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 webpages,
the favicon is not always displayed if those pages have not been previously
bookmarked.
- 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 favicons 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 toolbar and, the favorites and history
menus.
What an economical way to stand out from anonymity!
© 2005 Henriette Martel-Lawson
