Sep
19

Tutorial: create animated favicon

Valters BožeDevelopment, search engine optimization, web

Animated favicon is supported only by Firefox, for now. (Are you still using Internet Explorer??
) If you don`t know how to create a simple favicon – just put an icon file with name “favicon.ico” in your web root folder (e.g. www.yourdomain.com/favicon.ico).

Animated favicons are stored in .gif image. You can see an example of animated icon at information security awareness blog , it shows in the address bar and on the tab. You can create it yourself using some gif animation software or exporting from Adobe Flash (I do it). When you have your gif icon ready, upload both “favicon.ico” and “favicon.gif” to your web root folder, then add this code to your webpage somewhere between <head> and </head> tags:

<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
<link rel="icon" href="/favicon.gif" type="image/gif" >
That should do it! You can also create both static and animated icon files from any image (favicon from jpg, jpeg, gif, bmp, tif, png, etc) using a favicon generator available here.

2 Responses to “Tutorial: create animated favicon”

  1. Yellow SEO

    Thats real cool Valters, I didn’t know you could animated a favicon, I just ran made one for my website Yellow SEO.

    February 2nd, 2009 | 11:16
  2. Valters Bože

    thanks, i appreciate that ;)

    April 20th, 2009 | 02:34

Leave a Reply

Bad Behavior has blocked 191 access attempts in the last 7 days.