Logo Design & Your Favicon
United Kingdom
Founder and president John Williams literally wrote the book on brand standards for leading companies like Hewlett-Packard and Mitsubishi. An entrepreneur and former owner of many successful small businesses, John has served as Entrepreneur.com's branding columnist for over 5 years. Below are some of John's published articles:
Logo Design & Your Favicon: Spotlight Your Brand Online
By now, you’re probably familiar with the term “sticky website.” The phrase refers to a site that compels visitors to “stick around.” In order to entice visitors to stick around, however, your site must first project the image that you are a credible (i.e., large) company. If potential customers don’t have this comfort factor, they are likely to bounce before they even see what you offer. There are many aspects to developing a credible, “sticky” website, but one easy and valuable way is to create a “favicon.”
A “favicon” (short for “favorites icon”) is the 16x16 pixel image that appears next to a site name in the navigation bar of many browsers and in browser bookmarks or favorites lists (see MSN and Yahoo! below):
Until recently, only a few sites had favicons. Suddenly they are commonplace, appearing on bookmarks, tabs, URLs and more. In fact, favicons are fast becoming an important aspect of brand identity online. A favicon serves as a visual shortcut to your URL, a “mini-logo” that helps users remember and return to your site. Visitors can quickly identify it in browser tabs without having to read the URL address. And if someone bookmarks your site, your unique favicon will help your site stand out on their favorites list. So the question becomes: how can you distill your brand down to a simple image?
First, look to your logo. Your logo should capture your brand visually, so it works as the perfect foundation for favicon development. Can you translate your logo symbol into a 16x16 format? You will probably need to edit the symbol to make it work. Because of its size, a favicon does not allow for much detail, so it’s not the time to be fancy. If your logo design is already too complex, you’ll have difficulty reducing it to a favicon. That’s why it’s important to keep this new branding space in mind if you have not yet created your logo.
If you can’t work with your logo, try using the initial letter from your company name. Use a distinct font and add a small graphic element if you can. The arrow in Amazon.com’s favicon is a good example of this. Whatever your approach, remember that your favicon is your brand presence reduced to 256 pixels. It appears on valuable (if tiny) real estate online.
It’s fairly easy to add a favicon to your website. Save a 16x16 gif or jpg of your image as a favicon.ico and upload it to your root directory. Then simply add:
<LINK REL="SHORTCUT ICON" HREF="http://www.mysite.com/myicon.ico">
Obviously, “mysite.com” is used here as an example in place of your URL.
Nowadays, not having a favicon can reduce credibility. Remember, your favicon is often your visitors’ first impression of your brand online. Make it a great one!
By now, you’re probably familiar with the term “sticky website.” The phrase refers to a site that compels visitors to “stick around.” In order to entice visitors to stick around, however, your site must first project the image that you are a credible (i.e., large) company. If potential customers don’t have this comfort factor, they are likely to bounce before they even see what you offer. There are many aspects to developing a credible, “sticky” website, but one easy and valuable way is to create a “favicon.”
A “favicon” (short for “favorites icon”) is the 16x16 pixel image that appears next to a site name in the navigation bar of many browsers and in browser bookmarks or favorites lists (see MSN and Yahoo! below):
Until recently, only a few sites had favicons. Suddenly they are commonplace, appearing on bookmarks, tabs, URLs and more. In fact, favicons are fast becoming an important aspect of brand identity online. A favicon serves as a visual shortcut to your URL, a “mini-logo” that helps users remember and return to your site. Visitors can quickly identify it in browser tabs without having to read the URL address. And if someone bookmarks your site, your unique favicon will help your site stand out on their favorites list. So the question becomes: how can you distill your brand down to a simple image?
First, look to your logo. Your logo should capture your brand visually, so it works as the perfect foundation for favicon development. Can you translate your logo symbol into a 16x16 format? You will probably need to edit the symbol to make it work. Because of its size, a favicon does not allow for much detail, so it’s not the time to be fancy. If your logo design is already too complex, you’ll have difficulty reducing it to a favicon. That’s why it’s important to keep this new branding space in mind if you have not yet created your logo.
If you can’t work with your logo, try using the initial letter from your company name. Use a distinct font and add a small graphic element if you can. The arrow in Amazon.com’s favicon is a good example of this. Whatever your approach, remember that your favicon is your brand presence reduced to 256 pixels. It appears on valuable (if tiny) real estate online.
It’s fairly easy to add a favicon to your website. Save a 16x16 gif or jpg of your image as a favicon.ico and upload it to your root directory. Then simply add:
<LINK REL="SHORTCUT ICON" HREF="http://www.mysite.com/myicon.ico">
Obviously, “mysite.com” is used here as an example in place of your URL.
Nowadays, not having a favicon can reduce credibility. Remember, your favicon is often your visitors’ first impression of your brand online. Make it a great one!
