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

A favicon is definitely that little image that a lot of browsers display on the address range and in the favorites (bookmarks) menu. Tabbed browsers like Firefox and Opera prolong the operation of favicons, adding them with their tabs. The brand was coined predicated on Internet Explorer (the first browser to aid it) and derives from “Favorites Icon”. Each browser has a unique interface, and for that reason uses the favicon in different ways. The favicon allows a company to help expand promote its identity and graphic by displaying a logo, a graphical message, etc. Often, the favicon reflects the look and feel of the website or the organization’s logo.
A traditional favicon is truly a Microsoft Windows ICO document. 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 quite often a 32×32 image may be needed. Sometimes a 16 color image is desired, and in some cases a 256 shade icon is desired.
You probably already knew all the above.
But did you know that Firefox can exhibit animated favicons? If you don’t believe me, open Firefox and head to my site, (there should be a link in the bottom of the article). if you don’t have Firefox, download it, it is a “must have” and you will quickly love the simplicity and capability of tabbed browsing. Even if you aren’t a designer but only a site owner, in today’s environment you absolutely got to know how your site looks in every browsers. You would believe that 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 site don’t look as expected in the most recent version of Opera and have to be adjusted.
Ok, I hope right now you found my animated favicon in Firefox and returned to the article to learn more about it…
The main reason why you can observe animated favicons in Firefox is basically because Firefox abolished the proprietary ICO file format in favor of the ability to display any supported image formatting in the favicon location, like BMP, JPG, GIF, PNG and… animated GIFs.
So now you understand the big secret, the animated favicon is only a tiny animated GIF.
Here’s a very neat trick, that can actually be utilized to visualize how any graphic appears like as a 16×16 pixel icon – once you start designing among those, you will realize that it is very hard to make a legible image on a 16 square pixels canvas:
Find any page with any graphic that you are interested in. Right click on the image and chose “View Photograph” from the dialog. A blank site should display with your chosen image and surprise: you can see a miniature 16×16 copy of the graphic as a favicon! Uhh… carry out I must mention again that we are doing all this in Firefox?
A hacker’s mind will immediately think about how great it would be to utilize this feature as a conversion tool. Unfortunately, unlike WEB BROWSER and Opera, Firefox doesn’t retail outlet FavIcons in .ico data, the icons are stored in an encoded format immediately in the bookmark file.
You can apply exactly the same principle to animated GIFs and you will notice that a miniature variant of the animation furthermore plays in the handle bar and on the tabs.
Perhaps one of many reasons why you don’t note that many sites using animations is usually browser compatibility. Animated favicons are not treated at all by WEB BROWSER. A static image will not be extracted from the animation possibly. Alternatively, the default .htm icon (as defined in Windows’ filetypes) will undoubtedly be placed directly under one’s Favorites – once added, that’s. The animations are not reinforced by Netscape, Opera, Konqueror, Safari; at the very 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 help for animation will probably come along (or, the concept will die).
So, why not benefit from this *right now* and ‘beat the rush’?
Basically, this is one way it’s done:
1. You make a 16×16 animated GIF.
2. You upload the animated GIF to the “root” of your site, or to any other location.
3. You hardcode in your page the positioning where Firefox should look for the animation.
That’s really it, “big picture” wise.
Unless you feel too creative or simply don’t have time and/or patience, an established professional design firm (such as for example Bsleek) should be able to make a nice animated favicon for you personally. Another alternative – I don’t endorse it, as your goal should be to excel through unique content material and push your personal image out there – is to find one of the many galleries online and sometimes download a all set made animated favicon or have a large animated GIF and resize it and/or edit it in one of the countless available tools. There are also sites that offer online animated favicon creation from a standard image (have a look at, discover “FavIcon from pics”, they have a straightforward but neat scrolling text feature).
Should you be however a fellow do-it-yourselfer, subsequently let’s elaborate and look at some techniques and useful tips:
As far as tools go: If you are a lucky owner of Adobe’s excellent Photoshop, then you also have a companion program called ImageReady. Linux consumers have Gimp, an incredibly powerful and free graphics software that may easily handle animated GIF development. What many people have no idea is that Gimp is also available for free for Home windows and the Mac. There is also GIMPShop in the wild, which is a nifty GIMP release for the photoshop-inclined viewers (did I mention free?). Additionally, there are many specialized GIF animation manufacturers, some freeware, some not.

Related Posts