Highlight Your Brand with a Favicon
Join us for a free, live webinar and learn how to drive revenue with content marketing. Tune in 8/4 at 10:30 a.m. PT. Register Now »
By now, you're probably familiar with the term "sticky website." The phrase refers to a site that compels visitors to "stick around." To entice visitors to stick around, however, your site must first project the image that you're a credible (i.e., large) company. If potential customers don't have this comfort factor, they're 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're 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="icon" href="http://www.yoursite.com/favicon.ico"type="image/x-icon"/>
To make this show in Internet Explorer, add:
<link rel="shortcut icon" href="http://www.yoursite.com/favicon.ico"type="image/x-icon"/>
Obviously, "yoursite.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.