Thursday, March 29, 2007

How to make a Favicon?

Did anyone notice something new? No? Look again... Okay.. if you did notice, good and if not, look at the corner of your browser's address bar. You should be able to see a miniature image of myself. Many websites and blogs are branding themselves by introducing this kind of image or logo appended to their web address. Its called Favicon (fav-eye-con). Its very easy to make and fun to have. Besides it gives your readers, a visual perspective of yourself or of your persona. So do you wanna have one? I can show you how....

---->>> First you need to have an image or logo ready for your Favicon.
If you are a blogger, the best Favicon would be your image as a Favicon. If you are an artist kinda person or wanna keep your identity personal and rather represent the flavor of your blog or your personality with a logo, you can either use MS Paint or PhotoShop.

---->>>> Now you can either use Irfanview - Download Here - or GIMP - Download Here - to crop and convert the image to size 16x16 and file extension .ico

---->>>> I used GIMP as it lets you resize and convert the image file very easily.
Once you have downloaded GIMP, open the image you wanna make a Favicon of, with GIMP.

---->>>> Then Right click on the image -> image -> Scale Image....



---->>>> Scale Image window would pop up.



---->>>> Adjust Image Size. Adjust Height to - 16, Width to - 16 and click on the little nexus right beside of the height and width boxes. Then click Scale.



Then Go to File--->>Save As---->>>Microsoft Windows Icon---->>> Save.



For additional help: http://www.gimp.org/tutorials/Lite_Quickies/

Now, Upload this .ico image on Tripod as many other image hosting sites might not allow you to upload .ico file. When you upload this image on tripod, please DO NOT upload the image in private folder under file manager. Create a public folder and then upload the image in the public folder.
The reason to create a public folder is that if you'd store the image in private folder, users might not see your Favicon as they don't have your user id and password for tripod.

After doing that, add following HTML between < head > < /head > tags.

HTML:

< LINK REL="SHORTCUT ICON" HREF="http://yourusername.tripod.com/_public/yourfilename.ico" >

That's it! You should see your icon now, if you did it correctly.

Hope you would find this helpful.

No comments: