How to add an icon to your web site

I wanted to add a mug shot of myself as this web site's icon. To create the icon, I started with an 8 megapixel photograph of myself that I had used for an ID card. Using the GIMP, I cropped it into a 2150x2150 pixel square, just barely chopping off the top of my head and the bottom of my chin. Then I scaled the image down to a 16x16 pixel square and made the background transparent. I saved it as favicon.ico, with these icon details: 4bpp, 1-bit alpha, 16-slot palette. I copied the file to the root directory of my web site's local staging area, applied chmod a+r to it, and uploaded it to the server.

My web server is Apache 2.0.54. To make Apache serve the icon with the right MIME type, I added this line to /etc/httpd/conf/httpd.conf:

AddType image/x-icon    .ico

To make my web browser load the icon, I cleared the browser's cache, visited the web site, and marveled as my tiny mug shot appeared in the browser tab.

Here are some of the resources I consulted:

No comments:


Related Posts with Thumbnails