How to Create an Animated Favicon for Free
How to create favicon is the old question answered by many bloggers already.But the Latest blogs are rocking with animated favicon.So,its the time to change your favicon to animated.How to create animated favicon?
5 Steps to Create: Following simple 5 steps will Do the needful
- Create you own image at Cooltext (Can be of any size)
- Generate 16*16 size animated .ico File from Animatedfavicon (Free site to create Animated Favicon)
- Click the “Get It Now” button above, this will download the a .zip file. Unzip it and your favicon.ico file is inside.
- Upload the favicon.ico and Animated_favicon.gif files to your web site root folder
- Enter the following simple code in your WordPress file (header.php or any suitable file)
<link rel=”shortcut icon” href=”favicon.ico” >
<link rel=”icon” href=”animated_favicon.gif” type=”image/gif” >TechZoomIn animated favicon:
The first link is the regular favicon that will be shown in browsers that don’t support animated favicons. The second link is the animated favicon which will be displayed in supporting browsers like Firefox.
Browser Support: All the browsers doesn’t support the animated favicons. Firefox is the only browser currently supporting these favicons. IE,Safari,Chrome and all the other browsers are currently not supporting animated favicons,but in future they may.The second link in the above code will get invoked at that time.
You can have different favicons for supported and not supported browsers.I mean you can set one favicon for IE and other for Firefox.For this simply give different favicon file location in the above 2 lines code.
Which favicon you’re using animated or standard? Share with us! Happy Blogging!
Great post for me Lax.Because i don’t have favicon yet and even i didn’t remember to have it.
Now straigh away i will create animated for my site.Thank you very much for reminding and guiding.
Hello,
I recomended http://www.genfavicon.com/
@stestuff,
Yes i saw there was no favicon for your blog.So Lets see how good you design it
@David,
Of course genfavicon is also good site to generate favicons.Thats for sharing that david.
Thanks for the tip
@Lax very useful to create favions for websites and blogs ,though my blogshows bloggers “B” icon , I had not thought of creating favicon for my blog till now.
@Karthikeyan,
Thanks for the Comment yar.
@Venkat,
Ha blogspot favicon is good.Even it would be brand symbol to have your own favicon.
Good that you reminded everyone to have favicon or to enhance favicon.
Thanks for reminding.
Nice tutorial dude. I followed similar steps to create the fav icon for my blog.
@Nancy,
Thanks for comments nancy.
@Nihar,
I saw your animated favicon longback itself.Good one to have.
Good stuff.I had static favicon for my blog till now..But after seeing you points I’m designing animated for it.
Favicon animation is NOT the holy grail. It will soon irritate visitors when not applied carefully. Animating a favicon is not difficult. Creating a good animating favicon, that’s a real challenge.
I think I’ve made an attempt to find a solution. I have just launched a concept with animated favicons. 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 while, a 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!
@TJG,
Good dude…will see you soon with animated then.
@Erwin,
Dynamic favicons with faces and all is awesome idea dude..Of course future bloggers may come with sound and diff kind of favicons as you said.
Thanks for the great idea here Erwin.
I have a blog…
How can I upload to Root Folder?
Please explain me step by step procedure for blogger…
If you are great you can post a Screenshot Procedure.
Thank you in Advance
You are right that favicons is what bloggers want to have in their blogs especially for newbies.
Favicons represents your blog as a brand logo of your site.
Most bloggers today, are using the blogspot format because it is free. But most of them don’t know how to put a favicon in their blog.
For me, adding favicon (image and animated) is very easy and simple to Do. All you need to know is, you know how to use a image editing software like adobe photoshop. After creating an image of 16*16 pixels animated or not, upload it to photobucket or any image sharing sites you knew.
After that, get the URL of the image, see the codes below.
Then, copy the codes and paste it between tag of your html template.
Note: This is a short information for blogger/blogspot features only.
Nice sharing Felix..it helps a lot bloggers using blogspot touse favicon in their blog.