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

A favicon is that little image that most browsers display on the tackle line 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 aid it) and derives from “Favorites Icon”. Each browser has a unique user interface, and for that reason uses the favicon in different ways. The favicon allows a company to help expand promote its identity and photo by displaying a logo, a graphical message, etc. Typically, the favicon reflects the appearance and feel of the web site 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 photos. They are used because in a few locations a 16×16 pixel graphic is desired, and in some cases a 32×32 image may be needed. Sometimes a 16 coloring image is desired, and often a 256 color icon is desired.
You probably already knew all the above.
But did you know that Firefox can screen animated favicons? If you don’t trust me, open Firefox and head to my site, (there must be a link at the bottom of the article). if you don’t have Firefox, download it, it’s a “must have” and you may quickly fall in love with the simplicity and convenience 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 every browsers. You would think that all websites should look exactly the same, but as browsers become more diverse and much more sophisticated, standards aren’t respected and things can get messy. For example, I just discovered that a few pages on my web site don’t look needlessly to say in the latest version of Opera and need to be adjusted.
Ok, I hope by now you observed my animated favicon in Firefox and came back to the article to learn more about it…
The main reason why you can see animated favicons in Firefox is basically because Firefox abolished the proprietary ICO 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 top secret, the animated favicon is only a tiny animated GIF.
Here’s a very neat trick, that may actually be used to visualize how any photograph looks 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 webpage with any graphic that you will be interested in. Right click the image and chose “View Impression” from the dialog. A blank site should display with your chosen image and surprise: you can see a miniature 16×16 copy of the photo as a favicon! Uhh… do I have to mention again that we are doing all this in Firefox?
A hacker’s mind will immediately think of how great it would be to utilize this feature as a change tool. Unfortunately, unlike Internet Explorer and Opera, Firefox doesn’t store FavIcons in .ico documents, the icons are stored in an encoded format immediately in the bookmark file.
You can apply the same principle to animated GIFs and you may notice that a miniature type 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 usually browser compatibility. Animated favicons aren’t treated at all by Internet Explorer. A static image will never be extracted from the animation often. Alternatively, the default .htm icon (as defined in Windows’ filetypes) will be placed under one’s Favorites – once added, that is. The animations are not reinforced by Netscape, Opera, Konqueror, Safari; at least so it seems during this writing. The Firefox family seems to be the only friend to animations, however as browsers evolve, broader help for animation will probably come along (or, the concept will die).
So, why not take advantage of this *right now* 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 other location.
3. You hardcode in your page the location where Firefox should search for the animation.
That’s really it, “big picture” wise.
Unless you feel too creative or just don’t have time and/or patience, a reputable professional design firm (such as Bsleek) should be able to create a nice animated favicon for you personally. Another alternative – I don’t endorse it, as your goal ought to be to excel through unique articles and push your personal image out there – is to find one of the numerous galleries online and either download a prepared made animated favicon or have a large animated GIF and resize it and/or edit it in another of the countless available tools. There are also sites that offer online animated favicon creation from a standard image (check out, find “FavIcon from pics”, they have a simple but neat scrolling text feature).
In case you are however a fellow do-it-yourselfer, subsequently let’s elaborate and appearance at some techniques and useful tips:
So far as tools go: If you are a lucky user of Adobe’s excellent Photoshop, you then also have a companion software called ImageReady. Linux users have Gimp, a remarkably powerful and free graphics program that can easily handle animated GIF generation. What many people have no idea is that Gimp can be available for free for Home windows and the Mac. Addititionally there is GIMPShop in the wild, that is a nifty GIMP variation for the photoshop-inclined visitors (did I mention free?). Additionally, there are many specialized GIF animation manufacturers, some freeware, some not.

Author: admin

Leave a Reply

Your email address will not be published. Required fields are marked *