favicon.ico

What is favicon.ico (AKA favicon) ?

It is that little icon that “identifies” a web site. It will show up in your browser in the address bar, on the tab, and in your bookmarks (assuming your browser supports favicons).

I find there are two methods that can be used to make a favicon.

First, make an icon in the gimp. The displayed size is 16×16, but you may be able to improve the image quality if you start with an image 32×32 or 50×50. Save the image as a .png

Then, on your server, copy the image to your web root directory (/var/www for example) and rename it to favicon.ico.

=========

The second method is a little more fun as it involves building from source. There is a little application called “png2ico”

To install (compile) it on Ubuntu ~

First install the dependencies :

apt-get install build-essential libpng12-0 libpng12-dev

Now lets build (compile) it. Personally I like to build in ~/src

So, first lets make a directory for building png2ico and cd into it.

mkdir ~/src
cd ~/src

Next download the source code:

wget http://winterdrache.de/freeware/png2ico/data/png2ico-src-2002-12-08.tar.gz

Unpack the tar ball, and cd into the new directory, also called png2ico

tar -xvzf png2ico-src-2002-12-08.tar.gz
cd png2ico

And finally compile it. The application will be built in ~/src/png2ico and the binary is called png2ico :

make

Note: no ./configure for this one.

make install

You may link, move, or copy the binary (png2ico) to ~/bin or /usr/local/bin

sudo ln -s ~/src/png2ico/png2ico /usr/local/bin/png2ico

Use (assuming png2ico is now on your path) :

png2ico favicon.ico source.png

Note : The size of the source.png is important, it myst be in multiples of 8 (16×16 or 32×32).

The only option is –colors n , where n is the number of colors to use in your favicon.

# 16 colors

png2ico –colors 16 favicon.ico source.png

# Black and white

png2ico –colors 2 favicon.ico source.png

Again, save your favicon.ico to your web root (/var/www for example).

This entry was posted in Linux. Bookmark the permalink.

Leave a Reply

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

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>