Have you ever wondered why your blog site is marked with a plain icon whereas other sites are decorated with more interesting icon? See below for an example.
This is icon called “favicon.ico” (shorthand for ‘favorites icon’), which is an icon associated with a particular website or webpage. It normally sits in the root directory of your domain web server, or defined in your html header file, e.g.
<link rel="icon" href="/favicon.ico" mce_href="/favicon.ico"
type="image/x-icon" />
This is an image in ICO format with 16×16 or 32×32 pixels (or larger) in 256 colors. Drawing a favicon.ico is slightly less difficult than creating an ASCII art. However there are easier ways. Here, I’m going to show you how to use free software to create a favicon.ico of your liking in two steps.
- You can start with a Jpeg image of, say a letter, a hat, a rocket, etc. and use Imagicon to convert it to ICO format. Imagicon is downloadable from Devious Codeworks for free. Just drag your Jpeg file to the Imagicon program, you get a file of the same name with .ico extension in the same directory.
- Use another free software Icon Suite, downloadable from here, to trim the unwanted pixels.
Click on the image for larger size
Then save and rename the file to “favicon.ico”, upload it to your web server root directory. You’ll be all set. You should be able to reload your website on any browser to see how this icon will be used in URL window, tab heading and bookmarks. Note that Internet Explorer takes a few reloading to update the favicon. Firefox, Safari and Opera reloads it right away.
Happy window dressing!
[...] post by The Wealthy Netizen Share and Enjoy: These icons link to social bookmarking sites where readers can share and [...]
Like or Dislike:
2 
0
[...] this post about how to make favicon.ico for your website, I found an even easier way. If you have Photoshop [...]
Like or Dislike:
1 
1
Hi! I was surfing and found your blog post… nice! I love your blog.
Cheers! Sandra. R.
Like or Dislike:
0 
1
[Reply]