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

A favicon is that little image that a lot of browsers display on the tackle series and in the favorites (bookmarks) menus. Tabbed browsers like Firefox and Opera expand the functionality of favicons, adding them to their tabs. The name was coined based on Internet Explorer (the initial browser to support it) and derives from “Favorites Icon”. Each browser has a unique user interface, and as a result uses the favicon in different ways. The favicon allows a company to further promote its identity and picture by displaying a company logo, a graphical message, etc. Generally, the favicon reflects the appearance and feel of the web page or the organization’s logo.
A traditional favicon is actually a Microsoft Windows ICO data file. An ICO file is truly a repository of bitmap like images. They are used because in some locations a 16×16 pixel graphic is desired, and in some cases a 32×32 image could be needed. Sometimes a 16 shade image is desired, and quite often a 256 shade icon is desired.
You probably already knew all the above.
But did you know that Firefox can display animated favicons? If you don’t trust me, open Firefox and head to my site, (there should be a link in the bottom of the article). unless you have Firefox, download it, it is a “must have” and you may quickly fall in love with the simplicity and capability of tabbed browsing. Even if 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 think that all websites should look the same, but as browsers are more diverse and much 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 needlessly to say in the most recent version of Opera and ought to be adjusted.
Ok, I hope right now you observed my animated favicon in Firefox and came back to the article for more information about it…
The main reason why you can observe animated favicons in Firefox is because Firefox abolished the proprietary ICO structure in favor of the opportunity to display any supported image format in the favicon location, like BMP, JPG, GIF, PNG and… animated GIFs.
So now you understand the big key, the animated favicon is nothing but a tiny animated GIF.
Here is a very neat trick, that may actually be used to visualize how any impression appears like as a 16×16 pixel icon – as soon as you start designing one of 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 webpage should display with your chosen image and surprise: you can observe a miniature 16×16 copy of the graphic as a favicon! Uhh… carry out I must mention again that people are doing all this in Firefox?
A hacker’s mind will immediately think about how great it could be to utilize this feature as a alteration tool. Unfortunately, unlike WEB BROWSER and Opera, Firefox doesn’t retail store FavIcons in .ico data files, the icons are stored in an encoded format straight in the bookmark file.
You can apply the same principle to animated GIFs and you will notice that a miniature variation of the animation as well plays in the street address bar and on the tabs.
Perhaps one of the main reasons why you don’t note that many sites using animations is certainly browser compatibility. Animated favicons aren’t treated at all by WEB BROWSER. A static image will never be extracted from the animation frequently. As an alternative, the default .htm icon (as defined in Windows’ filetypes) will 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 during this writing. The Firefox friends and family seems to be the only friend to animations, yet as browsers evolve, broader assistance for animation will most likely come along (or, the concept will die).
So, why not take advantage of this *today* and ‘beat the rush’?
Basically, this is how it’s done:
1. You make 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 location where Firefox should look for the animation.
That’s really it, “big image” wise.
Unless you feel too creative or simply don’t possess time and/or patience, a reputable professional design firm (such as for example Bsleek) should 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 possibly download a ready made animated favicon or have a large animated GIF and resize it and/or edit it in another of the many available tools. There are also sites that offer online animated favicon creation from the standard image (check out, discover “FavIcon from pics”, they will have a simple but neat scrolling text feature).
If you are however a fellow do-it-yourselfer, then simply let’s elaborate and appearance at some techniques and useful tips:
As far as tools go: If you’re a lucky operator of Adobe’s excellent Photoshop, you then also have a companion request called ImageReady. Linux users have Gimp, an incredibly powerful and free graphics use that can easily handle animated GIF creation. What many people have no idea is that Gimp is also available for free for House windows and the Mac. Addititionally there is GIMPShop in the wild, which is a nifty GIMP version for the photoshop-inclined visitors (did I mention free?). There are also many specialized GIF animation makers, some freeware, some not.

Related Posts