A favicon (short for favorites icon), also known as a website icon, shortcut icon, url icon, or bookmark icon is a 16x16 pixel square icon associated with a particular website, blog or webpage. Some of my friends asked about installing or adding a favicon to their blogs and stuff related to it. I have tried to include every point related to favicon in this post. So here it is ..
What is a Favicon ?
As I have already mentioned the definition but still the following pictures will make it more clear.
The icons marked in the screenshot above are known as Favicon. The image shows favicon of Blogger. These favicon are shown inside the address bar and on the tabbar whenever a site is shown in the browser.
How to create a favicon for your blog or website ?
There are two ways to create a favicon either you can convert an already existing image to a favicon or you can create a favicon directly.
If you want to create a favicon directly you can use Favicon.cc , it allows you to design a favicon using your imagination. It also allows animation to be included into your favicon.
If you want to create a favicon using a pre existing image, you can use these images to icon services , to create a 16 x 16 icon file which can be used as a favicon.
How to install or add a Favicon(16x16 icon) in a blog or website ?
Now that you have created your favicon, you have to install it in your blog or website. To install or add a favicon you have to include a code in the your blog or website. Before installing the code you should upload the 16 x 16 favicon that you already created. You can use these services to upload your favicon for free. Upload the favicon.
After uploading, copy the URL of the icon file you have uploaded and paste it somewhere, it will be used further in the process.
Copy the following code and paste it between <head> and </head> tags.
<link href='YOUR-ICON-URL' rel='shortcut icon'/>
NOTE: Don't forget to replace the YOUR-ICON-URL with the URL of uploaded icon file. Thats all you have installed a favicon in your blog or website.
Hope you liked this article, Now :
Email This Post
2 comments:
Good Short and precise post. http://www.faviconblog.com
Is a good site to stop by, it has further tutorials on the favicon, and a tool to allow you to create your own.
-Loren
http://www.theteachingbox.com
Here is a simple step by step tutorials to create your own FAVICON easily on
photoshop cs version.
How to create FAVICON using Photoshop?
Post a Comment
I really appreciate readers comments and their suggestions about my Blog's design and its content. Do let us know what do you think of this article.