The Favicon, an Untapped Picture Promotion Trick – Animated Favicons?

A favicon is that little image that most browsers display on the deal with series and in the favorites (bookmarks) menu. Tabbed browsers like Firefox and Opera lengthen the efficiency of favicons, adding them to their tabs. The name was coined predicated on Internet Explorer (the first browser to support it) and derives from “Favorites Icon”. Each browser has a unique interface, and as a result uses the favicon in different ways. The favicon allows a company to help expand promote its identity and graphic by displaying a logo design, a graphical message, etc. Usually, the favicon reflects the look and feel of the website or the organization’s logo.
A traditional favicon is actually a Microsoft Windows ICO file. An ICO file is truly a repository of bitmap like pictures. They are used because in some locations a 16×16 pixel photo is desired, and often a 32×32 image could be needed. Sometimes a 16 coloring image is desired, and occasionally a 256 color icon is desired.
You probably already knew all of the above.
But did you know that Firefox can display animated favicons? Unless you trust me, open Firefox and go to my site, (there must be a link in the bottom of the article). unless you have Firefox, download it, it is a “must have” and you will quickly fall in love with the simplicity and capability of tabbed browsing. Even though you aren’t a designer but just a site owner, in today’s environment you absolutely got to know how your site looks in all browsers. You would believe all websites should look exactly the same, but as browsers are more diverse and more sophisticated, standards aren’t respected and things will get messy. For example, I simply discovered that several pages on my webpage don’t look as expected in the latest version of Opera and must be adjusted.
Ok, I hope by now you saw my animated favicon in Firefox and came back to the article to learn more about it…
The main reason why you can observe animated favicons in Firefox is because Firefox abolished the proprietary ICO format in favor of the opportunity to display any supported image formatting in the favicon location, incorporating BMP, JPG, GIF, PNG and… animated GIFs.
So now you know the big key, the animated favicon is only a tiny animated GIF.
Here’s a very neat trick, that can actually be used to visualize how any photo looks like as a 16×16 pixel icon – as soon as you start designing among those, you will realize that it is extremely hard to make a legible image on a 16 square pixels canvas:
Find any webpage with any graphic that you will be interested in. Right click the image and chose “View Image” from the dialog. A blank web page should display with your chosen image and surprise: you can observe a miniature 16×16 copy of the photograph as a favicon! Uhh… carry out I have to mention again that people are doing all this in Firefox?
A hacker’s mind will immediately think of how great it will be to use this feature as a conversion tool. Unfortunately, unlike Internet Explorer and Opera, Firefox doesn’t store FavIcons in .ico documents, the icons are stored in an encoded format straight in the bookmark file.
You can apply exactly the same principle to animated GIFs and you may notice that a miniature type of the animation also plays in the deal with bar and on the tabs.
Perhaps one of many reasons why you don’t see that many sites using animations can be browser compatibility. Animated favicons aren’t treated at all by Internet Explorer. A static image will never be extracted from the animation possibly. As an alternative, the default .htm icon (as defined in Windows’ filetypes) will undoubtedly be placed under one’s Favorites – once added, that’s. The animations are not backed by Netscape, Opera, Konqueror, Safari; at least so it seems at the time of this writing. The Firefox friends and family seems to be the only real friend to animations, but as browsers evolve, broader help for animation will probably come along (or, the idea will die).
So, why not take advantage of this *today* and ‘beat the rush’?
Basically, this is one way it’s done:
1. You create a 16×16 animated GIF.
2. You upload the animated GIF to the “root” of one’s site, or to any location.
3. You hardcode in your page the positioning where Firefox should look for the animation.
That’s really it, “big picture” wise.
If you don’t feel too creative or simply don’t possess time and/or patience, a reputable professional design firm (such as Bsleek) will be able to make a nice animated favicon for you personally. Another choice – I don’t endorse it, as your goal ought to be to excel through unique articles and push your personal image out there – would be to find one of the numerous galleries online and either download a prepared made animated favicon or take a large animated GIF and resize it and/or edit it in another of the many available tools. There also are sites that offer online animated favicon creation from the standard image (have a look at, locate “FavIcon from pics”, they will have a simple but neat scrolling text feature).
If you are however a fellow do-it-yourselfer, after that let’s elaborate and appearance at some techniques and valuable tips:
As far as tools go: If you are a lucky user of Adobe’s excellent Photoshop, you then also have a companion program called ImageReady. Linux customers have Gimp, a remarkably powerful and free graphics software that may easily handle animated GIF generation. What many people don’t know is that Gimp can be available for free for House windows and the Mac. Addititionally there is GIMPShop in the wild, which is a nifty GIMP variation for the photoshop-inclined target audience (did I mention free?). Additionally, there are many specialized GIF animation manufacturers, some freeware, some not.