Girls especially know the truthfulness of the idiom above; when getting a gift, a small box is generally well received (ie:jewelry). So, what small packages come in the design world? Well, for one, the favicon.
What is a favicon? It kind of tells you what it is in the word itself: “fav” meaning favorites, and icon… well, I think you probably know what an icon is at this point. Favicons are also called shortcut icons. Most likely you see them all the time (see the image below). Whenever you visit a website that has a favicon, it is usually displayed on the browser tab. Or if you save a website to your favorites, the favicons show up on the list (thus the name “favicon”). These icons are very small — only 16 pixels x 16 pixels — but their value is significant.
Obviously, icons are useful in many ways. But how can the favicon help you? Well, as a marketer, favicons help people know where they are in the vast internet. A quick glance to the tab and you know whether you are on Facebook, or Google, or McDonald’s. Also, it helps people find you again in their favorites or bookmarked webpages. It’s just one more way that you can repeat impressions of your brand into the minds of your audience. As a consumer, it would be redundant to state the already mentioned benefits that it brings to you (like easily recognized websites). So if any of you are like me, you may have multiple tabs being used in your browser. I’m constantly flipping between tabs, and it is definitely easier to tell which tab I need by the wonderful little favicon. Now, I’m a hardcore internet junkie, so maybe this is not true of you. Regardless, you probably find the favicon useful in your own way.
So now that we have established the advantage of having a favicon, where can you obtain one? Well, of course your graphic/web designer could help you out, if you have one. But, if you set up your own website, there are tools to help you out. And the best part is: they are free! I love free tools! The following links will take you to a couple of the tools I have found useful during my favicon usage:
- Favicon Generator — this favicon generator will take your jpeg, png, gif, tiff and bmp files and turn them into cute little favicons (.ico files). This generator can also create larger icons for other uses (ie: desktop icons). I have used this successfully several times.
- Favicon Designer — this tool allows you to draw out your own favicon with a 16×16 grid. As you draw your favicon, a preview is shown, so you can see exactly what you’ve got. This tool also has the ability to make your favicon animated (however, not all browsers support animated favicons).
Go ahead and try them out… a few things to remember though:
- Keep it simple when trying to convert an image to an icon. Large, detailed designs become indistinct when minimized to the final 16×16 size.
- Use just a few colors. This helps to keep the file size small, which will aid in download speed. Sticking to just a couple of contrasting colors also helps to keep the icon looking sharp and recognizable.
- To apply your favicon to your website, use <link rel=”shortcut icon” href=”favicon.ico” /> (of course, the url may need to be change depending on the location of your favicon. For example, my favicon is located in my images folder, so I use the url “images/favicon.ico”).
Now have fun creating your very own favicons!