GIMPing a "favicon" (Shallow Thoughts)

GIMPing a "favicon"

"Favicons" are those little icons you see to the left of the URLbar in a browser, and for each site in the bookmarks menu or toolbar. They're just a file named favicon.ico in the top level of a web site, and they're a nice addition to a site. (More details in the Wikipedia entry.)

I'd made a few favicons in the distant past by creating a 32x32 image, saving it as ppm, then using ppmtowinicon. But when I tried it in GIMP recently, I ran into trouble.

GIMP can save ICO files: Save As, click Select File Type and choose "Microsoft Windows icon (ico)". That gets you a dialog where you have to choose a color depth and palette. I tried different settings, but the resulting images never showed up properly in Firefox.

But then I tried saving as ppm and using ppmtowinicon and that no longer worked either. Argh! What's up?

The silly answer, it turns out, is that it had nothing to do with how GIMP was saving the images. The problem was that Firefox caches favicons, and shift-reload or Clear Cache doesn't help. When you're testing a new favicon, you have to load the url for the favicon.ico itself (and reload it if necessary). Success at last! It even handles transparency, so you can make shaped favicons that show up nicely against a tab, menu or toolbar background.

Of course, editing a 32x32 pixel image is a fun exercise in itself. I recommend using a second view (View->New View). Expand one view a lot (800x works well) so you can edit individual pixels, while the other view remains at normal size so you can see your final icon as others will see it in the browser.

Tags: gimp
[ 11:57 Aug 15, 2006    More gimp | permalink to this entry | ]