Create an Animated Favicon
Many people create a favicon which also known as a website icon, page icon or urlicon to associate it with their own webpage. It is somehow an identity or a logo representing a website. Favicon is quite popularly used nowadays. Web designers will create their preferred favicons and users can see them in the browser’s URL bar, next to the site’s name in lists of bookmarks, and next to the page’s title in a tabbed document interface. Technically to create a favicon or even an animated favicon is not that complicated and difficult. You can create your own favicon and make your webpage or blogs looks more professional and more interesting via a useful online free service, FavIcon from Pics.
FavIcon from Pics allow users to create their favicon via a very simple mechanism. What an user need to do is just log in to the website, select a picture, logo or other graphic for the “Source Image” and click “Generate FavIcon.ico” Within a few seconds, the user will get a favicon file that’s based on the selected image.
![]()
To add the favicon created to the webpage, there is instruction from the page to lead the user. In this case, the user need to:
• Click “Download FavIcon” and open the package. favicon.ico is included in it.
![]()
• Upload the favicon.ico file to the folder on the user’s web site where user has the web page.
• Add the following HTML tag to the user’s web page after the
tag, before the tag:It’s done!
To test the new favicon in Internet Explorer, the user can add his site to Favorites and reopen the page. To test it in Firefox or other Mozilla-based browser, simply open the user’s web page and watch the address bar or the page tab.
Related Articles
- How to Update Google’s New Favicon in Firefox
- Design Favicon for Google
- New Google g Favorite Icon Sucks? Revert Back to Old Favicon Hack
- How to Resize Firefox Tabs to Become Its Favicon Size
- Firefox Addon: Gmail Unread Message Count in Favicon
- Animated Google Korea Page
- Download Cropper Screen Capture v1.9.1 Freeware to Record Animated Image in Simple Way
- Create Custom Webclips Easily for iPhone
- Create and Host Website for Free at Weebly
- Six-Panel Display Animated 3D Image with Latest gCubik










































September 12th, 2009 21:36
I really like favicons, and really loved this info. Cheers mate.
February 14th, 2009 16:20
It’s indeed not to difficult. The trick is however, to create a favicon that does not irritate the user. Suppose you have 10 tabs, and they all animated in a flashy way. Therefore you should be carefull.
I have actually launched a new favicon concept last week. I’ve created six animated favicons (different favicons for different tabs/ares), integrated with my (own) personal brand strategy. That implies that my face is shown, including attributes. On opening a page (or bookmarks) they are standing still, actually 80% of the time. After a little, sometimes funny, movie is played in the favicon.
Here’s the site and a posting with lots of background info:
http://www.erwinvanlun.com/ww/full/animated_favicons/
For the next step I consider let the favicon ‘play’ with the title or starting a sound. That would be great. But it should all be very subtle, as lots of animated favicons will soon irritate.
I’m interested in what you think!
January 11th, 2009 16:00
Hey!
thanks for the information on this. Was useful for me.
September 24th, 2008 17:38
helpful for me……
May 28th, 2008 00:01
How can I make the icon roll from up to down
January 25th, 2008 22:20
[...] have discussed on setting up an animated favicon in the previous post. The process is pretty simple. How about creating some custom website webclip icons to show news [...]